@patternfly/react-core 6.0.0-alpha.82 → 6.0.0-alpha.83

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 (184) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/components/package.json +1 -1
  3. package/deprecated/package.json +1 -1
  4. package/dist/dynamic/components/AboutModal/package.json +1 -1
  5. package/dist/dynamic/components/Accordion/package.json +1 -1
  6. package/dist/dynamic/components/ActionList/package.json +1 -1
  7. package/dist/dynamic/components/Alert/package.json +1 -1
  8. package/dist/dynamic/components/Avatar/package.json +1 -1
  9. package/dist/dynamic/components/BackToTop/package.json +1 -1
  10. package/dist/dynamic/components/Backdrop/package.json +1 -1
  11. package/dist/dynamic/components/BackgroundImage/package.json +1 -1
  12. package/dist/dynamic/components/Badge/package.json +1 -1
  13. package/dist/dynamic/components/Banner/package.json +1 -1
  14. package/dist/dynamic/components/Brand/package.json +1 -1
  15. package/dist/dynamic/components/Breadcrumb/package.json +1 -1
  16. package/dist/dynamic/components/Button/package.json +1 -1
  17. package/dist/dynamic/components/CalendarMonth/package.json +1 -1
  18. package/dist/dynamic/components/Card/package.json +1 -1
  19. package/dist/dynamic/components/Checkbox/package.json +1 -1
  20. package/dist/dynamic/components/ClipboardCopy/package.json +1 -1
  21. package/dist/dynamic/components/CodeBlock/package.json +1 -1
  22. package/dist/dynamic/components/Content/package.json +1 -1
  23. package/dist/dynamic/components/DataList/package.json +1 -1
  24. package/dist/dynamic/components/DatePicker/package.json +1 -1
  25. package/dist/dynamic/components/DescriptionList/package.json +1 -1
  26. package/dist/dynamic/components/Divider/package.json +1 -1
  27. package/dist/dynamic/components/Drawer/package.json +1 -1
  28. package/dist/dynamic/components/Dropdown/package.json +1 -1
  29. package/dist/dynamic/components/DualListSelector/package.json +1 -1
  30. package/dist/dynamic/components/EmptyState/package.json +1 -1
  31. package/dist/dynamic/components/ExpandableSection/package.json +1 -1
  32. package/dist/dynamic/components/FileUpload/package.json +1 -1
  33. package/dist/dynamic/components/Form/package.json +1 -1
  34. package/dist/dynamic/components/FormSelect/package.json +1 -1
  35. package/dist/dynamic/components/HelperText/package.json +1 -1
  36. package/dist/dynamic/components/Hint/package.json +1 -1
  37. package/dist/dynamic/components/Icon/package.json +1 -1
  38. package/dist/dynamic/components/InputGroup/package.json +1 -1
  39. package/dist/dynamic/components/JumpLinks/package.json +1 -1
  40. package/dist/dynamic/components/Label/package.json +1 -1
  41. package/dist/dynamic/components/List/package.json +1 -1
  42. package/dist/dynamic/components/LoginPage/package.json +1 -1
  43. package/dist/dynamic/components/Masthead/package.json +1 -1
  44. package/dist/dynamic/components/Menu/package.json +1 -1
  45. package/dist/dynamic/components/MenuToggle/package.json +1 -1
  46. package/dist/dynamic/components/Modal/package.json +1 -1
  47. package/dist/dynamic/components/MultipleFileUpload/package.json +1 -1
  48. package/dist/dynamic/components/Nav/package.json +1 -1
  49. package/dist/dynamic/components/NotificationBadge/package.json +1 -1
  50. package/dist/dynamic/components/NotificationDrawer/package.json +1 -1
  51. package/dist/dynamic/components/NumberInput/package.json +1 -1
  52. package/dist/dynamic/components/OverflowMenu/package.json +1 -1
  53. package/dist/dynamic/components/Page/package.json +1 -1
  54. package/dist/dynamic/components/Pagination/package.json +1 -1
  55. package/dist/dynamic/components/Panel/package.json +1 -1
  56. package/dist/dynamic/components/Popover/package.json +1 -1
  57. package/dist/dynamic/components/Progress/package.json +1 -1
  58. package/dist/dynamic/components/ProgressStepper/package.json +1 -1
  59. package/dist/dynamic/components/Radio/package.json +1 -1
  60. package/dist/dynamic/components/SearchInput/package.json +1 -1
  61. package/dist/dynamic/components/Select/package.json +1 -1
  62. package/dist/dynamic/components/Sidebar/package.json +1 -1
  63. package/dist/dynamic/components/SimpleList/package.json +1 -1
  64. package/dist/dynamic/components/Skeleton/package.json +1 -1
  65. package/dist/dynamic/components/SkipToContent/package.json +1 -1
  66. package/dist/dynamic/components/Slider/package.json +1 -1
  67. package/dist/dynamic/components/Spinner/package.json +1 -1
  68. package/dist/dynamic/components/Switch/package.json +1 -1
  69. package/dist/dynamic/components/Tabs/package.json +1 -1
  70. package/dist/dynamic/components/TextArea/package.json +1 -1
  71. package/dist/dynamic/components/TextInput/package.json +1 -1
  72. package/dist/dynamic/components/TextInputGroup/package.json +1 -1
  73. package/dist/dynamic/components/Tile/package.json +1 -1
  74. package/dist/dynamic/components/TimePicker/package.json +1 -1
  75. package/dist/dynamic/components/Timestamp/package.json +1 -1
  76. package/dist/dynamic/components/Title/package.json +1 -1
  77. package/dist/dynamic/components/ToggleGroup/package.json +1 -1
  78. package/dist/dynamic/components/Toolbar/package.json +1 -1
  79. package/dist/dynamic/components/Tooltip/package.json +1 -1
  80. package/dist/dynamic/components/TreeView/package.json +1 -1
  81. package/dist/dynamic/components/Truncate/package.json +1 -1
  82. package/dist/dynamic/components/Wizard/hooks/package.json +1 -1
  83. package/dist/dynamic/components/Wizard/package.json +1 -1
  84. package/dist/dynamic/deprecated/components/Chip/package.json +1 -1
  85. package/dist/dynamic/deprecated/components/DragDrop/package.json +1 -1
  86. package/dist/dynamic/deprecated/components/DualListSelector/package.json +1 -1
  87. package/dist/dynamic/deprecated/components/Modal/package.json +1 -1
  88. package/dist/dynamic/deprecated/components/Wizard/package.json +1 -1
  89. package/dist/dynamic/deprecated/components/package.json +1 -1
  90. package/dist/dynamic/helpers/FocusTrap/FocusTrap/package.json +1 -1
  91. package/dist/dynamic/helpers/GenerateId/GenerateId/package.json +1 -1
  92. package/dist/dynamic/helpers/KeyboardHandler/package.json +1 -1
  93. package/dist/dynamic/helpers/OUIA/ouia/package.json +1 -1
  94. package/dist/dynamic/helpers/Popper/Popper/package.json +1 -1
  95. package/dist/dynamic/helpers/constants/package.json +1 -1
  96. package/dist/dynamic/helpers/datetimeUtils/package.json +1 -1
  97. package/dist/dynamic/helpers/fileUtils/package.json +1 -1
  98. package/dist/dynamic/helpers/htmlConstants/package.json +1 -1
  99. package/dist/dynamic/helpers/package.json +1 -1
  100. package/dist/dynamic/helpers/resizeObserver/package.json +1 -1
  101. package/dist/dynamic/helpers/typeUtils/package.json +1 -1
  102. package/dist/dynamic/helpers/useInterval/package.json +1 -1
  103. package/dist/dynamic/helpers/useIsomorphicLayout/package.json +1 -1
  104. package/dist/dynamic/helpers/useUnmountEffect/package.json +1 -1
  105. package/dist/dynamic/helpers/util/package.json +1 -1
  106. package/dist/dynamic/layouts/Bullseye/package.json +1 -1
  107. package/dist/dynamic/layouts/Flex/package.json +1 -1
  108. package/dist/dynamic/layouts/Gallery/package.json +1 -1
  109. package/dist/dynamic/layouts/Grid/package.json +1 -1
  110. package/dist/dynamic/layouts/Level/package.json +1 -1
  111. package/dist/dynamic/layouts/Split/package.json +1 -1
  112. package/dist/dynamic/layouts/Stack/package.json +1 -1
  113. package/dist/dynamic/styles/package.json +1 -1
  114. package/dist/dynamic-modules.json +2 -2
  115. package/dist/esm/components/Page/Page.d.ts.map +1 -1
  116. package/dist/esm/components/Page/Page.js +8 -8
  117. package/dist/esm/components/Page/Page.js.map +1 -1
  118. package/dist/esm/components/Page/PageBody.d.ts +9 -0
  119. package/dist/esm/components/Page/PageBody.d.ts.map +1 -0
  120. package/dist/esm/components/Page/PageBody.js +10 -0
  121. package/dist/esm/components/Page/PageBody.js.map +1 -0
  122. package/dist/esm/components/Page/PageBreadcrumb.d.ts +5 -1
  123. package/dist/esm/components/Page/PageBreadcrumb.d.ts.map +1 -1
  124. package/dist/esm/components/Page/PageBreadcrumb.js +3 -4
  125. package/dist/esm/components/Page/PageBreadcrumb.js.map +1 -1
  126. package/dist/esm/components/Page/PageSection.d.ts +5 -2
  127. package/dist/esm/components/Page/PageSection.d.ts.map +1 -1
  128. package/dist/esm/components/Page/PageSection.js +3 -6
  129. package/dist/esm/components/Page/PageSection.js.map +1 -1
  130. package/dist/esm/components/Page/index.d.ts +1 -1
  131. package/dist/esm/components/Page/index.d.ts.map +1 -1
  132. package/dist/esm/components/Page/index.js +1 -1
  133. package/dist/esm/components/Page/index.js.map +1 -1
  134. package/dist/js/components/Page/Page.d.ts.map +1 -1
  135. package/dist/js/components/Page/Page.js +7 -7
  136. package/dist/js/components/Page/Page.js.map +1 -1
  137. package/dist/js/components/Page/PageBody.d.ts +9 -0
  138. package/dist/js/components/Page/PageBody.d.ts.map +1 -0
  139. package/dist/js/components/Page/PageBody.js +14 -0
  140. package/dist/js/components/Page/PageBody.js.map +1 -0
  141. package/dist/js/components/Page/PageBreadcrumb.d.ts +5 -1
  142. package/dist/js/components/Page/PageBreadcrumb.d.ts.map +1 -1
  143. package/dist/js/components/Page/PageBreadcrumb.js +3 -4
  144. package/dist/js/components/Page/PageBreadcrumb.js.map +1 -1
  145. package/dist/js/components/Page/PageSection.d.ts +5 -2
  146. package/dist/js/components/Page/PageSection.d.ts.map +1 -1
  147. package/dist/js/components/Page/PageSection.js +3 -6
  148. package/dist/js/components/Page/PageSection.js.map +1 -1
  149. package/dist/js/components/Page/index.d.ts +1 -1
  150. package/dist/js/components/Page/index.d.ts.map +1 -1
  151. package/dist/js/components/Page/index.js +1 -1
  152. package/dist/js/components/Page/index.js.map +1 -1
  153. package/dist/umd/assets/{output-CJBOn_jY.css → output-ZK-DtcVp.css} +1672 -1672
  154. package/dist/umd/react-core.min.js +1 -1
  155. package/helpers/package.json +1 -1
  156. package/layouts/package.json +1 -1
  157. package/next/package.json +1 -1
  158. package/package.json +2 -2
  159. package/src/components/Page/Page.tsx +11 -21
  160. package/src/components/Page/PageBody.tsx +18 -0
  161. package/src/components/Page/PageBreadcrumb.tsx +7 -2
  162. package/src/components/Page/PageSection.tsx +8 -5
  163. package/src/components/Page/__tests__/Page.test.tsx +11 -41
  164. package/src/components/Page/__tests__/PageBody.test.tsx +34 -0
  165. package/src/components/Page/__tests__/PageBreadcrumb.test.tsx +14 -1
  166. package/src/components/Page/__tests__/PageSection.test.tsx +15 -2
  167. package/src/components/Page/__tests__/__snapshots__/Page.test.tsx.snap +950 -973
  168. package/src/components/Page/__tests__/__snapshots__/PageBody.test.tsx.snap +11 -0
  169. package/src/components/Page/__tests__/__snapshots__/PageBreadcrumb.test.tsx.snap +30 -6
  170. package/src/components/Page/__tests__/__snapshots__/PageSection.test.tsx.snap +66 -14
  171. package/src/components/Page/examples/Page.md +2 -11
  172. package/src/components/Page/examples/PageGroupSection.tsx +19 -22
  173. package/src/components/Page/index.ts +1 -1
  174. package/dist/esm/components/Page/PageNavigation.d.ts +0 -31
  175. package/dist/esm/components/Page/PageNavigation.d.ts.map +0 -1
  176. package/dist/esm/components/Page/PageNavigation.js +0 -21
  177. package/dist/esm/components/Page/PageNavigation.js.map +0 -1
  178. package/dist/js/components/Page/PageNavigation.d.ts +0 -31
  179. package/dist/js/components/Page/PageNavigation.d.ts.map +0 -1
  180. package/dist/js/components/Page/PageNavigation.js +0 -25
  181. package/dist/js/components/Page/PageNavigation.js.map +0 -1
  182. package/src/components/Page/PageNavigation.tsx +0 -72
  183. package/src/components/Page/__tests__/PageNavigation.test.tsx +0 -78
  184. package/src/components/Page/__tests__/__snapshots__/PageNavigation.test.tsx.snap +0 -77
@@ -410,6 +410,256 @@
410
410
  margin-inline-end: var(--pf-v6-c-alert__action-group__c-button--not-last-child--MarginInlineEnd);
411
411
  }
412
412
 
413
+ :where(:root, .pf-v6-c-avatar) {
414
+ --pf-v6-c-avatar--BorderColor: transparent;
415
+ --pf-v6-c-avatar--BorderWidth: 0;
416
+ --pf-v6-c-avatar--BorderRadius: var(--pf-t--global--border--radius--pill);
417
+ --pf-v6-c-avatar--Width: 2.25rem;
418
+ --pf-v6-c-avatar--Height: 2.25rem;
419
+ --pf-v6-c-avatar--m-sm--Width: 1.5rem;
420
+ --pf-v6-c-avatar--m-sm--Height: 1.5rem;
421
+ --pf-v6-c-avatar--m-md--Width: 2.25rem;
422
+ --pf-v6-c-avatar--m-md--Height: 2.25rem;
423
+ --pf-v6-c-avatar--m-lg--Width: 4.5rem;
424
+ --pf-v6-c-avatar--m-lg--Height: 4.5rem;
425
+ --pf-v6-c-avatar--m-xl--Width: 8rem;
426
+ --pf-v6-c-avatar--m-xl--Height: 8rem;
427
+ --pf-v6-c-avatar--m-bordered--BorderColor: var(--pf-t--global--border--color--default);
428
+ --pf-v6-c-avatar--m-bordered--BorderWidth: var(--pf-t--global--border--width--box--default);
429
+ }
430
+
431
+ .pf-v6-c-avatar {
432
+ width: var(--pf-v6-c-avatar--Width);
433
+ height: var(--pf-v6-c-avatar--Height);
434
+ border: var(--pf-v6-c-avatar--BorderWidth) solid var(--pf-v6-c-avatar--BorderColor);
435
+ border-radius: var(--pf-v6-c-avatar--BorderRadius);
436
+ }
437
+
438
+ .pf-v6-c-avatar.pf-m-bordered {
439
+ --pf-v6-c-avatar--BorderColor: var(--pf-v6-c-avatar--m-bordered--BorderColor);
440
+ --pf-v6-c-avatar--BorderWidth: var(--pf-v6-c-avatar--m-bordered--BorderWidth);
441
+ }
442
+
443
+ .pf-v6-c-avatar.pf-m-sm {
444
+ --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-sm--Width);
445
+ --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-sm--Height);
446
+ }
447
+
448
+ @media (min-width: 576px) {
449
+ .pf-v6-c-avatar.pf-m-sm {
450
+ --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width));
451
+ }
452
+ }
453
+ @media (min-width: 768px) {
454
+ .pf-v6-c-avatar.pf-m-sm {
455
+ --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)));
456
+ }
457
+ }
458
+ @media (min-width: 992px) {
459
+ .pf-v6-c-avatar.pf-m-sm {
460
+ --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))));
461
+ }
462
+ }
463
+ @media (min-width: 1200px) {
464
+ .pf-v6-c-avatar.pf-m-sm {
465
+ --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)))));
466
+ }
467
+ }
468
+ @media (min-width: 1450px) {
469
+ .pf-v6-c-avatar.pf-m-sm {
470
+ --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))))));
471
+ }
472
+ }
473
+ @media (min-width: 576px) {
474
+ .pf-v6-c-avatar.pf-m-sm {
475
+ --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height));
476
+ }
477
+ }
478
+ @media (min-width: 768px) {
479
+ .pf-v6-c-avatar.pf-m-sm {
480
+ --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)));
481
+ }
482
+ }
483
+ @media (min-width: 992px) {
484
+ .pf-v6-c-avatar.pf-m-sm {
485
+ --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))));
486
+ }
487
+ }
488
+ @media (min-width: 1200px) {
489
+ .pf-v6-c-avatar.pf-m-sm {
490
+ --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)))));
491
+ }
492
+ }
493
+ @media (min-width: 1450px) {
494
+ .pf-v6-c-avatar.pf-m-sm {
495
+ --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))))));
496
+ }
497
+ }
498
+ .pf-v6-c-avatar.pf-m-md {
499
+ --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-md--Width);
500
+ --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-md--Height);
501
+ }
502
+
503
+ @media (min-width: 576px) {
504
+ .pf-v6-c-avatar.pf-m-md {
505
+ --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width));
506
+ }
507
+ }
508
+ @media (min-width: 768px) {
509
+ .pf-v6-c-avatar.pf-m-md {
510
+ --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)));
511
+ }
512
+ }
513
+ @media (min-width: 992px) {
514
+ .pf-v6-c-avatar.pf-m-md {
515
+ --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))));
516
+ }
517
+ }
518
+ @media (min-width: 1200px) {
519
+ .pf-v6-c-avatar.pf-m-md {
520
+ --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)))));
521
+ }
522
+ }
523
+ @media (min-width: 1450px) {
524
+ .pf-v6-c-avatar.pf-m-md {
525
+ --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))))));
526
+ }
527
+ }
528
+ @media (min-width: 576px) {
529
+ .pf-v6-c-avatar.pf-m-md {
530
+ --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height));
531
+ }
532
+ }
533
+ @media (min-width: 768px) {
534
+ .pf-v6-c-avatar.pf-m-md {
535
+ --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)));
536
+ }
537
+ }
538
+ @media (min-width: 992px) {
539
+ .pf-v6-c-avatar.pf-m-md {
540
+ --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))));
541
+ }
542
+ }
543
+ @media (min-width: 1200px) {
544
+ .pf-v6-c-avatar.pf-m-md {
545
+ --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)))));
546
+ }
547
+ }
548
+ @media (min-width: 1450px) {
549
+ .pf-v6-c-avatar.pf-m-md {
550
+ --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))))));
551
+ }
552
+ }
553
+ .pf-v6-c-avatar.pf-m-lg {
554
+ --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-lg--Width);
555
+ --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-lg--Height);
556
+ }
557
+
558
+ @media (min-width: 576px) {
559
+ .pf-v6-c-avatar.pf-m-lg {
560
+ --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width));
561
+ }
562
+ }
563
+ @media (min-width: 768px) {
564
+ .pf-v6-c-avatar.pf-m-lg {
565
+ --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)));
566
+ }
567
+ }
568
+ @media (min-width: 992px) {
569
+ .pf-v6-c-avatar.pf-m-lg {
570
+ --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))));
571
+ }
572
+ }
573
+ @media (min-width: 1200px) {
574
+ .pf-v6-c-avatar.pf-m-lg {
575
+ --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)))));
576
+ }
577
+ }
578
+ @media (min-width: 1450px) {
579
+ .pf-v6-c-avatar.pf-m-lg {
580
+ --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))))));
581
+ }
582
+ }
583
+ @media (min-width: 576px) {
584
+ .pf-v6-c-avatar.pf-m-lg {
585
+ --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height));
586
+ }
587
+ }
588
+ @media (min-width: 768px) {
589
+ .pf-v6-c-avatar.pf-m-lg {
590
+ --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)));
591
+ }
592
+ }
593
+ @media (min-width: 992px) {
594
+ .pf-v6-c-avatar.pf-m-lg {
595
+ --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))));
596
+ }
597
+ }
598
+ @media (min-width: 1200px) {
599
+ .pf-v6-c-avatar.pf-m-lg {
600
+ --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)))));
601
+ }
602
+ }
603
+ @media (min-width: 1450px) {
604
+ .pf-v6-c-avatar.pf-m-lg {
605
+ --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))))));
606
+ }
607
+ }
608
+ .pf-v6-c-avatar.pf-m-xl {
609
+ --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-xl--Width);
610
+ --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-xl--Height);
611
+ }
612
+
613
+ @media (min-width: 576px) {
614
+ .pf-v6-c-avatar.pf-m-xl {
615
+ --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width));
616
+ }
617
+ }
618
+ @media (min-width: 768px) {
619
+ .pf-v6-c-avatar.pf-m-xl {
620
+ --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)));
621
+ }
622
+ }
623
+ @media (min-width: 992px) {
624
+ .pf-v6-c-avatar.pf-m-xl {
625
+ --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))));
626
+ }
627
+ }
628
+ @media (min-width: 1200px) {
629
+ .pf-v6-c-avatar.pf-m-xl {
630
+ --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)))));
631
+ }
632
+ }
633
+ @media (min-width: 1450px) {
634
+ .pf-v6-c-avatar.pf-m-xl {
635
+ --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))))));
636
+ }
637
+ }
638
+ @media (min-width: 576px) {
639
+ .pf-v6-c-avatar.pf-m-xl {
640
+ --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height));
641
+ }
642
+ }
643
+ @media (min-width: 768px) {
644
+ .pf-v6-c-avatar.pf-m-xl {
645
+ --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)));
646
+ }
647
+ }
648
+ @media (min-width: 992px) {
649
+ .pf-v6-c-avatar.pf-m-xl {
650
+ --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))));
651
+ }
652
+ }
653
+ @media (min-width: 1200px) {
654
+ .pf-v6-c-avatar.pf-m-xl {
655
+ --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)))));
656
+ }
657
+ }
658
+ @media (min-width: 1450px) {
659
+ .pf-v6-c-avatar.pf-m-xl {
660
+ --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))))));
661
+ }
662
+ }
413
663
  :where(:root, .pf-v6-c-back-to-top) {
414
664
  --pf-v6-c-back-to-top--InsetInlineEnd: var(--pf-t--global--spacer--2xl);
415
665
  --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-t--global--spacer--lg);
@@ -5559,66 +5809,6 @@ ul) {
5559
5809
  justify-content: center;
5560
5810
  }
5561
5811
 
5562
- :where(:root, .pf-v6-c-file-upload) {
5563
- --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--sm);
5564
- --pf-v6-c-file-upload--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5565
- --pf-v6-c-file-upload--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
5566
- --pf-v6-c-file-upload--PaddingInlineStart: var(--pf-t--global--spacer--sm);
5567
- --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
5568
- --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
5569
- --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
5570
- --pf-v6-c-file-upload--BorderColor: transparent;
5571
- --pf-v6-c-file-upload--BorderStyle: solid;
5572
- --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
5573
- --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
5574
- --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
5575
- --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
5576
- }
5577
-
5578
- .pf-v6-c-file-upload {
5579
- position: relative;
5580
- display: flex;
5581
- flex-direction: column;
5582
- row-gap: var(--pf-v6-c-file-upload--RowGap);
5583
- padding-block-start: var(--pf-v6-c-file-upload--PaddingBlockStart);
5584
- padding-block-end: var(--pf-v6-c-file-upload--PaddingBlockEnd);
5585
- padding-inline-start: var(--pf-v6-c-file-upload--PaddingInlineStart);
5586
- padding-inline-end: var(--pf-v6-c-file-upload--PaddingInlineEnd);
5587
- border: var(--pf-v6-c-file-upload--BorderWidth) var(--pf-v6-c-file-upload--BorderStyle) var(--pf-v6-c-file-upload--BorderColor);
5588
- border-radius: var(--pf-v6-c-file-upload--BorderRadius);
5589
- }
5590
-
5591
- .pf-v6-c-file-upload.pf-m-drag-hover {
5592
- --pf-v6-c-file-upload--BorderColor: var(--pf-v6-c-file-upload--m-drag-hover--BorderColor);
5593
- --pf-v6-c-file-upload--BorderStyle: var(--pf-v6-c-file-upload--m-drag-hover--BorderStyle);
5594
- }
5595
-
5596
- .pf-v6-c-file-upload.pf-m-loading .pf-v6-c-file-upload__file-details {
5597
- position: relative;
5598
- }
5599
-
5600
- .pf-v6-c-file-upload__file-select .pf-v6-c-button.pf-m-control {
5601
- outline-offset: var(--pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset);
5602
- }
5603
-
5604
- .pf-v6-c-file-upload__file-details {
5605
- position: relative;
5606
- display: flex;
5607
- }
5608
-
5609
- .pf-v6-c-file-upload__file-details .pf-v6-c-form-control {
5610
- flex: 1 1 auto;
5611
- min-height: var(--pf-v6-c-file-upload__file-details__c-form-control--MinHeight);
5612
- border-block-start: 0;
5613
- }
5614
-
5615
- .pf-v6-c-file-upload__file-details-spinner {
5616
- position: absolute;
5617
- inset-block-start: 50%;
5618
- inset-inline-start: 50%;
5619
- transform: translate(-50%, -50%);
5620
- }
5621
-
5622
5812
  :where(:root, .pf-v6-c-expandable-section) {
5623
5813
  --pf-v6-c-expandable-section__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5624
5814
  --pf-v6-c-expandable-section__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -5767,303 +5957,64 @@ ul) {
5767
5957
  padding-inline-end: var(--pf-v6-c-expandable-section__content--PaddingInlineEnd);
5768
5958
  }
5769
5959
 
5770
- :where(:root, .pf-v6-c-form-control) {
5771
- --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--sm);
5772
- --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
5773
- --pf-v6-c-form-control--FontSize: var(--pf-t--global--font--size--body--default);
5774
- --pf-v6-c-form-control--LineHeight: var(--pf-t--global--font--line-height--body);
5775
- --pf-v6-c-form-control--Resize: none;
5776
- --pf-v6-c-form-control--OutlineOffset: -6px;
5777
- --pf-v6-c-form-control--BorderRadius: var(--pf-t--global--border--radius--small);
5778
- --pf-v6-c-form-control--before--BorderWidth: var(--pf-t--global--border--width--control--default);
5779
- --pf-v6-c-form-control--before--BorderColor: var(--pf-t--global--border--color--default);
5780
- --pf-v6-c-form-control--before--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
5781
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-t--global--border--width--control--default);
5782
- --pf-v6-c-form-control--after--BorderColor: transparent;
5783
- --pf-v6-c-form-control--after--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
5784
- --pf-v6-c-form-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
5785
- --pf-v6-c-form-control--Width: 100%;
5786
- --pf-v6-c-form-control--inset--base: var(--pf-t--global--spacer--md);
5787
- --pf-v6-c-form-control--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5788
- --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
5789
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
5790
- --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control--inset--base);
5791
- --pf-v6-c-form-control--hover--after--BorderWidth: var(--pf-t--global--border--width--control--hover);
5792
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-t--global--border--color--hover);
5793
- --pf-v6-c-form-control--focus--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
5794
- --pf-v6-c-form-control--focus--after--BorderColor: var(--pf-t--global--border--color--clicked);
5795
- --pf-v6-c-form-control--m-expanded--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
5796
- --pf-v6-c-form-control--m-expanded--after--BorderColor: var(--pf-t--global--border--color--clicked);
5797
- --pf-v6-c-form-control--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
5798
- --pf-v6-c-form-control--m-placeholder--child--Color: var(--pf-t--global--text--color--regular);
5799
- --pf-v6-c-form-control--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
5800
- --pf-v6-c-form-control--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5801
- --pf-v6-c-form-control--m-disabled--after--BorderColor: transparent;
5802
- --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
5803
- --pf-v6-c-form-control--m-readonly--BorderColor: transparent;
5804
- --pf-v6-c-form-control--m-readonly--hover--after--BorderColor: revert;
5805
- --pf-v6-c-form-control--m-readonly--focus--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
5806
- --pf-v6-c-form-control--m-readonly--focus--after--BorderColor: var(--pf-t--global--border--color--clicked);
5807
- --pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor: transparent;
5808
- --pf-v6-c-form-control--m-readonly--m-plain--inset--base: 0;
5809
- --pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset: 0;
5810
- --pf-v6-c-form-control--m-success--after--BorderWidth: var(--pf-t--global--border--width--control--default);
5811
- --pf-v6-c-form-control--m-success--after--BorderColor: var(--pf-t--global--border--color--status--success--default);
5812
- --pf-v6-c-form-control--m-success--PaddingInlineEnd: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-form-control--ColumnGap));
5813
- --pf-v6-c-form-control--m-warning--after--BorderWidth: var(--pf-t--global--border--width--control--default);
5814
- --pf-v6-c-form-control--m-warning--after--BorderColor: var(--pf-t--global--border--color--status--warning--default);
5815
- --pf-v6-c-form-control--m-warning--PaddingInlineEnd: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-form-control--ColumnGap));
5816
- --pf-v6-c-form-control--m-error--after--BorderWidth: var(--pf-t--global--border--width--control--default);
5817
- --pf-v6-c-form-control--m-error--after--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5818
- --pf-v6-c-form-control--m-error--PaddingInlineEnd: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-form-control--ColumnGap));
5819
- --pf-v6-c-form-control--m-error--icon--width: var(--pf-v6-c-form-control--FontSize);
5820
- --pf-v6-c-form-control--m-icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--inset--base) + var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer));
5821
- --pf-v6-c-form-control--m-icon--icon--width: var(--pf-v6-c-form-control--FontSize);
5822
- --pf-v6-c-form-control--m-icon--icon--spacer: var(--pf-t--global--spacer--sm);
5823
- --pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--inset--base) + var(--pf-v6-c-form-control--m-error--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer));
5824
- --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-t--global--spacer--md);
5825
- --pf-v6-c-form-control__select--PaddingInlineStart: var(--pf-t--global--spacer--md);
5826
- --pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
5827
- --pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
5828
- --pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
5829
- --pf-v6-c-form-control--textarea--Width: var(--pf-v6-c-form-control--Width);
5830
- --pf-v6-c-form-control--textarea--Height: auto;
5831
- --pf-v6-c-form-control__icon--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5832
- --pf-v6-c-form-control__icon--Color: var(--pf-t--global--icon--color--regular);
5833
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
5834
- --pf-v6-c-form-control--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
5835
- --pf-v6-c-form-control--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
5836
- --pf-v6-c-form-control--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
5837
- --pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--sm);
5838
- --pf-v6-c-form-control__utilities--PaddingBlockStart: var(--pf-v6-c-form-control--inset--base);
5839
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
5840
- --pf-v6-c-form-control__toggle-icon--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5841
- --pf-v6-c-form-control__toggle-icon--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
5842
- --pf-v6-c-form-control__toggle-icon--PaddingInlineStart: var(--pf-v6-c-form-control--inset--base);
5843
- --pf-v6-c-form-control__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5844
- --pf-v6-c-form-control--m-disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
5960
+ :where(:root, .pf-v6-c-file-upload) {
5961
+ --pf-v6-c-file-upload--RowGap: var(--pf-t--global--spacer--sm);
5962
+ --pf-v6-c-file-upload--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5963
+ --pf-v6-c-file-upload--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
5964
+ --pf-v6-c-file-upload--PaddingInlineStart: var(--pf-t--global--spacer--sm);
5965
+ --pf-v6-c-file-upload--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
5966
+ --pf-v6-c-file-upload--BorderRadius: var(--pf-t--global--border--radius--small);
5967
+ --pf-v6-c-file-upload--BorderWidth: var(--pf-t--global--border--width--regular);
5968
+ --pf-v6-c-file-upload--BorderColor: transparent;
5969
+ --pf-v6-c-file-upload--BorderStyle: solid;
5970
+ --pf-v6-c-file-upload--m-drag-hover--BorderColor: var(--pf-t--global--icon--color--brand--default);
5971
+ --pf-v6-c-file-upload--m-drag-hover--BorderStyle: dashed;
5972
+ --pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
5973
+ --pf-v6-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-t--global--spacer--3xl) * 2);
5845
5974
  }
5846
5975
 
5847
- .pf-v6-c-form-control {
5976
+ .pf-v6-c-file-upload {
5848
5977
  position: relative;
5849
- display: grid;
5850
- grid-template-columns: 1fr auto;
5851
- column-gap: var(--pf-v6-c-form-control--ColumnGap);
5852
- align-items: start;
5853
- width: var(--pf-v6-c-form-control--Width);
5854
- font-size: var(--pf-v6-c-form-control--FontSize);
5855
- line-height: var(--pf-v6-c-form-control--LineHeight);
5856
- resize: var(--pf-v6-c-form-control--Resize);
5857
- background-color: var(--pf-v6-c-form-control--BackgroundColor);
5858
- border-radius: var(--pf-v6-c-form-control--BorderRadius);
5859
- }
5860
-
5861
- .pf-v6-c-form-control::before, .pf-v6-c-form-control::after {
5862
- position: absolute;
5863
- inset: 0;
5864
- pointer-events: none;
5865
- content: "";
5866
- }
5867
-
5868
- .pf-v6-c-form-control::before {
5869
- border-color: var(--pf-v6-c-form-control--before--BorderColor);
5870
- border-style: var(--pf-v6-c-form-control--before--BorderStyle, solid);
5871
- border-width: var(--pf-v6-c-form-control--before--BorderWidth);
5872
- border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
5873
- }
5874
-
5875
- .pf-v6-c-form-control::after {
5876
- 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);
5877
- border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
5878
- }
5879
-
5880
- .pf-v6-c-form-control > :is(input, select, textarea) {
5881
- grid-row: 1/2;
5882
- grid-column: 1/-1;
5883
- padding-block-start: var(--pf-v6-c-form-control--PaddingBlockStart);
5884
- padding-block-end: var(--pf-v6-c-form-control--PaddingBlockEnd);
5885
- padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
5886
- padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
5887
- color: var(--pf-v6-c-form-control--Color);
5888
- background-color: transparent;
5889
- border: none;
5890
- border-radius: var(--pf-v6-c-form-control--BorderRadius);
5891
- -moz-appearance: none;
5892
- -webkit-appearance: none;
5893
- }
5894
-
5895
- .pf-v6-c-form-control > :is(input, select, textarea):focus {
5896
- outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
5897
- }
5898
-
5899
- .pf-v6-c-form-control > ::placeholder {
5900
- color: var(--pf-v6-c-form-control--m-placeholder--Color);
5901
- }
5902
-
5903
- .pf-v6-c-form-control > :is(input, select) {
5904
- text-overflow: ellipsis;
5978
+ display: flex;
5979
+ flex-direction: column;
5980
+ row-gap: var(--pf-v6-c-file-upload--RowGap);
5981
+ padding-block-start: var(--pf-v6-c-file-upload--PaddingBlockStart);
5982
+ padding-block-end: var(--pf-v6-c-file-upload--PaddingBlockEnd);
5983
+ padding-inline-start: var(--pf-v6-c-file-upload--PaddingInlineStart);
5984
+ padding-inline-end: var(--pf-v6-c-file-upload--PaddingInlineEnd);
5985
+ border: var(--pf-v6-c-file-upload--BorderWidth) var(--pf-v6-c-file-upload--BorderStyle) var(--pf-v6-c-file-upload--BorderColor);
5986
+ border-radius: var(--pf-v6-c-file-upload--BorderRadius);
5905
5987
  }
5906
5988
 
5907
- .pf-v6-c-form-control.pf-m-readonly {
5908
- --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
5909
- --pf-v6-c-form-control--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
5989
+ .pf-v6-c-file-upload.pf-m-drag-hover {
5990
+ --pf-v6-c-file-upload--BorderColor: var(--pf-v6-c-file-upload--m-drag-hover--BorderColor);
5991
+ --pf-v6-c-file-upload--BorderStyle: var(--pf-v6-c-file-upload--m-drag-hover--BorderStyle);
5910
5992
  }
5911
5993
 
5912
- .pf-v6-c-form-control.pf-m-readonly:hover {
5913
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
5994
+ .pf-v6-c-file-upload.pf-m-loading .pf-v6-c-file-upload__file-details {
5995
+ position: relative;
5914
5996
  }
5915
5997
 
5916
- .pf-v6-c-form-control.pf-m-readonly:not(.pf-m-success, .pf-m-warning, .pf-m-error) {
5917
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
5918
- --pf-v6-c-form-control--focus--after--BorderWidth: var(--pf-v6-c-form-control--m-readonly--focus--after--BorderWidth);
5919
- --pf-v6-c-form-control--focus--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--focus--after--BorderColor);
5998
+ .pf-v6-c-file-upload__file-select .pf-v6-c-button.pf-m-control {
5999
+ outline-offset: var(--pf-v6-c-file-upload__file-select__c-button--m-control--OutlineOffset);
5920
6000
  }
5921
6001
 
5922
- .pf-v6-c-form-control.pf-m-readonly.pf-m-plain {
5923
- --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor);
5924
- --pf-v6-c-form-control--inset--base: var(--pf-v6-c-form-control--m-readonly--m-plain--inset--base);
5925
- --pf-v6-c-form-control--before--BorderStyle: none;
5926
- --pf-v6-c-form-control--after--BorderStyle: none;
5927
- --pf-v6-c-form-control--OutlineOffset: var(--pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset);
6002
+ .pf-v6-c-file-upload__file-details {
6003
+ position: relative;
6004
+ display: flex;
5928
6005
  }
5929
6006
 
5930
- .pf-v6-c-form-control:hover {
5931
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
5932
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--hover--after--BorderWidth);
6007
+ .pf-v6-c-file-upload__file-details .pf-v6-c-form-control {
6008
+ flex: 1 1 auto;
6009
+ min-height: var(--pf-v6-c-file-upload__file-details__c-form-control--MinHeight);
6010
+ border-block-start: 0;
5933
6011
  }
5934
6012
 
5935
- .pf-v6-c-form-control.pf-m-expanded {
5936
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-expanded--after--BorderColor);
5937
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-expanded--after--BorderWidth);
5938
- }
5939
-
5940
- .pf-v6-c-form-control.pf-m-disabled {
5941
- --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-disabled--BackgroundColor);
5942
- --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-disabled--Color);
5943
- --pf-v6-c-form-control--m-placeholder--Color: var(--pf-v6-c-form-control--m-disabled--Color);
5944
- --pf-v6-c-form-control__toggle-icon--Color: var(--pf-v6-c-form-control--m-disabled__toggle-icon--Color);
5945
- --pf-v6-c-form-control--before--BorderStyle: none;
5946
- --pf-v6-c-form-control--after--BorderStyle: none;
5947
- cursor: not-allowed;
5948
- }
5949
-
5950
- .pf-v6-c-form-control.pf-m-error {
5951
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd);
5952
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-error--after--BorderColor);
5953
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
5954
- --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd);
5955
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
5956
- }
5957
-
5958
- .pf-v6-c-form-control.pf-m-error.pf-m-icon {
5959
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
5960
- }
5961
-
5962
- .pf-v6-c-form-control.pf-m-success {
5963
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd);
5964
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-success--after--BorderColor);
5965
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-success__icon--m-status--Color);
5966
- --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd);
5967
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-success--after--BorderWidth);
5968
- }
5969
-
5970
- .pf-v6-c-form-control.pf-m-success.pf-m-icon {
5971
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
5972
- }
5973
-
5974
- .pf-v6-c-form-control.pf-m-warning {
5975
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd);
5976
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-warning--after--BorderColor);
5977
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-warning__icon--m-status--Color);
5978
- --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd);
5979
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-warning--after--BorderWidth);
5980
- }
5981
-
5982
- .pf-v6-c-form-control.pf-m-warning.pf-m-icon {
5983
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
5984
- }
5985
-
5986
- .pf-v6-c-form-control.pf-m-icon {
5987
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
5988
- }
5989
-
5990
- .pf-v6-c-form-control > select {
5991
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control__select--PaddingInlineEnd);
5992
- --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
5993
- background-color: var(--pf-v6-c-form-control--BackgroundColor);
5994
- }
5995
-
5996
- @-moz-document url-prefix() {
5997
- .pf-v6-c-form-control > select {
5998
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
5999
- --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
6000
- }
6001
- }
6002
- .pf-v6-c-form-control.pf-m-placeholder > select {
6003
- --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
6004
- }
6005
-
6006
- .pf-v6-c-form-control.pf-m-placeholder > select * {
6007
- color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
6008
- }
6009
-
6010
- .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
6011
- color: revert;
6012
- }
6013
-
6014
- .pf-v6-c-form-control > textarea {
6015
- width: 100%;
6016
- height: 100%;
6017
- vertical-align: bottom;
6018
- resize: none;
6019
- }
6020
-
6021
- .pf-v6-c-form-control.pf-m-resize-vertical {
6022
- --pf-v6-c-form-control--Resize: vertical;
6023
- overflow: auto;
6024
- }
6025
-
6026
- .pf-v6-c-form-control.pf-m-resize-horizontal {
6027
- --pf-v6-c-form-control--Resize: horizontal;
6028
- overflow: auto;
6029
- }
6030
-
6031
- .pf-v6-c-form-control.pf-m-resize-both {
6032
- --pf-v6-c-form-control--Resize: both;
6033
- overflow: auto;
6034
- }
6035
-
6036
- .pf-v6-c-form-control__icon {
6037
- padding-block-start: var(--pf-v6-c-form-control__icon--PaddingBlockStart);
6038
- color: var(--pf-v6-c-form-control__icon--Color);
6039
- }
6040
-
6041
- .pf-v6-c-form-control__icon.pf-m-status {
6042
- --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
6043
- }
6044
-
6045
- .pf-v6-c-form-control__toggle-icon {
6046
- grid-row: 1/2;
6047
- grid-column: 3;
6048
- padding-block-start: var(--pf-v6-c-form-control__toggle-icon--PaddingBlockStart);
6049
- padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
6050
- padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
6051
- color: var(--pf-v6-c-form-control__toggle-icon--Color);
6052
- pointer-events: none;
6053
- }
6054
-
6055
- .pf-v6-c-form-control__utilities {
6056
- display: flex;
6057
- flex-wrap: nowrap;
6058
- grid-row: 1/2;
6059
- grid-column: 2;
6060
- gap: var(--pf-v6-c-form-control__utilities--Gap);
6061
- padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
6062
- pointer-events: none;
6063
- }
6064
-
6065
- select ~ .pf-v6-c-form-control__utilities {
6066
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: 0;
6013
+ .pf-v6-c-file-upload__file-details-spinner {
6014
+ position: absolute;
6015
+ inset-block-start: 50%;
6016
+ inset-inline-start: 50%;
6017
+ transform: translate(-50%, -50%);
6067
6018
  }
6068
6019
 
6069
6020
  :where(:root, .pf-v6-c-form) {
@@ -6612,52 +6563,351 @@ select ~ .pf-v6-c-form-control__utilities {
6612
6563
  margin-block-end: var(--pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd);
6613
6564
  }
6614
6565
 
6615
- :where(:root, .pf-v6-c-helper-text) {
6616
- --pf-v6-c-helper-text--Gap: var(--pf-t--global--spacer--xs);
6617
- --pf-v6-c-helper-text--FontSize: var(--pf-t--global--font--size--body--sm);
6618
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-t--global--icon--color--regular);
6619
- --pf-v6-c-helper-text__item-text--Color: var(--pf-t--global--text--color--regular);
6620
- --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-t--global--font--weight--body);
6621
- --pf-v6-c-helper-text__item-icon--m-indeterminate--Color: var(--pf-t--global--icon--color--subtle);
6622
- --pf-v6-c-helper-text__item-text--m-indeterminate--Color: var(--pf-t--global--text--color--subtle);
6623
- --pf-v6-c-helper-text__item-icon--m-warning--Color: var(--pf-t--global--icon--color--status--warning--default);
6624
- --pf-v6-c-helper-text__item-text--m-warning--FontWeight: var(--pf-t--global--font--weight--body--bold);
6625
- --pf-v6-c-helper-text__item-icon--m-success--Color: var(--pf-t--global--icon--color--status--success--default);
6626
- --pf-v6-c-helper-text__item-text--m-success--FontWeight: var(--pf-t--global--font--weight--body--bold);
6627
- --pf-v6-c-helper-text__item-icon--m-error--Color: var(--pf-t--global--icon--color--status--danger--default);
6628
- --pf-v6-c-helper-text__item-text--m-error--FontWeight: var(--pf-t--global--font--weight--body--bold);
6629
- --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-t--global--icon--color--regular);
6630
- --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color: var(--pf-t--global--icon--color--subtle);
6631
- --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color: var(--pf-t--global--text--color--subtle);
6632
- --pf-v6-c-helper-text--m-dynamic--m-warning__item-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
6633
- --pf-v6-c-helper-text--m-dynamic--m-warning__item-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
6634
- --pf-v6-c-helper-text--m-dynamic--m-success__item-icon--Color: var(--pf-t--global--icon--color--status--success--default);
6635
- --pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
6636
- --pf-v6-c-helper-text__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--xs);
6566
+ :where(:root, .pf-v6-c-form-control) {
6567
+ --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--sm);
6568
+ --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
6569
+ --pf-v6-c-form-control--FontSize: var(--pf-t--global--font--size--body--default);
6570
+ --pf-v6-c-form-control--LineHeight: var(--pf-t--global--font--line-height--body);
6571
+ --pf-v6-c-form-control--Resize: none;
6572
+ --pf-v6-c-form-control--OutlineOffset: -6px;
6573
+ --pf-v6-c-form-control--BorderRadius: var(--pf-t--global--border--radius--small);
6574
+ --pf-v6-c-form-control--before--BorderWidth: var(--pf-t--global--border--width--control--default);
6575
+ --pf-v6-c-form-control--before--BorderColor: var(--pf-t--global--border--color--default);
6576
+ --pf-v6-c-form-control--before--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
6577
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6578
+ --pf-v6-c-form-control--after--BorderColor: transparent;
6579
+ --pf-v6-c-form-control--after--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
6580
+ --pf-v6-c-form-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
6581
+ --pf-v6-c-form-control--Width: 100%;
6582
+ --pf-v6-c-form-control--inset--base: var(--pf-t--global--spacer--md);
6583
+ --pf-v6-c-form-control--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
6584
+ --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
6585
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
6586
+ --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control--inset--base);
6587
+ --pf-v6-c-form-control--hover--after--BorderWidth: var(--pf-t--global--border--width--control--hover);
6588
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-t--global--border--color--hover);
6589
+ --pf-v6-c-form-control--focus--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
6590
+ --pf-v6-c-form-control--focus--after--BorderColor: var(--pf-t--global--border--color--clicked);
6591
+ --pf-v6-c-form-control--m-expanded--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
6592
+ --pf-v6-c-form-control--m-expanded--after--BorderColor: var(--pf-t--global--border--color--clicked);
6593
+ --pf-v6-c-form-control--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
6594
+ --pf-v6-c-form-control--m-placeholder--child--Color: var(--pf-t--global--text--color--regular);
6595
+ --pf-v6-c-form-control--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
6596
+ --pf-v6-c-form-control--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
6597
+ --pf-v6-c-form-control--m-disabled--after--BorderColor: transparent;
6598
+ --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
6599
+ --pf-v6-c-form-control--m-readonly--BorderColor: transparent;
6600
+ --pf-v6-c-form-control--m-readonly--hover--after--BorderColor: revert;
6601
+ --pf-v6-c-form-control--m-readonly--focus--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
6602
+ --pf-v6-c-form-control--m-readonly--focus--after--BorderColor: var(--pf-t--global--border--color--clicked);
6603
+ --pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor: transparent;
6604
+ --pf-v6-c-form-control--m-readonly--m-plain--inset--base: 0;
6605
+ --pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset: 0;
6606
+ --pf-v6-c-form-control--m-success--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6607
+ --pf-v6-c-form-control--m-success--after--BorderColor: var(--pf-t--global--border--color--status--success--default);
6608
+ --pf-v6-c-form-control--m-success--PaddingInlineEnd: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-form-control--ColumnGap));
6609
+ --pf-v6-c-form-control--m-warning--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6610
+ --pf-v6-c-form-control--m-warning--after--BorderColor: var(--pf-t--global--border--color--status--warning--default);
6611
+ --pf-v6-c-form-control--m-warning--PaddingInlineEnd: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-form-control--ColumnGap));
6612
+ --pf-v6-c-form-control--m-error--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6613
+ --pf-v6-c-form-control--m-error--after--BorderColor: var(--pf-t--global--border--color--status--danger--default);
6614
+ --pf-v6-c-form-control--m-error--PaddingInlineEnd: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-form-control--ColumnGap));
6615
+ --pf-v6-c-form-control--m-error--icon--width: var(--pf-v6-c-form-control--FontSize);
6616
+ --pf-v6-c-form-control--m-icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--inset--base) + var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer));
6617
+ --pf-v6-c-form-control--m-icon--icon--width: var(--pf-v6-c-form-control--FontSize);
6618
+ --pf-v6-c-form-control--m-icon--icon--spacer: var(--pf-t--global--spacer--sm);
6619
+ --pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--inset--base) + var(--pf-v6-c-form-control--m-error--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer));
6620
+ --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-t--global--spacer--md);
6621
+ --pf-v6-c-form-control__select--PaddingInlineStart: var(--pf-t--global--spacer--md);
6622
+ --pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
6623
+ --pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
6624
+ --pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
6625
+ --pf-v6-c-form-control--textarea--Width: var(--pf-v6-c-form-control--Width);
6626
+ --pf-v6-c-form-control--textarea--Height: auto;
6627
+ --pf-v6-c-form-control__icon--PaddingBlockStart: var(--pf-t--global--spacer--sm);
6628
+ --pf-v6-c-form-control__icon--Color: var(--pf-t--global--icon--color--regular);
6629
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
6630
+ --pf-v6-c-form-control--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
6631
+ --pf-v6-c-form-control--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
6632
+ --pf-v6-c-form-control--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
6633
+ --pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--sm);
6634
+ --pf-v6-c-form-control__utilities--PaddingBlockStart: var(--pf-v6-c-form-control--inset--base);
6635
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
6636
+ --pf-v6-c-form-control__toggle-icon--PaddingBlockStart: var(--pf-t--global--spacer--sm);
6637
+ --pf-v6-c-form-control__toggle-icon--PaddingInlineEnd: var(--pf-v6-c-form-control--inset--base);
6638
+ --pf-v6-c-form-control__toggle-icon--PaddingInlineStart: var(--pf-v6-c-form-control--inset--base);
6639
+ --pf-v6-c-form-control__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
6640
+ --pf-v6-c-form-control--m-disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
6637
6641
  }
6638
6642
 
6639
- .pf-v6-c-helper-text {
6643
+ .pf-v6-c-form-control {
6644
+ position: relative;
6640
6645
  display: grid;
6641
- gap: var(--pf-v6-c-helper-text--Gap);
6642
- font-size: var(--pf-v6-c-helper-text--FontSize);
6646
+ grid-template-columns: 1fr auto;
6647
+ column-gap: var(--pf-v6-c-form-control--ColumnGap);
6648
+ align-items: start;
6649
+ width: var(--pf-v6-c-form-control--Width);
6650
+ font-size: var(--pf-v6-c-form-control--FontSize);
6651
+ line-height: var(--pf-v6-c-form-control--LineHeight);
6652
+ resize: var(--pf-v6-c-form-control--Resize);
6653
+ background-color: var(--pf-v6-c-form-control--BackgroundColor);
6654
+ border-radius: var(--pf-v6-c-form-control--BorderRadius);
6643
6655
  }
6644
6656
 
6645
- .pf-v6-c-helper-text.pf-m-hidden {
6646
- visibility: hidden;
6647
- opacity: 0;
6657
+ .pf-v6-c-form-control::before, .pf-v6-c-form-control::after {
6658
+ position: absolute;
6659
+ inset: 0;
6660
+ pointer-events: none;
6661
+ content: "";
6648
6662
  }
6649
6663
 
6650
- .pf-v6-c-helper-text__item {
6651
- display: flex;
6652
- font-weight: var(--pf-v6-c-helper-text__item-text--FontWeight);
6664
+ .pf-v6-c-form-control::before {
6665
+ border-color: var(--pf-v6-c-form-control--before--BorderColor);
6666
+ border-style: var(--pf-v6-c-form-control--before--BorderStyle, solid);
6667
+ border-width: var(--pf-v6-c-form-control--before--BorderWidth);
6668
+ border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
6653
6669
  }
6654
6670
 
6655
- .pf-v6-c-helper-text__item.pf-m-indeterminate {
6656
- --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-indeterminate--Color);
6657
- --pf-v6-c-helper-text__item-text--Color: var(--pf-v6-c-helper-text__item-text--m-indeterminate--Color);
6658
- --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color);
6659
- --pf-v6-c-helper-text--m-dynamic__item-text--Color: var(--pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color);
6660
- }
6671
+ .pf-v6-c-form-control::after {
6672
+ 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);
6673
+ border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
6674
+ }
6675
+
6676
+ .pf-v6-c-form-control > :is(input, select, textarea) {
6677
+ grid-row: 1/2;
6678
+ grid-column: 1/-1;
6679
+ padding-block-start: var(--pf-v6-c-form-control--PaddingBlockStart);
6680
+ padding-block-end: var(--pf-v6-c-form-control--PaddingBlockEnd);
6681
+ padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
6682
+ padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
6683
+ color: var(--pf-v6-c-form-control--Color);
6684
+ background-color: transparent;
6685
+ border: none;
6686
+ border-radius: var(--pf-v6-c-form-control--BorderRadius);
6687
+ -moz-appearance: none;
6688
+ -webkit-appearance: none;
6689
+ }
6690
+
6691
+ .pf-v6-c-form-control > :is(input, select, textarea):focus {
6692
+ outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
6693
+ }
6694
+
6695
+ .pf-v6-c-form-control > ::placeholder {
6696
+ color: var(--pf-v6-c-form-control--m-placeholder--Color);
6697
+ }
6698
+
6699
+ .pf-v6-c-form-control > :is(input, select) {
6700
+ text-overflow: ellipsis;
6701
+ }
6702
+
6703
+ .pf-v6-c-form-control.pf-m-readonly {
6704
+ --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
6705
+ --pf-v6-c-form-control--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
6706
+ }
6707
+
6708
+ .pf-v6-c-form-control.pf-m-readonly:hover {
6709
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
6710
+ }
6711
+
6712
+ .pf-v6-c-form-control.pf-m-readonly:not(.pf-m-success, .pf-m-warning, .pf-m-error) {
6713
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
6714
+ --pf-v6-c-form-control--focus--after--BorderWidth: var(--pf-v6-c-form-control--m-readonly--focus--after--BorderWidth);
6715
+ --pf-v6-c-form-control--focus--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--focus--after--BorderColor);
6716
+ }
6717
+
6718
+ .pf-v6-c-form-control.pf-m-readonly.pf-m-plain {
6719
+ --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor);
6720
+ --pf-v6-c-form-control--inset--base: var(--pf-v6-c-form-control--m-readonly--m-plain--inset--base);
6721
+ --pf-v6-c-form-control--before--BorderStyle: none;
6722
+ --pf-v6-c-form-control--after--BorderStyle: none;
6723
+ --pf-v6-c-form-control--OutlineOffset: var(--pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset);
6724
+ }
6725
+
6726
+ .pf-v6-c-form-control:hover {
6727
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
6728
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--hover--after--BorderWidth);
6729
+ }
6730
+
6731
+ .pf-v6-c-form-control.pf-m-expanded {
6732
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-expanded--after--BorderColor);
6733
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-expanded--after--BorderWidth);
6734
+ }
6735
+
6736
+ .pf-v6-c-form-control.pf-m-disabled {
6737
+ --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-disabled--BackgroundColor);
6738
+ --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-disabled--Color);
6739
+ --pf-v6-c-form-control--m-placeholder--Color: var(--pf-v6-c-form-control--m-disabled--Color);
6740
+ --pf-v6-c-form-control__toggle-icon--Color: var(--pf-v6-c-form-control--m-disabled__toggle-icon--Color);
6741
+ --pf-v6-c-form-control--before--BorderStyle: none;
6742
+ --pf-v6-c-form-control--after--BorderStyle: none;
6743
+ cursor: not-allowed;
6744
+ }
6745
+
6746
+ .pf-v6-c-form-control.pf-m-error {
6747
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd);
6748
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-error--after--BorderColor);
6749
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
6750
+ --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd);
6751
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
6752
+ }
6753
+
6754
+ .pf-v6-c-form-control.pf-m-error.pf-m-icon {
6755
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6756
+ }
6757
+
6758
+ .pf-v6-c-form-control.pf-m-success {
6759
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd);
6760
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-success--after--BorderColor);
6761
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-success__icon--m-status--Color);
6762
+ --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd);
6763
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-success--after--BorderWidth);
6764
+ }
6765
+
6766
+ .pf-v6-c-form-control.pf-m-success.pf-m-icon {
6767
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6768
+ }
6769
+
6770
+ .pf-v6-c-form-control.pf-m-warning {
6771
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd);
6772
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-warning--after--BorderColor);
6773
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-warning__icon--m-status--Color);
6774
+ --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd);
6775
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-warning--after--BorderWidth);
6776
+ }
6777
+
6778
+ .pf-v6-c-form-control.pf-m-warning.pf-m-icon {
6779
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6780
+ }
6781
+
6782
+ .pf-v6-c-form-control.pf-m-icon {
6783
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
6784
+ }
6785
+
6786
+ .pf-v6-c-form-control > select {
6787
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control__select--PaddingInlineEnd);
6788
+ --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
6789
+ background-color: var(--pf-v6-c-form-control--BackgroundColor);
6790
+ }
6791
+
6792
+ @-moz-document url-prefix() {
6793
+ .pf-v6-c-form-control > select {
6794
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
6795
+ --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
6796
+ }
6797
+ }
6798
+ .pf-v6-c-form-control.pf-m-placeholder > select {
6799
+ --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
6800
+ }
6801
+
6802
+ .pf-v6-c-form-control.pf-m-placeholder > select * {
6803
+ color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
6804
+ }
6805
+
6806
+ .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
6807
+ color: revert;
6808
+ }
6809
+
6810
+ .pf-v6-c-form-control > textarea {
6811
+ width: 100%;
6812
+ height: 100%;
6813
+ vertical-align: bottom;
6814
+ resize: none;
6815
+ }
6816
+
6817
+ .pf-v6-c-form-control.pf-m-resize-vertical {
6818
+ --pf-v6-c-form-control--Resize: vertical;
6819
+ overflow: auto;
6820
+ }
6821
+
6822
+ .pf-v6-c-form-control.pf-m-resize-horizontal {
6823
+ --pf-v6-c-form-control--Resize: horizontal;
6824
+ overflow: auto;
6825
+ }
6826
+
6827
+ .pf-v6-c-form-control.pf-m-resize-both {
6828
+ --pf-v6-c-form-control--Resize: both;
6829
+ overflow: auto;
6830
+ }
6831
+
6832
+ .pf-v6-c-form-control__icon {
6833
+ padding-block-start: var(--pf-v6-c-form-control__icon--PaddingBlockStart);
6834
+ color: var(--pf-v6-c-form-control__icon--Color);
6835
+ }
6836
+
6837
+ .pf-v6-c-form-control__icon.pf-m-status {
6838
+ --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
6839
+ }
6840
+
6841
+ .pf-v6-c-form-control__toggle-icon {
6842
+ grid-row: 1/2;
6843
+ grid-column: 3;
6844
+ padding-block-start: var(--pf-v6-c-form-control__toggle-icon--PaddingBlockStart);
6845
+ padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
6846
+ padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
6847
+ color: var(--pf-v6-c-form-control__toggle-icon--Color);
6848
+ pointer-events: none;
6849
+ }
6850
+
6851
+ .pf-v6-c-form-control__utilities {
6852
+ display: flex;
6853
+ flex-wrap: nowrap;
6854
+ grid-row: 1/2;
6855
+ grid-column: 2;
6856
+ gap: var(--pf-v6-c-form-control__utilities--Gap);
6857
+ padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
6858
+ pointer-events: none;
6859
+ }
6860
+
6861
+ select ~ .pf-v6-c-form-control__utilities {
6862
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: 0;
6863
+ }
6864
+
6865
+ :where(:root, .pf-v6-c-helper-text) {
6866
+ --pf-v6-c-helper-text--Gap: var(--pf-t--global--spacer--xs);
6867
+ --pf-v6-c-helper-text--FontSize: var(--pf-t--global--font--size--body--sm);
6868
+ --pf-v6-c-helper-text__item-icon--Color: var(--pf-t--global--icon--color--regular);
6869
+ --pf-v6-c-helper-text__item-text--Color: var(--pf-t--global--text--color--regular);
6870
+ --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-t--global--font--weight--body);
6871
+ --pf-v6-c-helper-text__item-icon--m-indeterminate--Color: var(--pf-t--global--icon--color--subtle);
6872
+ --pf-v6-c-helper-text__item-text--m-indeterminate--Color: var(--pf-t--global--text--color--subtle);
6873
+ --pf-v6-c-helper-text__item-icon--m-warning--Color: var(--pf-t--global--icon--color--status--warning--default);
6874
+ --pf-v6-c-helper-text__item-text--m-warning--FontWeight: var(--pf-t--global--font--weight--body--bold);
6875
+ --pf-v6-c-helper-text__item-icon--m-success--Color: var(--pf-t--global--icon--color--status--success--default);
6876
+ --pf-v6-c-helper-text__item-text--m-success--FontWeight: var(--pf-t--global--font--weight--body--bold);
6877
+ --pf-v6-c-helper-text__item-icon--m-error--Color: var(--pf-t--global--icon--color--status--danger--default);
6878
+ --pf-v6-c-helper-text__item-text--m-error--FontWeight: var(--pf-t--global--font--weight--body--bold);
6879
+ --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-t--global--icon--color--regular);
6880
+ --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color: var(--pf-t--global--icon--color--subtle);
6881
+ --pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color: var(--pf-t--global--text--color--subtle);
6882
+ --pf-v6-c-helper-text--m-dynamic--m-warning__item-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
6883
+ --pf-v6-c-helper-text--m-dynamic--m-warning__item-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
6884
+ --pf-v6-c-helper-text--m-dynamic--m-success__item-icon--Color: var(--pf-t--global--icon--color--status--success--default);
6885
+ --pf-v6-c-helper-text--m-dynamic--m-error__item-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
6886
+ --pf-v6-c-helper-text__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--xs);
6887
+ }
6888
+
6889
+ .pf-v6-c-helper-text {
6890
+ display: grid;
6891
+ gap: var(--pf-v6-c-helper-text--Gap);
6892
+ font-size: var(--pf-v6-c-helper-text--FontSize);
6893
+ }
6894
+
6895
+ .pf-v6-c-helper-text.pf-m-hidden {
6896
+ visibility: hidden;
6897
+ opacity: 0;
6898
+ }
6899
+
6900
+ .pf-v6-c-helper-text__item {
6901
+ display: flex;
6902
+ font-weight: var(--pf-v6-c-helper-text__item-text--FontWeight);
6903
+ }
6904
+
6905
+ .pf-v6-c-helper-text__item.pf-m-indeterminate {
6906
+ --pf-v6-c-helper-text__item-icon--Color: var(--pf-v6-c-helper-text__item-icon--m-indeterminate--Color);
6907
+ --pf-v6-c-helper-text__item-text--Color: var(--pf-v6-c-helper-text__item-text--m-indeterminate--Color);
6908
+ --pf-v6-c-helper-text--m-dynamic__item-icon--Color: var(--pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-icon--Color);
6909
+ --pf-v6-c-helper-text--m-dynamic__item-text--Color: var(--pf-v6-c-helper-text--m-dynamic--m-indeterminate__item-text--Color);
6910
+ }
6661
6911
 
6662
6912
  .pf-v6-c-helper-text__item.pf-m-warning {
6663
6913
  --pf-v6-c-helper-text__item-text--FontWeight: var(--pf-v6-c-helper-text__item-text--m-warning--FontWeight);
@@ -7757,150 +8007,6 @@ label.pf-v6-c-input-group__text {
7757
8007
  --pf-v6-c-sidebar__panel--FlexBasis: 100%;
7758
8008
  }
7759
8009
  }
7760
- :where(:root, .pf-v6-c-label-group) {
7761
- --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
7762
- --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
7763
- --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
7764
- --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
7765
- --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
7766
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
7767
- --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
7768
- --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
7769
- --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
7770
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
7771
- --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
7772
- --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
7773
- --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
7774
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7775
- --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
7776
- --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7777
- --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
7778
- --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
7779
- --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
7780
- --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7781
- --pf-v6-c-label-group__label--MaxWidth: 18ch;
7782
- --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
7783
- --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
7784
- --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7785
- --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
7786
- --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7787
- --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
7788
- --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
7789
- --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
7790
- --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
7791
- --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
7792
- }
7793
-
7794
- .pf-v6-c-label-group {
7795
- display: inline-flex;
7796
- row-gap: var(--pf-v6-c-label-group--RowGap);
7797
- column-gap: var(--pf-v6-c-label-group--ColumnGap);
7798
- align-items: center;
7799
- }
7800
-
7801
- .pf-v6-c-label-group.pf-m-category {
7802
- padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
7803
- padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
7804
- padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
7805
- padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
7806
- background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
7807
- border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
7808
- border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
7809
- }
7810
-
7811
- .pf-v6-c-label-group.pf-m-vertical {
7812
- --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
7813
- --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
7814
- --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
7815
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
7816
- --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
7817
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
7818
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
7819
- }
7820
-
7821
- .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
7822
- align-items: flex-start;
7823
- }
7824
-
7825
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
7826
- flex-direction: column;
7827
- align-items: flex-start;
7828
- }
7829
-
7830
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
7831
- flex-direction: column;
7832
- }
7833
-
7834
- .pf-v6-c-label-group.pf-m-editable,
7835
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
7836
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
7837
- display: flex;
7838
- }
7839
-
7840
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
7841
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
7842
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
7843
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
7844
- flex: 1;
7845
- }
7846
-
7847
- .pf-v6-c-label-group__main {
7848
- display: flex;
7849
- flex: 1;
7850
- flex-wrap: wrap;
7851
- row-gap: var(--pf-v6-c-label-group__main--RowGap);
7852
- column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
7853
- align-items: baseline;
7854
- }
7855
-
7856
- .pf-v6-c-label-group__list {
7857
- display: inline-flex;
7858
- flex-wrap: wrap;
7859
- row-gap: var(--pf-v6-c-label-group__list--RowGap);
7860
- column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
7861
- }
7862
-
7863
- .pf-v6-c-label-group__list-item {
7864
- display: inline-flex;
7865
- }
7866
-
7867
- .pf-v6-c-label-group__label {
7868
- overflow: hidden;
7869
- text-overflow: ellipsis;
7870
- white-space: nowrap;
7871
- max-width: var(--pf-v6-c-label-group__label--MaxWidth);
7872
- }
7873
-
7874
- .pf-v6-c-label-group__close {
7875
- display: flex;
7876
- align-self: flex-start;
7877
- }
7878
-
7879
- .pf-v6-c-label-group__close .pf-v6-c-button {
7880
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
7881
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
7882
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
7883
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
7884
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
7885
- }
7886
-
7887
- .pf-v6-c-label-group__textarea {
7888
- min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
7889
- padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
7890
- padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
7891
- padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
7892
- padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
7893
- white-space: nowrap;
7894
- resize: none;
7895
- border: 0;
7896
- -ms-overflow-style: none;
7897
- scrollbar-width: none;
7898
- }
7899
-
7900
- .pf-v6-c-label-group__textarea::-webkit-scrollbar {
7901
- display: none;
7902
- }
7903
-
7904
8010
  :where(:root, .pf-v6-c-label) {
7905
8011
  --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
7906
8012
  --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
@@ -8426,85 +8532,229 @@ input.pf-v6-c-label__content {
8426
8532
  outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
8427
8533
  }
8428
8534
 
8429
- :where(:root, .pf-v6-c-list) {
8430
- --pf-v6-c-list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
8431
- --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
8432
- --pf-v6-c-list--Gap: var(--pf-t--global--spacer--sm);
8433
- --pf-v6-c-list--nested--PaddingBlockStart: var(--pf-v6-c-list--Gap);
8434
- --pf-v6-c-list--m-plain--PaddingInlineStart: 0;
8435
- --pf-v6-c-list--m-inline--PaddingInlineStart: 0;
8436
- --pf-v6-c-list--m-inline--ColumnGap: var(--pf-t--global--spacer--lg);
8437
- --pf-v6-c-list--m-inline--RowGap: var(--pf-t--global--spacer--xs);
8438
- --pf-v6-c-list--m-bordered--li--PaddingBlockStart: var(--pf-v6-c-list--Gap);
8439
- --pf-v6-c-list--m-bordered--li--BorderBlockStartColor: var(--pf-t--global--border--color--default);
8440
- --pf-v6-c-list--m-bordered--li--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
8441
- --pf-v6-c-list__item-icon--MinWidth: var(--pf-t--global--icon--size--sm);
8442
- --pf-v6-c-list__item-icon--MarginBlockStart: var(--pf-t--global--spacer--xs);
8443
- --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
8444
- --pf-v6-c-list__item-icon--Color: var(--pf-t--global--icon--color--regular);
8445
- --pf-v6-c-list__item-icon--FontSize: var(--pf-t--global--icon--size--sm);
8446
- --pf-v6-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-t--global--icon--size--lg);
8447
- --pf-v6-c-list--m-icon-lg__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
8448
- --pf-v6-c-list--m-icon-lg__item-icon--FontSize: var(--pf-t--global--icon--size--lg);
8449
- }
8450
-
8451
- .pf-v6-c-list {
8452
- display: flex;
8453
- flex-direction: column;
8454
- gap: var(--pf-v6-c-list--Gap);
8455
- padding-inline-start: var(--pf-v6-c-list--PaddingInlineStart);
8535
+ :where(:root, .pf-v6-c-label-group) {
8536
+ --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
8537
+ --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
8538
+ --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
8539
+ --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
8540
+ --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
8541
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
8542
+ --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
8543
+ --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
8544
+ --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
8545
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
8546
+ --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
8547
+ --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
8548
+ --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8549
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8550
+ --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
8551
+ --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8552
+ --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
8553
+ --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
8554
+ --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
8555
+ --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8556
+ --pf-v6-c-label-group__label--MaxWidth: 18ch;
8557
+ --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
8558
+ --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8559
+ --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8560
+ --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
8561
+ --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8562
+ --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
8563
+ --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
8564
+ --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
8565
+ --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
8566
+ --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
8456
8567
  }
8457
8568
 
8458
- .pf-v6-c-list .pf-v6-c-list {
8459
- padding-block-start: var(--pf-v6-c-list--nested--PaddingBlockStart);
8569
+ .pf-v6-c-label-group {
8570
+ display: inline-flex;
8571
+ row-gap: var(--pf-v6-c-label-group--RowGap);
8572
+ column-gap: var(--pf-v6-c-label-group--ColumnGap);
8573
+ align-items: center;
8460
8574
  }
8461
8575
 
8462
- ul.pf-v6-c-list {
8463
- list-style: var(--pf-v6-c-list--ul--ListStyle);
8576
+ .pf-v6-c-label-group.pf-m-category {
8577
+ padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
8578
+ padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
8579
+ padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
8580
+ padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
8581
+ background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
8582
+ border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
8583
+ border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
8464
8584
  }
8465
8585
 
8466
- .pf-v6-c-list.pf-m-icon-lg {
8467
- --pf-v6-c-list__item-icon--MinWidth: var(--pf-v6-c-list--m-icon-lg__item-icon--MinWidth);
8468
- --pf-v6-c-list__item-icon--MarginBlockStart: 0;
8469
- --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-v6-c-list--m-icon-lg__item-icon--MarginInlineEnd);
8470
- --pf-v6-c-list__item-icon--FontSize: var(--pf-v6-c-list--m-icon-lg__item-icon--FontSize);
8586
+ .pf-v6-c-label-group.pf-m-vertical {
8587
+ --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
8588
+ --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
8589
+ --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
8590
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
8591
+ --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
8592
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
8593
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
8471
8594
  }
8472
8595
 
8473
- .pf-v6-c-list.pf-m-plain {
8474
- --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-plain--PaddingInlineStart);
8475
- list-style: none;
8596
+ .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
8597
+ align-items: flex-start;
8476
8598
  }
8477
8599
 
8478
- .pf-v6-c-list.pf-m-inline {
8479
- --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-inline--PaddingInlineStart);
8480
- --pf-v6-c-list--Gap: var(--pf-v6-c-list--m-inline--RowGap) var(--pf-v6-c-list--m-inline--ColumnGap);
8481
- flex-direction: row;
8482
- flex-wrap: wrap;
8483
- list-style: none;
8600
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
8601
+ flex-direction: column;
8602
+ align-items: flex-start;
8484
8603
  }
8485
8604
 
8486
- .pf-v6-c-list.pf-m-bordered > * + * {
8487
- padding-block-start: var(--pf-v6-c-list--m-bordered--li--PaddingBlockStart);
8488
- border-block-start: var(--pf-v6-c-list--m-bordered--li--BorderBlockStartWidth) solid var(--pf-v6-c-list--m-bordered--li--BorderBlockStartColor);
8605
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
8606
+ flex-direction: column;
8489
8607
  }
8490
8608
 
8491
- .pf-v6-c-list__item {
8609
+ .pf-v6-c-label-group.pf-m-editable,
8610
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
8611
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
8492
8612
  display: flex;
8493
8613
  }
8494
8614
 
8495
- .pf-v6-c-list__item-icon {
8496
- flex-shrink: 0;
8497
- min-width: var(--pf-v6-c-list__item-icon--MinWidth);
8498
- margin-block-start: var(--pf-v6-c-list__item-icon--MarginBlockStart);
8499
- margin-inline-end: var(--pf-v6-c-list__item-icon--MarginInlineEnd);
8500
- font-size: var(--pf-v6-c-list__item-icon--FontSize);
8501
- line-height: 1;
8502
- color: var(--pf-v6-c-list__item-icon--Color);
8615
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
8616
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
8617
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
8618
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
8619
+ flex: 1;
8503
8620
  }
8504
8621
 
8505
- :where(:root, .pf-v6-c-login) {
8506
- --pf-v6-c-login--PaddingBlockStart: var(--pf-t--global--spacer--lg);
8507
- --pf-v6-c-login--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
8622
+ .pf-v6-c-label-group__main {
8623
+ display: flex;
8624
+ flex: 1;
8625
+ flex-wrap: wrap;
8626
+ row-gap: var(--pf-v6-c-label-group__main--RowGap);
8627
+ column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
8628
+ align-items: baseline;
8629
+ }
8630
+
8631
+ .pf-v6-c-label-group__list {
8632
+ display: inline-flex;
8633
+ flex-wrap: wrap;
8634
+ row-gap: var(--pf-v6-c-label-group__list--RowGap);
8635
+ column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
8636
+ }
8637
+
8638
+ .pf-v6-c-label-group__list-item {
8639
+ display: inline-flex;
8640
+ }
8641
+
8642
+ .pf-v6-c-label-group__label {
8643
+ overflow: hidden;
8644
+ text-overflow: ellipsis;
8645
+ white-space: nowrap;
8646
+ max-width: var(--pf-v6-c-label-group__label--MaxWidth);
8647
+ }
8648
+
8649
+ .pf-v6-c-label-group__close {
8650
+ display: flex;
8651
+ align-self: flex-start;
8652
+ }
8653
+
8654
+ .pf-v6-c-label-group__close .pf-v6-c-button {
8655
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
8656
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
8657
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
8658
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
8659
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
8660
+ }
8661
+
8662
+ .pf-v6-c-label-group__textarea {
8663
+ min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
8664
+ padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
8665
+ padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
8666
+ padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
8667
+ padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
8668
+ white-space: nowrap;
8669
+ resize: none;
8670
+ border: 0;
8671
+ -ms-overflow-style: none;
8672
+ scrollbar-width: none;
8673
+ }
8674
+
8675
+ .pf-v6-c-label-group__textarea::-webkit-scrollbar {
8676
+ display: none;
8677
+ }
8678
+
8679
+ :where(:root, .pf-v6-c-list) {
8680
+ --pf-v6-c-list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
8681
+ --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
8682
+ --pf-v6-c-list--Gap: var(--pf-t--global--spacer--sm);
8683
+ --pf-v6-c-list--nested--PaddingBlockStart: var(--pf-v6-c-list--Gap);
8684
+ --pf-v6-c-list--m-plain--PaddingInlineStart: 0;
8685
+ --pf-v6-c-list--m-inline--PaddingInlineStart: 0;
8686
+ --pf-v6-c-list--m-inline--ColumnGap: var(--pf-t--global--spacer--lg);
8687
+ --pf-v6-c-list--m-inline--RowGap: var(--pf-t--global--spacer--xs);
8688
+ --pf-v6-c-list--m-bordered--li--PaddingBlockStart: var(--pf-v6-c-list--Gap);
8689
+ --pf-v6-c-list--m-bordered--li--BorderBlockStartColor: var(--pf-t--global--border--color--default);
8690
+ --pf-v6-c-list--m-bordered--li--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
8691
+ --pf-v6-c-list__item-icon--MinWidth: var(--pf-t--global--icon--size--sm);
8692
+ --pf-v6-c-list__item-icon--MarginBlockStart: var(--pf-t--global--spacer--xs);
8693
+ --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
8694
+ --pf-v6-c-list__item-icon--Color: var(--pf-t--global--icon--color--regular);
8695
+ --pf-v6-c-list__item-icon--FontSize: var(--pf-t--global--icon--size--sm);
8696
+ --pf-v6-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-t--global--icon--size--lg);
8697
+ --pf-v6-c-list--m-icon-lg__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
8698
+ --pf-v6-c-list--m-icon-lg__item-icon--FontSize: var(--pf-t--global--icon--size--lg);
8699
+ }
8700
+
8701
+ .pf-v6-c-list {
8702
+ display: flex;
8703
+ flex-direction: column;
8704
+ gap: var(--pf-v6-c-list--Gap);
8705
+ padding-inline-start: var(--pf-v6-c-list--PaddingInlineStart);
8706
+ }
8707
+
8708
+ .pf-v6-c-list .pf-v6-c-list {
8709
+ padding-block-start: var(--pf-v6-c-list--nested--PaddingBlockStart);
8710
+ }
8711
+
8712
+ ul.pf-v6-c-list {
8713
+ list-style: var(--pf-v6-c-list--ul--ListStyle);
8714
+ }
8715
+
8716
+ .pf-v6-c-list.pf-m-icon-lg {
8717
+ --pf-v6-c-list__item-icon--MinWidth: var(--pf-v6-c-list--m-icon-lg__item-icon--MinWidth);
8718
+ --pf-v6-c-list__item-icon--MarginBlockStart: 0;
8719
+ --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-v6-c-list--m-icon-lg__item-icon--MarginInlineEnd);
8720
+ --pf-v6-c-list__item-icon--FontSize: var(--pf-v6-c-list--m-icon-lg__item-icon--FontSize);
8721
+ }
8722
+
8723
+ .pf-v6-c-list.pf-m-plain {
8724
+ --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-plain--PaddingInlineStart);
8725
+ list-style: none;
8726
+ }
8727
+
8728
+ .pf-v6-c-list.pf-m-inline {
8729
+ --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-inline--PaddingInlineStart);
8730
+ --pf-v6-c-list--Gap: var(--pf-v6-c-list--m-inline--RowGap) var(--pf-v6-c-list--m-inline--ColumnGap);
8731
+ flex-direction: row;
8732
+ flex-wrap: wrap;
8733
+ list-style: none;
8734
+ }
8735
+
8736
+ .pf-v6-c-list.pf-m-bordered > * + * {
8737
+ padding-block-start: var(--pf-v6-c-list--m-bordered--li--PaddingBlockStart);
8738
+ border-block-start: var(--pf-v6-c-list--m-bordered--li--BorderBlockStartWidth) solid var(--pf-v6-c-list--m-bordered--li--BorderBlockStartColor);
8739
+ }
8740
+
8741
+ .pf-v6-c-list__item {
8742
+ display: flex;
8743
+ }
8744
+
8745
+ .pf-v6-c-list__item-icon {
8746
+ flex-shrink: 0;
8747
+ min-width: var(--pf-v6-c-list__item-icon--MinWidth);
8748
+ margin-block-start: var(--pf-v6-c-list__item-icon--MarginBlockStart);
8749
+ margin-inline-end: var(--pf-v6-c-list__item-icon--MarginInlineEnd);
8750
+ font-size: var(--pf-v6-c-list__item-icon--FontSize);
8751
+ line-height: 1;
8752
+ color: var(--pf-v6-c-list__item-icon--Color);
8753
+ }
8754
+
8755
+ :where(:root, .pf-v6-c-login) {
8756
+ --pf-v6-c-login--PaddingBlockStart: var(--pf-t--global--spacer--lg);
8757
+ --pf-v6-c-login--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
8508
8758
  --pf-v6-c-login__container--xl--GridColumnGap: var(--pf-t--global--spacer--3xl);
8509
8759
  --pf-v6-c-login__container--MaxWidth: 31.25rem;
8510
8760
  --pf-v6-c-login__container--xl--MaxWidth: none;
@@ -10523,218 +10773,6 @@ ul.pf-v6-c-list {
10523
10773
  --pf-v6-c-modal-box__footer--c-button--MarginInlineEnd: var(--pf-v6-c-modal-box__footer--c-button--sm--MarginInlineEnd);
10524
10774
  }
10525
10775
  }
10526
- :where(:root, .pf-v6-c-multiple-file-upload) {
10527
- --pf-v6-c-multiple-file-upload--GridTemplateColumns: 1fr;
10528
- --pf-v6-c-multiple-file-upload--Gap: var(--pf-t--global--spacer--md);
10529
- --pf-v6-c-multiple-file-upload__main--TextAlign: center;
10530
- --pf-v6-c-multiple-file-upload__main--GridTemplateColumns: auto;
10531
- --pf-v6-c-multiple-file-upload__main--GridTemplateRows: auto;
10532
- --pf-v6-c-multiple-file-upload__main--GridTemplateAreas:
10533
- "title"
10534
- "upload"
10535
- "info";
10536
- --pf-v6-c-multiple-file-upload__main--PaddingBlockStart: var(--pf-t--global--spacer--xl);
10537
- --pf-v6-c-multiple-file-upload__main--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
10538
- --pf-v6-c-multiple-file-upload__main--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
10539
- --pf-v6-c-multiple-file-upload__main--PaddingInlineStart: var(--pf-t--global--spacer--xl);
10540
- --pf-v6-c-multiple-file-upload__main--BorderWidth: var(--pf-t--global--border--width--regular);
10541
- --pf-v6-c-multiple-file-upload__main--BorderStyle: dashed;
10542
- --pf-v6-c-multiple-file-upload__main--BorderColor: var(--pf-t--global--border--color--default);
10543
- --pf-v6-c-multiple-file-upload__main--BorderRadius: var(--pf-t--global--border--radius--medium);
10544
- --pf-v6-c-multiple-file-upload__title--Display: grid;
10545
- --pf-v6-c-multiple-file-upload__title--GridTemplateColumns: auto;
10546
- --pf-v6-c-multiple-file-upload__title--Gap: var(--pf-t--global--spacer--lg);
10547
- --pf-v6-c-multiple-file-upload__title-text--Color: var(--pf-t--global--text--color--regular);
10548
- --pf-v6-c-multiple-file-upload__title-text--FontFamily: var(--pf-t--global--font--family--heading);
10549
- --pf-v6-c-multiple-file-upload__title-text--FontSize: var(--pf-t--global--font--size--heading--sm);
10550
- --pf-v6-c-multiple-file-upload__title-text--FontWeight: var(--pf-t--global--font--weight--heading);
10551
- --pf-v6-c-multiple-file-upload__title-icon--Color: var(--pf-t--global--icon--color--regular);
10552
- --pf-v6-c-multiple-file-upload__title-icon--FontSize: var(--pf-t--global--icon--size--xl);
10553
- --pf-v6-c-multiple-file-upload__title-text-separator--Display: block;
10554
- --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart: var(--pf-t--global--spacer--sm);
10555
- --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockEnd: var(--pf-t--global--spacer--sm);
10556
- --pf-v6-c-multiple-file-upload__title-text-separator--Color: var(--pf-t--global--text--color--regular);
10557
- --pf-v6-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-t--global--font--family--body);
10558
- --pf-v6-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-t--global--font--size--body--lg);
10559
- --pf-v6-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-t--global--font--weight--body);
10560
- --pf-v6-c-multiple-file-upload__info--FontSize: var(--pf-t--global--font--size--body--default);
10561
- --pf-v6-c-multiple-file-upload__info--Color: var(--pf-t--global--text--color--subtle);
10562
- --pf-v6-c-multiple-file-upload__info--MarginBlockStart: var(--pf-t--global--spacer--lg);
10563
- --pf-v6-c-multiple-file-upload--m-drag-over__main--BorderStyle: dashed;
10564
- --pf-v6-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-t--global--border--color--clicked);
10565
- --pf-v6-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
10566
- --pf-v6-c-multiple-file-upload--m-horizontal__main--TextAlign: start;
10567
- --pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns: 1fr auto;
10568
- --pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas:
10569
- "title upload"
10570
- "info upload";
10571
- --pf-v6-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--lg);
10572
- --pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
10573
- --pf-v6-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
10574
- --pf-v6-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-t--global--spacer--sm);
10575
- --pf-v6-c-multiple-file-upload--m-horizontal__title-icon--FontSize: var(--pf-t--global--font--size--heading--xs);
10576
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
10577
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
10578
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginBlockStart: 0;
10579
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily: var(--pf-t--global--font--family--heading);
10580
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize: var(--pf-t--global--font--size--heading--xs);
10581
- --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight: var(--pf-t--global--font--weight--heading);
10582
- --pf-v6-c-multiple-file-upload--m-horizontal__info--MarginBlockStart: 0;
10583
- --pf-v6-c-multiple-file-upload__status--PaddingBlockStart: var(--pf-t--global--spacer--sm);
10584
- --pf-v6-c-multiple-file-upload__status--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
10585
- --pf-v6-c-multiple-file-upload__status--PaddingInlineStart: var(--pf-t--global--spacer--md);
10586
- --pf-v6-c-multiple-file-upload__status--PaddingInlineEnd: var(--pf-t--global--spacer--md);
10587
- --pf-v6-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
10588
- --pf-v6-c-multiple-file-upload__status-progress--Gap: var(--pf-t--global--spacer--sm);
10589
- --pf-v6-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--brand--default);
10590
- --pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
10591
- --pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd: var(--pf-t--global--spacer--md);
10592
- --pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
10593
- --pf-v6-c-multiple-file-upload__status-item--Gap: var(--pf-t--global--spacer--sm);
10594
- --pf-v6-c-multiple-file-upload__status-item--BorderWidth: var(--pf-t--global--border--width--regular);
10595
- --pf-v6-c-multiple-file-upload__status-item--BorderColor: var(--pf-t--global--border--color--default);
10596
- --pf-v6-c-multiple-file-upload__status-item-icon--Color: var(--pf-t--global--icon--color--regular);
10597
- --pf-v6-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
10598
- --pf-v6-c-multiple-file-upload__status-item-progress--Gap: var(--pf-t--global--spacer--sm);
10599
- --pf-v6-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-t--global--text--color--regular);
10600
- --pf-v6-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-t--global--text--color--subtle);
10601
- }
10602
-
10603
- .pf-v6-c-multiple-file-upload {
10604
- display: grid;
10605
- grid-template-columns: var(--pf-v6-c-multiple-file-upload--GridTemplateColumns);
10606
- gap: var(--pf-v6-c-multiple-file-upload--Gap);
10607
- }
10608
-
10609
- .pf-v6-c-multiple-file-upload.pf-m-horizontal {
10610
- --pf-v6-c-multiple-file-upload--GridTemplateColumns: var(--pf-v6-c-multiple-file-upload--m-horizontal--GridTemplateColumns);
10611
- --pf-v6-c-multiple-file-upload__main--TextAlign: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--TextAlign);
10612
- --pf-v6-c-multiple-file-upload__main--GridTemplateColumns: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns);
10613
- --pf-v6-c-multiple-file-upload__main--GridTemplateAreas: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas);
10614
- --pf-v6-c-multiple-file-upload__main--Gap: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--Gap);
10615
- --pf-v6-c-multiple-file-upload__main--PaddingBlockEnd: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBlockEnd);
10616
- --pf-v6-c-multiple-file-upload__title--GridTemplateColumns: var(--pf-v6-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns);
10617
- --pf-v6-c-multiple-file-upload__title--Gap: var(--pf-v6-c-multiple-file-upload--m-horizontal__title--Gap);
10618
- --pf-v6-c-multiple-file-upload__title-icon--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-icon--FontSize);
10619
- --pf-v6-c-multiple-file-upload__title-text--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text--FontSize);
10620
- --pf-v6-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily);
10621
- --pf-v6-c-multiple-file-upload__title-text-separator--Display: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--Display);
10622
- --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginBlockStart);
10623
- --pf-v6-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize);
10624
- --pf-v6-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight);
10625
- --pf-v6-c-multiple-file-upload__info--MarginBlockStart: var(--pf-v6-c-multiple-file-upload--m-horizontal__info--MarginBlockStart);
10626
- }
10627
-
10628
- .pf-v6-c-multiple-file-upload.pf-m-drag-over {
10629
- --pf-v6-c-multiple-file-upload__main--BorderStyle: var(--pf-v6-c-multiple-file-upload--m-drag-over__main--BorderStyle);
10630
- --pf-v6-c-multiple-file-upload__main--BorderColor: var(--pf-v6-c-multiple-file-upload--m-drag-over__main--BorderColor);
10631
- }
10632
-
10633
- .pf-v6-c-multiple-file-upload__main {
10634
- display: grid;
10635
- grid-template-areas: var(--pf-v6-c-multiple-file-upload__main--GridTemplateAreas);
10636
- grid-template-rows: var(--pf-v6-c-multiple-file-upload__main--GridTemplateRows);
10637
- grid-template-columns: var(--pf-v6-c-multiple-file-upload__main--GridTemplateColumns);
10638
- gap: var(--pf-v6-c-multiple-file-upload__main--Gap);
10639
- align-items: center;
10640
- padding-block-start: var(--pf-v6-c-multiple-file-upload__main--PaddingBlockStart);
10641
- padding-block-end: var(--pf-v6-c-multiple-file-upload__main--PaddingBlockEnd);
10642
- padding-inline-start: var(--pf-v6-c-multiple-file-upload__main--PaddingInlineStart);
10643
- padding-inline-end: var(--pf-v6-c-multiple-file-upload__main--PaddingInlineEnd);
10644
- text-align: var(--pf-v6-c-multiple-file-upload__main--TextAlign);
10645
- border: var(--pf-v6-c-multiple-file-upload__main--BorderWidth) var(--pf-v6-c-multiple-file-upload__main--BorderStyle) var(--pf-v6-c-multiple-file-upload__main--BorderColor);
10646
- border-radius: var(--pf-v6-c-multiple-file-upload__main--BorderRadius);
10647
- }
10648
-
10649
- .pf-v6-c-multiple-file-upload__title {
10650
- display: var(--pf-v6-c-multiple-file-upload__title--Display);
10651
- grid-area: title;
10652
- grid-template-columns: var(--pf-v6-c-multiple-file-upload__title--GridTemplateColumns);
10653
- gap: var(--pf-v6-c-multiple-file-upload__title--Gap);
10654
- }
10655
-
10656
- .pf-v6-c-multiple-file-upload__title-icon {
10657
- font-size: var(--pf-v6-c-multiple-file-upload__title-icon--FontSize);
10658
- color: var(--pf-v6-c-multiple-file-upload__title-icon--Color);
10659
- }
10660
-
10661
- .pf-v6-c-multiple-file-upload__title-text {
10662
- font-family: var(--pf-v6-c-multiple-file-upload__title-text--FontFamily);
10663
- font-size: var(--pf-v6-c-multiple-file-upload__title-text--FontSize);
10664
- font-weight: var(--pf-v6-c-multiple-file-upload__title-text--FontWeight);
10665
- color: var(--pf-v6-c-multiple-file-upload__title-text--Color, inherit);
10666
- }
10667
-
10668
- .pf-v6-c-multiple-file-upload__title-text-separator {
10669
- display: var(--pf-v6-c-multiple-file-upload__title-text-separator--Display);
10670
- margin-block-start: var(--pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart);
10671
- margin-block-end: var(--pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockEnd);
10672
- font-family: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontFamily);
10673
- font-size: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontSize);
10674
- font-weight: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontWeight);
10675
- color: var(--pf-v6-c-multiple-file-upload__title-text-separator--Color);
10676
- }
10677
-
10678
- .pf-v6-c-multiple-file-upload__upload {
10679
- grid-area: upload;
10680
- }
10681
-
10682
- .pf-v6-c-multiple-file-upload__info {
10683
- grid-area: info;
10684
- margin-block-start: var(--pf-v6-c-multiple-file-upload__info--MarginBlockStart);
10685
- font-size: var(--pf-v6-c-multiple-file-upload__info--FontSize);
10686
- color: var(--pf-v6-c-multiple-file-upload__info--Color);
10687
- }
10688
-
10689
- .pf-v6-c-multiple-file-upload__status {
10690
- padding-block-start: var(--pf-v6-c-multiple-file-upload__status--PaddingBlockStart);
10691
- padding-block-end: var(--pf-v6-c-multiple-file-upload__status--PaddingBlockEnd);
10692
- padding-inline-start: var(--pf-v6-c-multiple-file-upload__status--PaddingInlineStart);
10693
- padding-inline-end: var(--pf-v6-c-multiple-file-upload__status--PaddingInlineEnd);
10694
- }
10695
-
10696
- .pf-v6-c-multiple-file-upload__status,
10697
- .pf-v6-c-multiple-file-upload__status-item-main {
10698
- min-width: 0;
10699
- }
10700
-
10701
- .pf-v6-c-multiple-file-upload__status-progress {
10702
- display: grid;
10703
- grid-template-columns: var(--pf-v6-c-multiple-file-upload__status-progress--GridTemplateColumns);
10704
- gap: var(--pf-v6-c-multiple-file-upload__status-progress--Gap);
10705
- }
10706
-
10707
- .pf-v6-c-multiple-file-upload__status-progress-icon {
10708
- color: var(--pf-v6-c-multiple-file-upload__status-progress-icon--Color);
10709
- }
10710
-
10711
- .pf-v6-c-multiple-file-upload__status-item {
10712
- display: grid;
10713
- grid-template-columns: var(--pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns);
10714
- gap: var(--pf-v6-c-multiple-file-upload__status-item--Gap);
10715
- padding-block-start: var(--pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart);
10716
- padding-block-end: var(--pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd);
10717
- border-block-end: var(--pf-v6-c-multiple-file-upload__status-item--BorderWidth) solid var(--pf-v6-c-multiple-file-upload__status-item--BorderColor);
10718
- }
10719
-
10720
- .pf-v6-c-multiple-file-upload__status-item-icon {
10721
- color: var(--pf-v6-c-multiple-file-upload__status-item-icon--Color);
10722
- }
10723
-
10724
- .pf-v6-c-multiple-file-upload__status-item-progress {
10725
- display: grid;
10726
- grid-template-columns: var(--pf-v6-c-multiple-file-upload__status-item-progress--GridTemplateColumns);
10727
- gap: var(--pf-v6-c-multiple-file-upload__status-item-progress--Gap);
10728
- }
10729
-
10730
- .pf-v6-c-multiple-file-upload__status-item-progress-text {
10731
- color: var(--pf-v6-c-multiple-file-upload__status-item-progress-text--Color);
10732
- }
10733
-
10734
- .pf-v6-c-multiple-file-upload__status-item-progress-size {
10735
- color: var(--pf-v6-c-multiple-file-upload__status-item-progress-size--Color);
10736
- }
10737
-
10738
10776
  :where(:root, .pf-v6-c-nav) {
10739
10777
  --pf-v6-c-nav__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
10740
10778
  --pf-v6-c-nav__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -11054,60 +11092,233 @@ ul.pf-v6-c-list {
11054
11092
  --pf-v6-c-nav--m-horizontal__list--PaddingInlineEnd: var(--pf-v6-c-nav--m-horizontal--m-scrollable__list--PaddingInlineEnd);
11055
11093
  }
11056
11094
 
11057
- :where(:root, .pf-v6-c-overflow-menu) {
11058
- --pf-v6-c-overflow-menu--ColumnGap: var(--pf-t--global--spacer--md);
11059
- --pf-v6-c-overflow-menu__group--ColumnGap: var(--pf-t--global--spacer--md);
11060
- --pf-v6-c-overflow-menu__group--m-button-group--ColumnGap: var(--pf-t--global--spacer--sm);
11061
- --pf-v6-c-overflow-menu__group--m-icon-button-group--ColumnGap: var(--pf-t--global--spacer--xs);
11095
+ :where(:root, .pf-v6-c-multiple-file-upload) {
11096
+ --pf-v6-c-multiple-file-upload--GridTemplateColumns: 1fr;
11097
+ --pf-v6-c-multiple-file-upload--Gap: var(--pf-t--global--spacer--md);
11098
+ --pf-v6-c-multiple-file-upload__main--TextAlign: center;
11099
+ --pf-v6-c-multiple-file-upload__main--GridTemplateColumns: auto;
11100
+ --pf-v6-c-multiple-file-upload__main--GridTemplateRows: auto;
11101
+ --pf-v6-c-multiple-file-upload__main--GridTemplateAreas:
11102
+ "title"
11103
+ "upload"
11104
+ "info";
11105
+ --pf-v6-c-multiple-file-upload__main--PaddingBlockStart: var(--pf-t--global--spacer--xl);
11106
+ --pf-v6-c-multiple-file-upload__main--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
11107
+ --pf-v6-c-multiple-file-upload__main--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
11108
+ --pf-v6-c-multiple-file-upload__main--PaddingInlineStart: var(--pf-t--global--spacer--xl);
11109
+ --pf-v6-c-multiple-file-upload__main--BorderWidth: var(--pf-t--global--border--width--regular);
11110
+ --pf-v6-c-multiple-file-upload__main--BorderStyle: dashed;
11111
+ --pf-v6-c-multiple-file-upload__main--BorderColor: var(--pf-t--global--border--color--default);
11112
+ --pf-v6-c-multiple-file-upload__main--BorderRadius: var(--pf-t--global--border--radius--medium);
11113
+ --pf-v6-c-multiple-file-upload__title--Display: grid;
11114
+ --pf-v6-c-multiple-file-upload__title--GridTemplateColumns: auto;
11115
+ --pf-v6-c-multiple-file-upload__title--Gap: var(--pf-t--global--spacer--lg);
11116
+ --pf-v6-c-multiple-file-upload__title-text--Color: var(--pf-t--global--text--color--regular);
11117
+ --pf-v6-c-multiple-file-upload__title-text--FontFamily: var(--pf-t--global--font--family--heading);
11118
+ --pf-v6-c-multiple-file-upload__title-text--FontSize: var(--pf-t--global--font--size--heading--sm);
11119
+ --pf-v6-c-multiple-file-upload__title-text--FontWeight: var(--pf-t--global--font--weight--heading);
11120
+ --pf-v6-c-multiple-file-upload__title-icon--Color: var(--pf-t--global--icon--color--regular);
11121
+ --pf-v6-c-multiple-file-upload__title-icon--FontSize: var(--pf-t--global--icon--size--xl);
11122
+ --pf-v6-c-multiple-file-upload__title-text-separator--Display: block;
11123
+ --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart: var(--pf-t--global--spacer--sm);
11124
+ --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockEnd: var(--pf-t--global--spacer--sm);
11125
+ --pf-v6-c-multiple-file-upload__title-text-separator--Color: var(--pf-t--global--text--color--regular);
11126
+ --pf-v6-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-t--global--font--family--body);
11127
+ --pf-v6-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-t--global--font--size--body--lg);
11128
+ --pf-v6-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-t--global--font--weight--body);
11129
+ --pf-v6-c-multiple-file-upload__info--FontSize: var(--pf-t--global--font--size--body--default);
11130
+ --pf-v6-c-multiple-file-upload__info--Color: var(--pf-t--global--text--color--subtle);
11131
+ --pf-v6-c-multiple-file-upload__info--MarginBlockStart: var(--pf-t--global--spacer--lg);
11132
+ --pf-v6-c-multiple-file-upload--m-drag-over__main--BorderStyle: dashed;
11133
+ --pf-v6-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-t--global--border--color--clicked);
11134
+ --pf-v6-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
11135
+ --pf-v6-c-multiple-file-upload--m-horizontal__main--TextAlign: start;
11136
+ --pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns: 1fr auto;
11137
+ --pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas:
11138
+ "title upload"
11139
+ "info upload";
11140
+ --pf-v6-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--lg);
11141
+ --pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
11142
+ --pf-v6-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
11143
+ --pf-v6-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-t--global--spacer--sm);
11144
+ --pf-v6-c-multiple-file-upload--m-horizontal__title-icon--FontSize: var(--pf-t--global--font--size--heading--xs);
11145
+ --pf-v6-c-multiple-file-upload--m-horizontal__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
11146
+ --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
11147
+ --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginBlockStart: 0;
11148
+ --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily: var(--pf-t--global--font--family--heading);
11149
+ --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize: var(--pf-t--global--font--size--heading--xs);
11150
+ --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight: var(--pf-t--global--font--weight--heading);
11151
+ --pf-v6-c-multiple-file-upload--m-horizontal__info--MarginBlockStart: 0;
11152
+ --pf-v6-c-multiple-file-upload__status--PaddingBlockStart: var(--pf-t--global--spacer--sm);
11153
+ --pf-v6-c-multiple-file-upload__status--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
11154
+ --pf-v6-c-multiple-file-upload__status--PaddingInlineStart: var(--pf-t--global--spacer--md);
11155
+ --pf-v6-c-multiple-file-upload__status--PaddingInlineEnd: var(--pf-t--global--spacer--md);
11156
+ --pf-v6-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
11157
+ --pf-v6-c-multiple-file-upload__status-progress--Gap: var(--pf-t--global--spacer--sm);
11158
+ --pf-v6-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--brand--default);
11159
+ --pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
11160
+ --pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd: var(--pf-t--global--spacer--md);
11161
+ --pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
11162
+ --pf-v6-c-multiple-file-upload__status-item--Gap: var(--pf-t--global--spacer--sm);
11163
+ --pf-v6-c-multiple-file-upload__status-item--BorderWidth: var(--pf-t--global--border--width--regular);
11164
+ --pf-v6-c-multiple-file-upload__status-item--BorderColor: var(--pf-t--global--border--color--default);
11165
+ --pf-v6-c-multiple-file-upload__status-item-icon--Color: var(--pf-t--global--icon--color--regular);
11166
+ --pf-v6-c-multiple-file-upload__status-item-progress--GridTemplateColumns: fit-content(100%) max-content;
11167
+ --pf-v6-c-multiple-file-upload__status-item-progress--Gap: var(--pf-t--global--spacer--sm);
11168
+ --pf-v6-c-multiple-file-upload__status-item-progress-text--Color: var(--pf-t--global--text--color--regular);
11169
+ --pf-v6-c-multiple-file-upload__status-item-progress-size--Color: var(--pf-t--global--text--color--subtle);
11062
11170
  }
11063
11171
 
11064
- .pf-v6-c-overflow-menu {
11065
- display: inline-flex;
11066
- column-gap: var(--pf-v6-c-overflow-menu--ColumnGap);
11172
+ .pf-v6-c-multiple-file-upload {
11173
+ display: grid;
11174
+ grid-template-columns: var(--pf-v6-c-multiple-file-upload--GridTemplateColumns);
11175
+ gap: var(--pf-v6-c-multiple-file-upload--Gap);
11067
11176
  }
11068
11177
 
11069
- .pf-v6-c-overflow-menu__content,
11070
- .pf-v6-c-overflow-menu__group {
11071
- display: flex;
11072
- align-items: start;
11178
+ .pf-v6-c-multiple-file-upload.pf-m-horizontal {
11179
+ --pf-v6-c-multiple-file-upload--GridTemplateColumns: var(--pf-v6-c-multiple-file-upload--m-horizontal--GridTemplateColumns);
11180
+ --pf-v6-c-multiple-file-upload__main--TextAlign: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--TextAlign);
11181
+ --pf-v6-c-multiple-file-upload__main--GridTemplateColumns: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns);
11182
+ --pf-v6-c-multiple-file-upload__main--GridTemplateAreas: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas);
11183
+ --pf-v6-c-multiple-file-upload__main--Gap: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--Gap);
11184
+ --pf-v6-c-multiple-file-upload__main--PaddingBlockEnd: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBlockEnd);
11185
+ --pf-v6-c-multiple-file-upload__title--GridTemplateColumns: var(--pf-v6-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns);
11186
+ --pf-v6-c-multiple-file-upload__title--Gap: var(--pf-v6-c-multiple-file-upload--m-horizontal__title--Gap);
11187
+ --pf-v6-c-multiple-file-upload__title-icon--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-icon--FontSize);
11188
+ --pf-v6-c-multiple-file-upload__title-text--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text--FontSize);
11189
+ --pf-v6-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily);
11190
+ --pf-v6-c-multiple-file-upload__title-text-separator--Display: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--Display);
11191
+ --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginBlockStart);
11192
+ --pf-v6-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize);
11193
+ --pf-v6-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight);
11194
+ --pf-v6-c-multiple-file-upload__info--MarginBlockStart: var(--pf-v6-c-multiple-file-upload--m-horizontal__info--MarginBlockStart);
11073
11195
  }
11074
11196
 
11075
- .pf-v6-c-overflow-menu__group {
11076
- column-gap: var(--pf-v6-c-overflow-menu__group--ColumnGap);
11197
+ .pf-v6-c-multiple-file-upload.pf-m-drag-over {
11198
+ --pf-v6-c-multiple-file-upload__main--BorderStyle: var(--pf-v6-c-multiple-file-upload--m-drag-over__main--BorderStyle);
11199
+ --pf-v6-c-multiple-file-upload__main--BorderColor: var(--pf-v6-c-multiple-file-upload--m-drag-over__main--BorderColor);
11077
11200
  }
11078
11201
 
11079
- .pf-v6-c-overflow-menu__group.pf-m-button-group {
11080
- column-gap: var(--pf-v6-c-overflow-menu__group--m-button-group--ColumnGap);
11202
+ .pf-v6-c-multiple-file-upload__main {
11203
+ display: grid;
11204
+ grid-template-areas: var(--pf-v6-c-multiple-file-upload__main--GridTemplateAreas);
11205
+ grid-template-rows: var(--pf-v6-c-multiple-file-upload__main--GridTemplateRows);
11206
+ grid-template-columns: var(--pf-v6-c-multiple-file-upload__main--GridTemplateColumns);
11207
+ gap: var(--pf-v6-c-multiple-file-upload__main--Gap);
11208
+ align-items: center;
11209
+ padding-block-start: var(--pf-v6-c-multiple-file-upload__main--PaddingBlockStart);
11210
+ padding-block-end: var(--pf-v6-c-multiple-file-upload__main--PaddingBlockEnd);
11211
+ padding-inline-start: var(--pf-v6-c-multiple-file-upload__main--PaddingInlineStart);
11212
+ padding-inline-end: var(--pf-v6-c-multiple-file-upload__main--PaddingInlineEnd);
11213
+ text-align: var(--pf-v6-c-multiple-file-upload__main--TextAlign);
11214
+ border: var(--pf-v6-c-multiple-file-upload__main--BorderWidth) var(--pf-v6-c-multiple-file-upload__main--BorderStyle) var(--pf-v6-c-multiple-file-upload__main--BorderColor);
11215
+ border-radius: var(--pf-v6-c-multiple-file-upload__main--BorderRadius);
11081
11216
  }
11082
11217
 
11083
- .pf-v6-c-overflow-menu__group.pf-m-icon-button-group {
11084
- column-gap: var(--pf-v6-c-overflow-menu__group--m-icon-button-group--ColumnGap);
11218
+ .pf-v6-c-multiple-file-upload__title {
11219
+ display: var(--pf-v6-c-multiple-file-upload__title--Display);
11220
+ grid-area: title;
11221
+ grid-template-columns: var(--pf-v6-c-multiple-file-upload__title--GridTemplateColumns);
11222
+ gap: var(--pf-v6-c-multiple-file-upload__title--Gap);
11085
11223
  }
11086
11224
 
11087
- .pf-v6-c-overflow-menu__item {
11088
- column-gap: var(--pf-v6-c-overflow-menu__item--ColumnGap, var(--pf-v6-c-overflow-menu--ColumnGap));
11225
+ .pf-v6-c-multiple-file-upload__title-icon {
11226
+ font-size: var(--pf-v6-c-multiple-file-upload__title-icon--FontSize);
11227
+ color: var(--pf-v6-c-multiple-file-upload__title-icon--Color);
11089
11228
  }
11090
11229
 
11091
- .pf-v6-c-overflow-menu__content,
11092
- .pf-v6-c-overflow-menu__control {
11093
- column-gap: var(--pf-v6-c-overflow-menu--ColumnGap);
11230
+ .pf-v6-c-multiple-file-upload__title-text {
11231
+ font-family: var(--pf-v6-c-multiple-file-upload__title-text--FontFamily);
11232
+ font-size: var(--pf-v6-c-multiple-file-upload__title-text--FontSize);
11233
+ font-weight: var(--pf-v6-c-multiple-file-upload__title-text--FontWeight);
11234
+ color: var(--pf-v6-c-multiple-file-upload__title-text--Color, inherit);
11094
11235
  }
11095
11236
 
11096
- :where(:root, .pf-v6-c-notification-drawer) {
11097
- --pf-v6-c-notification-drawer--BackgroundColor: var(--pf-t--global--background--color--floating--default);
11098
- --pf-v6-c-notification-drawer__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
11099
- --pf-v6-c-notification-drawer__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
11100
- --pf-v6-c-notification-drawer__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
11101
- --pf-v6-c-notification-drawer__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
11102
- --pf-v6-c-notification-drawer__header--BackgroundColor: var(--pf-t--global--background--color--floating--default);
11103
- --pf-v6-c-notification-drawer__header--ZIndex: var(--pf-t--global--z-index--sm);
11104
- --pf-v6-c-notification-drawer__header-title--FontSize: var(--pf-t--global--font--size--heading--md);
11105
- --pf-v6-c-notification-drawer__header-title--FontWeight: var(--pf-t--global--font--weight--heading--bold);
11106
- --pf-v6-c-notification-drawer__header-title--LineHeight: var(--pf-t--global--font--line-height--heading);
11107
- --pf-v6-c-notification-drawer__header-title--FontFamily: var(--pf-t--global--font--family--heading);
11108
- --pf-v6-c-notification-drawer__header-status--MarginInlineStart: var(--pf-t--global--spacer--md);
11109
- --pf-v6-c-notification-drawer__header-status--FontWeight: var(--pf-t--global--font--weight--body--bold);
11110
- --pf-v6-c-notification-drawer__header-status--FontSize: var(--pf-t--global--font--size--body--default);
11237
+ .pf-v6-c-multiple-file-upload__title-text-separator {
11238
+ display: var(--pf-v6-c-multiple-file-upload__title-text-separator--Display);
11239
+ margin-block-start: var(--pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart);
11240
+ margin-block-end: var(--pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockEnd);
11241
+ font-family: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontFamily);
11242
+ font-size: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontSize);
11243
+ font-weight: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontWeight);
11244
+ color: var(--pf-v6-c-multiple-file-upload__title-text-separator--Color);
11245
+ }
11246
+
11247
+ .pf-v6-c-multiple-file-upload__upload {
11248
+ grid-area: upload;
11249
+ }
11250
+
11251
+ .pf-v6-c-multiple-file-upload__info {
11252
+ grid-area: info;
11253
+ margin-block-start: var(--pf-v6-c-multiple-file-upload__info--MarginBlockStart);
11254
+ font-size: var(--pf-v6-c-multiple-file-upload__info--FontSize);
11255
+ color: var(--pf-v6-c-multiple-file-upload__info--Color);
11256
+ }
11257
+
11258
+ .pf-v6-c-multiple-file-upload__status {
11259
+ padding-block-start: var(--pf-v6-c-multiple-file-upload__status--PaddingBlockStart);
11260
+ padding-block-end: var(--pf-v6-c-multiple-file-upload__status--PaddingBlockEnd);
11261
+ padding-inline-start: var(--pf-v6-c-multiple-file-upload__status--PaddingInlineStart);
11262
+ padding-inline-end: var(--pf-v6-c-multiple-file-upload__status--PaddingInlineEnd);
11263
+ }
11264
+
11265
+ .pf-v6-c-multiple-file-upload__status,
11266
+ .pf-v6-c-multiple-file-upload__status-item-main {
11267
+ min-width: 0;
11268
+ }
11269
+
11270
+ .pf-v6-c-multiple-file-upload__status-progress {
11271
+ display: grid;
11272
+ grid-template-columns: var(--pf-v6-c-multiple-file-upload__status-progress--GridTemplateColumns);
11273
+ gap: var(--pf-v6-c-multiple-file-upload__status-progress--Gap);
11274
+ }
11275
+
11276
+ .pf-v6-c-multiple-file-upload__status-progress-icon {
11277
+ color: var(--pf-v6-c-multiple-file-upload__status-progress-icon--Color);
11278
+ }
11279
+
11280
+ .pf-v6-c-multiple-file-upload__status-item {
11281
+ display: grid;
11282
+ grid-template-columns: var(--pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns);
11283
+ gap: var(--pf-v6-c-multiple-file-upload__status-item--Gap);
11284
+ padding-block-start: var(--pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart);
11285
+ padding-block-end: var(--pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd);
11286
+ border-block-end: var(--pf-v6-c-multiple-file-upload__status-item--BorderWidth) solid var(--pf-v6-c-multiple-file-upload__status-item--BorderColor);
11287
+ }
11288
+
11289
+ .pf-v6-c-multiple-file-upload__status-item-icon {
11290
+ color: var(--pf-v6-c-multiple-file-upload__status-item-icon--Color);
11291
+ }
11292
+
11293
+ .pf-v6-c-multiple-file-upload__status-item-progress {
11294
+ display: grid;
11295
+ grid-template-columns: var(--pf-v6-c-multiple-file-upload__status-item-progress--GridTemplateColumns);
11296
+ gap: var(--pf-v6-c-multiple-file-upload__status-item-progress--Gap);
11297
+ }
11298
+
11299
+ .pf-v6-c-multiple-file-upload__status-item-progress-text {
11300
+ color: var(--pf-v6-c-multiple-file-upload__status-item-progress-text--Color);
11301
+ }
11302
+
11303
+ .pf-v6-c-multiple-file-upload__status-item-progress-size {
11304
+ color: var(--pf-v6-c-multiple-file-upload__status-item-progress-size--Color);
11305
+ }
11306
+
11307
+ :where(:root, .pf-v6-c-notification-drawer) {
11308
+ --pf-v6-c-notification-drawer--BackgroundColor: var(--pf-t--global--background--color--floating--default);
11309
+ --pf-v6-c-notification-drawer__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
11310
+ --pf-v6-c-notification-drawer__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
11311
+ --pf-v6-c-notification-drawer__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
11312
+ --pf-v6-c-notification-drawer__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
11313
+ --pf-v6-c-notification-drawer__header--BackgroundColor: var(--pf-t--global--background--color--floating--default);
11314
+ --pf-v6-c-notification-drawer__header--ZIndex: var(--pf-t--global--z-index--sm);
11315
+ --pf-v6-c-notification-drawer__header-title--FontSize: var(--pf-t--global--font--size--heading--md);
11316
+ --pf-v6-c-notification-drawer__header-title--FontWeight: var(--pf-t--global--font--weight--heading--bold);
11317
+ --pf-v6-c-notification-drawer__header-title--LineHeight: var(--pf-t--global--font--line-height--heading);
11318
+ --pf-v6-c-notification-drawer__header-title--FontFamily: var(--pf-t--global--font--family--heading);
11319
+ --pf-v6-c-notification-drawer__header-status--MarginInlineStart: var(--pf-t--global--spacer--md);
11320
+ --pf-v6-c-notification-drawer__header-status--FontWeight: var(--pf-t--global--font--weight--body--bold);
11321
+ --pf-v6-c-notification-drawer__header-status--FontSize: var(--pf-t--global--font--size--body--default);
11111
11322
  --pf-v6-c-notification-drawer__header-status--Color: var(--pf-t--global--text--color--subtle);
11112
11323
  --pf-v6-c-notification-drawer__body--ZIndex: var(--pf-t--global--z-index--xs);
11113
11324
  --pf-v6-c-notification-drawer__body--PaddingBlockStart: 0;
@@ -11380,6 +11591,45 @@ ul.pf-v6-c-list {
11380
11591
  transform: rotate(var(--pf-v6-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate));
11381
11592
  }
11382
11593
 
11594
+ :where(:root, .pf-v6-c-overflow-menu) {
11595
+ --pf-v6-c-overflow-menu--ColumnGap: var(--pf-t--global--spacer--md);
11596
+ --pf-v6-c-overflow-menu__group--ColumnGap: var(--pf-t--global--spacer--md);
11597
+ --pf-v6-c-overflow-menu__group--m-button-group--ColumnGap: var(--pf-t--global--spacer--sm);
11598
+ --pf-v6-c-overflow-menu__group--m-icon-button-group--ColumnGap: var(--pf-t--global--spacer--xs);
11599
+ }
11600
+
11601
+ .pf-v6-c-overflow-menu {
11602
+ display: inline-flex;
11603
+ column-gap: var(--pf-v6-c-overflow-menu--ColumnGap);
11604
+ }
11605
+
11606
+ .pf-v6-c-overflow-menu__content,
11607
+ .pf-v6-c-overflow-menu__group {
11608
+ display: flex;
11609
+ align-items: start;
11610
+ }
11611
+
11612
+ .pf-v6-c-overflow-menu__group {
11613
+ column-gap: var(--pf-v6-c-overflow-menu__group--ColumnGap);
11614
+ }
11615
+
11616
+ .pf-v6-c-overflow-menu__group.pf-m-button-group {
11617
+ column-gap: var(--pf-v6-c-overflow-menu__group--m-button-group--ColumnGap);
11618
+ }
11619
+
11620
+ .pf-v6-c-overflow-menu__group.pf-m-icon-button-group {
11621
+ column-gap: var(--pf-v6-c-overflow-menu__group--m-icon-button-group--ColumnGap);
11622
+ }
11623
+
11624
+ .pf-v6-c-overflow-menu__item {
11625
+ column-gap: var(--pf-v6-c-overflow-menu__item--ColumnGap, var(--pf-v6-c-overflow-menu--ColumnGap));
11626
+ }
11627
+
11628
+ .pf-v6-c-overflow-menu__content,
11629
+ .pf-v6-c-overflow-menu__control {
11630
+ column-gap: var(--pf-v6-c-overflow-menu--ColumnGap);
11631
+ }
11632
+
11383
11633
  :where(:root, .pf-v6-c-page) {
11384
11634
  --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
11385
11635
  --pf-v6-c-page--inset: var(--pf-t--global--spacer--md);
@@ -13910,75 +14160,268 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13910
14160
  margin-block-start: var(--pf-v6-c-simple-list__section--section--MarginBlockStart);
13911
14161
  }
13912
14162
 
13913
- :where(:root, .pf-v6-c-skip-to-content) {
13914
- --pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
13915
- --pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
13916
- --pf-v6-c-skip-to-content--focus--InsetInlineStart: var(--pf-t--global--spacer--md);
14163
+ :where(:root, .pf-v6-c-skeleton) {
14164
+ --pf-v6-c-skeleton--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
14165
+ --pf-v6-c-skeleton--Width: auto;
14166
+ --pf-v6-c-skeleton--Height: auto;
14167
+ --pf-v6-c-skeleton--BorderRadius: var(--pf-t--global--spacer--sm);
14168
+ --pf-v6-c-skeleton--before--PaddingBlockEnd: 0;
14169
+ --pf-v6-c-skeleton--before--Height: auto;
14170
+ --pf-v6-c-skeleton--before--Content: " ";
14171
+ --pf-v6-c-skeleton--after--LinearGradientAngle: 90deg;
14172
+ --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
14173
+ --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
14174
+ --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
14175
+ --pf-v6-c-skeleton--after--TranslateX: -100%;
14176
+ --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
14177
+ --pf-v6-c-skeleton--after--AnimationDuration: 3s;
14178
+ --pf-v6-c-skeleton--after--AnimationIterationCount: infinite;
14179
+ --pf-v6-c-skeleton--after--AnimationTimingFunction: linear;
14180
+ --pf-v6-c-skeleton--after--AnimationDelay: .5s;
14181
+ --pf-v6-c-skeleton--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
14182
+ --pf-v6-c-skeleton--m-circle--before--PaddingBlockEnd: 100%;
14183
+ --pf-v6-c-skeleton--m-text-4xl--Height: calc(var(--pf-t--global--font--size--4xl) * var(--pf-t--global--font--line-height--heading));
14184
+ --pf-v6-c-skeleton--m-text-3xl--Height: calc(var(--pf-t--global--font--size--3xl) * var(--pf-t--global--font--line-height--heading));
14185
+ --pf-v6-c-skeleton--m-text-2xl--Height: calc(var(--pf-t--global--font--size--2xl) * var(--pf-t--global--font--line-height--heading));
14186
+ --pf-v6-c-skeleton--m-text-xl--Height: calc(var(--pf-t--global--font--size--xl) * var(--pf-t--global--font--line-height--heading));
14187
+ --pf-v6-c-skeleton--m-text-lg--Height: calc(var(--pf-t--global--font--size--lg) * var(--pf-t--global--font--line-height--body));
14188
+ --pf-v6-c-skeleton--m-text-md--Height: calc(var(--pf-t--global--font--size--md) * var(--pf-t--global--font--line-height--body));
14189
+ --pf-v6-c-skeleton--m-text-sm--Height: calc(var(--pf-t--global--font--size--sm) * var(--pf-t--global--font--line-height--body));
14190
+ --pf-v6-c-skeleton--m-width-sm--Width: 6.25rem;
14191
+ --pf-v6-c-skeleton--m-width-md--Width: 12.5rem;
14192
+ --pf-v6-c-skeleton--m-width-lg--Width: 18.75rem;
14193
+ --pf-v6-c-skeleton--m-width-25--Width: 25%;
14194
+ --pf-v6-c-skeleton--m-width-33--Width: calc(100% / 3);
14195
+ --pf-v6-c-skeleton--m-width-50--Width: 50%;
14196
+ --pf-v6-c-skeleton--m-width-66--Width: calc(100% / 3 * 2);
14197
+ --pf-v6-c-skeleton--m-width-75--Width: 75%;
14198
+ --pf-v6-c-skeleton--m-height-sm--Height: 6.25rem;
14199
+ --pf-v6-c-skeleton--m-height-md--Height: 12.5rem;
14200
+ --pf-v6-c-skeleton--m-height-lg--Height: 18.75rem;
14201
+ --pf-v6-c-skeleton--m-height-25--Height: 25%;
14202
+ --pf-v6-c-skeleton--m-height-33--Height: calc(100% / 3);
14203
+ --pf-v6-c-skeleton--m-height-50--Height: 50%;
14204
+ --pf-v6-c-skeleton--m-height-66--Height: calc(100% / 3 * 2);
14205
+ --pf-v6-c-skeleton--m-height-75--Height: 75%;
14206
+ --pf-v6-c-skeleton--m-height-100--Height: 100%;
13917
14207
  }
13918
14208
 
13919
- .pf-v6-c-skip-to-content {
14209
+ .pf-v6-c-skeleton {
14210
+ position: relative;
14211
+ width: var(--pf-v6-c-skeleton--Width);
14212
+ height: var(--pf-v6-c-skeleton--Height);
14213
+ overflow: hidden;
14214
+ background-color: var(--pf-v6-c-skeleton--BackgroundColor);
14215
+ border-radius: var(--pf-v6-c-skeleton--BorderRadius);
14216
+ transform: translate(0);
14217
+ }
14218
+
14219
+ .pf-v6-c-skeleton::before {
14220
+ display: block;
14221
+ height: var(--pf-v6-c-skeleton--before--Height);
14222
+ padding-block-end: var(--pf-v6-c-skeleton--before--PaddingBlockEnd);
14223
+ content: var(--pf-v6-c-skeleton--before--Content);
14224
+ }
14225
+
14226
+ .pf-v6-c-skeleton::after {
13920
14227
  position: absolute;
13921
- inset-block-start: var(--pf-v6-c-skip-to-content--InsetBlockStart);
13922
- inset-inline-start: -300%;
13923
- z-index: var(--pf-v6-c-skip-to-content--ZIndex);
14228
+ inset: 0;
14229
+ display: block;
14230
+ content: "";
14231
+ background: linear-gradient(var(--pf-v6-c-skeleton--after--LinearGradientAngle), var(--pf-v6-c-skeleton--after--LinearGradientColorStop1), var(--pf-v6-c-skeleton--after--LinearGradientColorStop2), var(--pf-v6-c-skeleton--after--LinearGradientColorStop3));
14232
+ transform: translate3d(var(--pf-v6-c-skeleton--after--TranslateX), 0, 0);
14233
+ animation: var(--pf-v6-c-skeleton--after--AnimationName) var(--pf-v6-c-skeleton--after--AnimationDuration) var(--pf-v6-c-skeleton--after--AnimationTimingFunction) var(--pf-v6-c-skeleton--after--AnimationDelay) var(--pf-v6-c-skeleton--after--AnimationIterationCount);
13924
14234
  }
13925
14235
 
13926
- .pf-v6-c-skip-to-content:focus-within {
13927
- inset-inline-start: var(--pf-v6-c-skip-to-content--focus--InsetInlineStart);
14236
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-skeleton::after {
14237
+ scale: -1 1;
13928
14238
  }
13929
14239
 
13930
- :where(:root, .pf-v6-c-slider) {
13931
- --pf-v6-c-slider--value: 0;
13932
- --pf-v6-c-slider__step--InsetInlineStart: 0;
13933
- --pf-v6-c-slider__rail--PaddingBlockStart: var(--pf-t--global--spacer--md);
13934
- --pf-v6-c-slider__rail--PaddingBlockEnd: var(--pf-t--global--spacer--md);
13935
- --pf-v6-c-slider__rail-track--Height: 0.25rem;
13936
- --pf-v6-c-slider__rail-track--before--base--BackgroundColor: var(--pf-t--global--border--color--default);
13937
- --pf-v6-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-t--global--border--color--hover);
13938
- --pf-v6-c-slider__rail-track--before--BorderRadius: var(--pf-t--global--border--radius--tiny);
13939
- --pf-v6-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-v6-c-slider--value);
13940
- --pf-v6-c-slider__steps--FontSize: var(--pf-t--global--font--size--sm);
13941
- --pf-v6-c-slider__steps--Height: var(--pf-v6-c-slider__steps--FontSize);
13942
- --pf-v6-c-slider__step-tick--InsetBlockStart: var(--pf-t--global--spacer--md);
13943
- --pf-v6-c-slider__step-tick--Width: 0.25rem;
13944
- --pf-v6-c-slider__step-tick--Height: 0.25rem;
13945
- --pf-v6-c-slider__step-tick--BackgroundColor: var(--pf-t--global--icon--color--subtle);
13946
- --pf-v6-c-slider__step-tick--TranslateX: -50%;
13947
- --pf-v6-c-slider__step-tick--BorderRadius: var(--pf-t--global--border--radius--large);
13948
- --pf-v6-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-t--global--icon--color--brand--clicked);
13949
- --pf-v6-c-slider__step--first-child__step-tick--TranslateX: 0;
13950
- --pf-v6-c-slider__step--last-child__step-tick--TranslateX: -100%;
13951
- --pf-v6-c-slider__step-label--TranslateX: -50%;
13952
- --pf-v6-c-slider__step-label--InsetBlockStart: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-slider__rail-track--Height));
13953
- --pf-v6-c-slider__step--first-child__step-label--TranslateX: 0;
13954
- --pf-v6-c-slider__step--last-child__step-label--TranslateX: -100%;
13955
- --pf-v6-c-slider__thumb--InsetBlockStart: calc(var(--pf-v6-c-slider__rail-track--Height) / 2 + var(--pf-t--global--spacer--md));
13956
- --pf-v6-c-slider__thumb--Width: 1rem;
13957
- --pf-v6-c-slider__thumb--Height: 1rem;
13958
- --pf-v6-c-slider__thumb--InsetInlineStart: var(--pf-v6-c-slider--value);
13959
- --pf-v6-c-slider__thumb--BackgroundColor: var(--pf-t--global--color--brand--default);
13960
- --pf-v6-c-slider__thumb--TranslateX: -50%;
13961
- --pf-v6-c-slider__thumb--TranslateY: -50%;
13962
- --pf-v6-c-slider__thumb--BorderRadius: var(--pf-t--global--border--radius--large);
13963
- --pf-v6-c-slider__thumb--BoxShadow--base:
13964
- 0 0 0 2px var(--pf-t--global--background--color--primary--default),
13965
- 0 0 0 3px var(--pf-t--global--color--brand--default);
13966
- --pf-v6-c-slider__thumb--hover--BoxShadow: var(--pf-v6-c-slider__thumb--BoxShadow--base);
13967
- --pf-v6-c-slider__thumb--focus--BoxShadow: var(--pf-v6-c-slider__thumb--BoxShadow--base);
13968
- --pf-v6-c-slider__thumb--active--BoxShadow:
13969
- var(--pf-v6-c-slider__thumb--BoxShadow--base),
13970
- 0 0 2px 5px var(--pf-t--global--color--nonstatus--blue--clicked);
13971
- --pf-v6-c-slider__thumb--before--Width: 44px;
13972
- --pf-v6-c-slider__thumb--before--Height: var(--pf-v6-c-slider__thumb--before--Width);
13973
- --pf-v6-c-slider__thumb--before--BorderRadius: var(--pf-t--global--border--radius--large);
13974
- --pf-v6-c-slider__thumb--before--TranslateX: -50%;
13975
- --pf-v6-c-slider__thumb--before--TranslateY: -50%;
13976
- --pf-v6-c-slider__value--MarginInlineStart: var(--pf-t--global--spacer--md);
13977
- --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);
13978
- --pf-v6-c-slider__value--c-form-control--width-chars: 3;
13979
- --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);
13980
- --pf-v6-c-slider__value--m-floating--TranslateX: -50%;
13981
- --pf-v6-c-slider__value--m-floating--TranslateY: -100%;
14240
+ .pf-v6-c-skeleton.pf-m-circle {
14241
+ --pf-v6-c-skeleton--BorderRadius: var(--pf-v6-c-skeleton--m-circle--BorderRadius);
14242
+ }
14243
+
14244
+ .pf-v6-c-skeleton.pf-m-square, .pf-v6-c-skeleton.pf-m-circle {
14245
+ --pf-v6-c-skeleton--before--Height: 0;
14246
+ --pf-v6-c-skeleton--before--PaddingBlockEnd: var(--pf-v6-c-skeleton--m-circle--before--PaddingBlockEnd);
14247
+ }
14248
+
14249
+ .pf-v6-c-skeleton.pf-m-width-sm {
14250
+ --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-sm--Width);
14251
+ }
14252
+
14253
+ .pf-v6-c-skeleton.pf-m-width-md {
14254
+ --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-md--Width);
14255
+ }
14256
+
14257
+ .pf-v6-c-skeleton.pf-m-width-lg {
14258
+ --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-lg--Width);
14259
+ }
14260
+
14261
+ .pf-v6-c-skeleton.pf-m-width-25 {
14262
+ --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-25--Width);
14263
+ }
14264
+
14265
+ .pf-v6-c-skeleton.pf-m-width-33 {
14266
+ --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-33--Width);
14267
+ }
14268
+
14269
+ .pf-v6-c-skeleton.pf-m-width-50 {
14270
+ --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-50--Width);
14271
+ }
14272
+
14273
+ .pf-v6-c-skeleton.pf-m-width-66 {
14274
+ --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-66--Width);
14275
+ }
14276
+
14277
+ .pf-v6-c-skeleton.pf-m-width-75 {
14278
+ --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-75--Width);
14279
+ }
14280
+
14281
+ .pf-v6-c-skeleton.pf-m-height-sm {
14282
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-sm--Height);
14283
+ }
14284
+
14285
+ .pf-v6-c-skeleton.pf-m-height-md {
14286
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-md--Height);
14287
+ }
14288
+
14289
+ .pf-v6-c-skeleton.pf-m-height-lg {
14290
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-lg--Height);
14291
+ }
14292
+
14293
+ .pf-v6-c-skeleton.pf-m-height-25 {
14294
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-25--Height);
14295
+ }
14296
+
14297
+ .pf-v6-c-skeleton.pf-m-height-33 {
14298
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-33--Height);
14299
+ }
14300
+
14301
+ .pf-v6-c-skeleton.pf-m-height-50 {
14302
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-50--Height);
14303
+ }
14304
+
14305
+ .pf-v6-c-skeleton.pf-m-height-66 {
14306
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-66--Height);
14307
+ }
14308
+
14309
+ .pf-v6-c-skeleton.pf-m-height-75 {
14310
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-75--Height);
14311
+ }
14312
+
14313
+ .pf-v6-c-skeleton.pf-m-height-100 {
14314
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-100--Height);
14315
+ }
14316
+
14317
+ .pf-v6-c-skeleton.pf-m-text-4xl {
14318
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-4xl--Height);
14319
+ }
14320
+
14321
+ .pf-v6-c-skeleton.pf-m-text-3xl {
14322
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-3xl--Height);
14323
+ }
14324
+
14325
+ .pf-v6-c-skeleton.pf-m-text-2xl {
14326
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-2xl--Height);
14327
+ }
14328
+
14329
+ .pf-v6-c-skeleton.pf-m-text-xl {
14330
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-xl--Height);
14331
+ }
14332
+
14333
+ .pf-v6-c-skeleton.pf-m-text-lg {
14334
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-lg--Height);
14335
+ }
14336
+
14337
+ .pf-v6-c-skeleton.pf-m-text-md {
14338
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-md--Height);
14339
+ }
14340
+
14341
+ .pf-v6-c-skeleton.pf-m-text-sm {
14342
+ --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-sm--Height);
14343
+ }
14344
+
14345
+ @keyframes pf-v6-c-skeleton-loading {
14346
+ 0% {
14347
+ transform: translateX(-100%);
14348
+ }
14349
+ 60% {
14350
+ transform: translateX(100%);
14351
+ }
14352
+ 100% {
14353
+ transform: translateX(100%);
14354
+ }
14355
+ }
14356
+ :where(:root, .pf-v6-c-skip-to-content) {
14357
+ --pf-v6-c-skip-to-content--InsetBlockStart: var(--pf-t--global--spacer--md);
14358
+ --pf-v6-c-skip-to-content--ZIndex: var(--pf-t--global--z-index--2xl);
14359
+ --pf-v6-c-skip-to-content--focus--InsetInlineStart: var(--pf-t--global--spacer--md);
14360
+ }
14361
+
14362
+ .pf-v6-c-skip-to-content {
14363
+ position: absolute;
14364
+ inset-block-start: var(--pf-v6-c-skip-to-content--InsetBlockStart);
14365
+ inset-inline-start: -300%;
14366
+ z-index: var(--pf-v6-c-skip-to-content--ZIndex);
14367
+ }
14368
+
14369
+ .pf-v6-c-skip-to-content:focus-within {
14370
+ inset-inline-start: var(--pf-v6-c-skip-to-content--focus--InsetInlineStart);
14371
+ }
14372
+
14373
+ :where(:root, .pf-v6-c-slider) {
14374
+ --pf-v6-c-slider--value: 0;
14375
+ --pf-v6-c-slider__step--InsetInlineStart: 0;
14376
+ --pf-v6-c-slider__rail--PaddingBlockStart: var(--pf-t--global--spacer--md);
14377
+ --pf-v6-c-slider__rail--PaddingBlockEnd: var(--pf-t--global--spacer--md);
14378
+ --pf-v6-c-slider__rail-track--Height: 0.25rem;
14379
+ --pf-v6-c-slider__rail-track--before--base--BackgroundColor: var(--pf-t--global--border--color--default);
14380
+ --pf-v6-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-t--global--border--color--hover);
14381
+ --pf-v6-c-slider__rail-track--before--BorderRadius: var(--pf-t--global--border--radius--tiny);
14382
+ --pf-v6-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-v6-c-slider--value);
14383
+ --pf-v6-c-slider__steps--FontSize: var(--pf-t--global--font--size--sm);
14384
+ --pf-v6-c-slider__steps--Height: var(--pf-v6-c-slider__steps--FontSize);
14385
+ --pf-v6-c-slider__step-tick--InsetBlockStart: var(--pf-t--global--spacer--md);
14386
+ --pf-v6-c-slider__step-tick--Width: 0.25rem;
14387
+ --pf-v6-c-slider__step-tick--Height: 0.25rem;
14388
+ --pf-v6-c-slider__step-tick--BackgroundColor: var(--pf-t--global--icon--color--subtle);
14389
+ --pf-v6-c-slider__step-tick--TranslateX: -50%;
14390
+ --pf-v6-c-slider__step-tick--BorderRadius: var(--pf-t--global--border--radius--large);
14391
+ --pf-v6-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-t--global--icon--color--brand--clicked);
14392
+ --pf-v6-c-slider__step--first-child__step-tick--TranslateX: 0;
14393
+ --pf-v6-c-slider__step--last-child__step-tick--TranslateX: -100%;
14394
+ --pf-v6-c-slider__step-label--TranslateX: -50%;
14395
+ --pf-v6-c-slider__step-label--InsetBlockStart: calc(var(--pf-t--global--spacer--xl) + var(--pf-v6-c-slider__rail-track--Height));
14396
+ --pf-v6-c-slider__step--first-child__step-label--TranslateX: 0;
14397
+ --pf-v6-c-slider__step--last-child__step-label--TranslateX: -100%;
14398
+ --pf-v6-c-slider__thumb--InsetBlockStart: calc(var(--pf-v6-c-slider__rail-track--Height) / 2 + var(--pf-t--global--spacer--md));
14399
+ --pf-v6-c-slider__thumb--Width: 1rem;
14400
+ --pf-v6-c-slider__thumb--Height: 1rem;
14401
+ --pf-v6-c-slider__thumb--InsetInlineStart: var(--pf-v6-c-slider--value);
14402
+ --pf-v6-c-slider__thumb--BackgroundColor: var(--pf-t--global--color--brand--default);
14403
+ --pf-v6-c-slider__thumb--TranslateX: -50%;
14404
+ --pf-v6-c-slider__thumb--TranslateY: -50%;
14405
+ --pf-v6-c-slider__thumb--BorderRadius: var(--pf-t--global--border--radius--large);
14406
+ --pf-v6-c-slider__thumb--BoxShadow--base:
14407
+ 0 0 0 2px var(--pf-t--global--background--color--primary--default),
14408
+ 0 0 0 3px var(--pf-t--global--color--brand--default);
14409
+ --pf-v6-c-slider__thumb--hover--BoxShadow: var(--pf-v6-c-slider__thumb--BoxShadow--base);
14410
+ --pf-v6-c-slider__thumb--focus--BoxShadow: var(--pf-v6-c-slider__thumb--BoxShadow--base);
14411
+ --pf-v6-c-slider__thumb--active--BoxShadow:
14412
+ var(--pf-v6-c-slider__thumb--BoxShadow--base),
14413
+ 0 0 2px 5px var(--pf-t--global--color--nonstatus--blue--clicked);
14414
+ --pf-v6-c-slider__thumb--before--Width: 44px;
14415
+ --pf-v6-c-slider__thumb--before--Height: var(--pf-v6-c-slider__thumb--before--Width);
14416
+ --pf-v6-c-slider__thumb--before--BorderRadius: var(--pf-t--global--border--radius--large);
14417
+ --pf-v6-c-slider__thumb--before--TranslateX: -50%;
14418
+ --pf-v6-c-slider__thumb--before--TranslateY: -50%;
14419
+ --pf-v6-c-slider__value--MarginInlineStart: var(--pf-t--global--spacer--md);
14420
+ --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);
14421
+ --pf-v6-c-slider__value--c-form-control--width-chars: 3;
14422
+ --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);
14423
+ --pf-v6-c-slider__value--m-floating--TranslateX: -50%;
14424
+ --pf-v6-c-slider__value--m-floating--TranslateY: -100%;
13982
14425
  --pf-v6-c-slider__value--m-floating--InsetInlineStart: var(--pf-v6-c-slider--value);
13983
14426
  --pf-v6-c-slider__value--m-floating--ZIndex: var(--pf-t--global--z-index--sm);
13984
14427
  --pf-v6-c-slider__actions--MarginInlineEnd: var(--pf-t--global--spacer--sm);
@@ -14164,280 +14607,249 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14164
14607
  margin-inline-start: var(--pf-v6-c-slider__main--actions--MarginInlineStart);
14165
14608
  }
14166
14609
 
14167
- :where(:root, .pf-v6-c-skeleton) {
14168
- --pf-v6-c-skeleton--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
14169
- --pf-v6-c-skeleton--Width: auto;
14170
- --pf-v6-c-skeleton--Height: auto;
14171
- --pf-v6-c-skeleton--BorderRadius: var(--pf-t--global--spacer--sm);
14172
- --pf-v6-c-skeleton--before--PaddingBlockEnd: 0;
14173
- --pf-v6-c-skeleton--before--Height: auto;
14174
- --pf-v6-c-skeleton--before--Content: " ";
14175
- --pf-v6-c-skeleton--after--LinearGradientAngle: 90deg;
14176
- --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
14177
- --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
14178
- --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
14179
- --pf-v6-c-skeleton--after--TranslateX: -100%;
14180
- --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
14181
- --pf-v6-c-skeleton--after--AnimationDuration: 3s;
14182
- --pf-v6-c-skeleton--after--AnimationIterationCount: infinite;
14183
- --pf-v6-c-skeleton--after--AnimationTimingFunction: linear;
14184
- --pf-v6-c-skeleton--after--AnimationDelay: .5s;
14185
- --pf-v6-c-skeleton--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
14186
- --pf-v6-c-skeleton--m-circle--before--PaddingBlockEnd: 100%;
14187
- --pf-v6-c-skeleton--m-text-4xl--Height: calc(var(--pf-t--global--font--size--4xl) * var(--pf-t--global--font--line-height--heading));
14188
- --pf-v6-c-skeleton--m-text-3xl--Height: calc(var(--pf-t--global--font--size--3xl) * var(--pf-t--global--font--line-height--heading));
14189
- --pf-v6-c-skeleton--m-text-2xl--Height: calc(var(--pf-t--global--font--size--2xl) * var(--pf-t--global--font--line-height--heading));
14190
- --pf-v6-c-skeleton--m-text-xl--Height: calc(var(--pf-t--global--font--size--xl) * var(--pf-t--global--font--line-height--heading));
14191
- --pf-v6-c-skeleton--m-text-lg--Height: calc(var(--pf-t--global--font--size--lg) * var(--pf-t--global--font--line-height--body));
14192
- --pf-v6-c-skeleton--m-text-md--Height: calc(var(--pf-t--global--font--size--md) * var(--pf-t--global--font--line-height--body));
14193
- --pf-v6-c-skeleton--m-text-sm--Height: calc(var(--pf-t--global--font--size--sm) * var(--pf-t--global--font--line-height--body));
14194
- --pf-v6-c-skeleton--m-width-sm--Width: 6.25rem;
14195
- --pf-v6-c-skeleton--m-width-md--Width: 12.5rem;
14196
- --pf-v6-c-skeleton--m-width-lg--Width: 18.75rem;
14197
- --pf-v6-c-skeleton--m-width-25--Width: 25%;
14198
- --pf-v6-c-skeleton--m-width-33--Width: calc(100% / 3);
14199
- --pf-v6-c-skeleton--m-width-50--Width: 50%;
14200
- --pf-v6-c-skeleton--m-width-66--Width: calc(100% / 3 * 2);
14201
- --pf-v6-c-skeleton--m-width-75--Width: 75%;
14202
- --pf-v6-c-skeleton--m-height-sm--Height: 6.25rem;
14203
- --pf-v6-c-skeleton--m-height-md--Height: 12.5rem;
14204
- --pf-v6-c-skeleton--m-height-lg--Height: 18.75rem;
14205
- --pf-v6-c-skeleton--m-height-25--Height: 25%;
14206
- --pf-v6-c-skeleton--m-height-33--Height: calc(100% / 3);
14207
- --pf-v6-c-skeleton--m-height-50--Height: 50%;
14208
- --pf-v6-c-skeleton--m-height-66--Height: calc(100% / 3 * 2);
14209
- --pf-v6-c-skeleton--m-height-75--Height: 75%;
14210
- --pf-v6-c-skeleton--m-height-100--Height: 100%;
14610
+ :where(:root, .pf-v6-c-spinner) {
14611
+ --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
14612
+ --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
14613
+ --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
14614
+ --pf-v6-c-spinner--Color: var(--pf-t--global--icon--color--brand--default);
14615
+ --pf-v6-c-spinner--AnimationDuration: 1.4s;
14616
+ --pf-v6-c-spinner--AnimationTimingFunction: linear;
14617
+ --pf-v6-c-spinner--StrokeWidth: 10;
14618
+ --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
14619
+ --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
14620
+ --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
14621
+ --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
14622
+ --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
14623
+ --pf-v6-c-spinner--m-xl--diameter: var(--pf-t--global--icon--size--2xl);
14624
+ --pf-v6-c-spinner--m-inline--diameter: 1em;
14211
14625
  }
14212
14626
 
14213
- .pf-v6-c-skeleton {
14214
- position: relative;
14215
- width: var(--pf-v6-c-skeleton--Width);
14216
- height: var(--pf-v6-c-skeleton--Height);
14627
+ .pf-v6-c-spinner {
14628
+ width: var(--pf-v6-c-spinner--Width);
14629
+ height: var(--pf-v6-c-spinner--Height);
14217
14630
  overflow: hidden;
14218
- background-color: var(--pf-v6-c-skeleton--BackgroundColor);
14219
- border-radius: var(--pf-v6-c-skeleton--BorderRadius);
14220
- transform: translate(0);
14631
+ animation: pf-v6-c-spinner-animation-rotate calc(var(--pf-v6-c-spinner--AnimationDuration) * 2) var(--pf-v6-c-spinner--AnimationTimingFunction) infinite;
14221
14632
  }
14222
14633
 
14223
- .pf-v6-c-skeleton::before {
14224
- display: block;
14225
- height: var(--pf-v6-c-skeleton--before--Height);
14226
- padding-block-end: var(--pf-v6-c-skeleton--before--PaddingBlockEnd);
14227
- content: var(--pf-v6-c-skeleton--before--Content);
14228
- }
14229
-
14230
- .pf-v6-c-skeleton::after {
14231
- position: absolute;
14232
- inset: 0;
14233
- display: block;
14234
- content: "";
14235
- background: linear-gradient(var(--pf-v6-c-skeleton--after--LinearGradientAngle), var(--pf-v6-c-skeleton--after--LinearGradientColorStop1), var(--pf-v6-c-skeleton--after--LinearGradientColorStop2), var(--pf-v6-c-skeleton--after--LinearGradientColorStop3));
14236
- transform: translate3d(var(--pf-v6-c-skeleton--after--TranslateX), 0, 0);
14237
- animation: var(--pf-v6-c-skeleton--after--AnimationName) var(--pf-v6-c-skeleton--after--AnimationDuration) var(--pf-v6-c-skeleton--after--AnimationTimingFunction) var(--pf-v6-c-skeleton--after--AnimationDelay) var(--pf-v6-c-skeleton--after--AnimationIterationCount);
14238
- }
14239
-
14240
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-skeleton::after {
14241
- scale: -1 1;
14242
- }
14243
-
14244
- .pf-v6-c-skeleton.pf-m-circle {
14245
- --pf-v6-c-skeleton--BorderRadius: var(--pf-v6-c-skeleton--m-circle--BorderRadius);
14246
- }
14247
-
14248
- .pf-v6-c-skeleton.pf-m-square, .pf-v6-c-skeleton.pf-m-circle {
14249
- --pf-v6-c-skeleton--before--Height: 0;
14250
- --pf-v6-c-skeleton--before--PaddingBlockEnd: var(--pf-v6-c-skeleton--m-circle--before--PaddingBlockEnd);
14251
- }
14252
-
14253
- .pf-v6-c-skeleton.pf-m-width-sm {
14254
- --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-sm--Width);
14255
- }
14256
-
14257
- .pf-v6-c-skeleton.pf-m-width-md {
14258
- --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-md--Width);
14259
- }
14260
-
14261
- .pf-v6-c-skeleton.pf-m-width-lg {
14262
- --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-lg--Width);
14263
- }
14264
-
14265
- .pf-v6-c-skeleton.pf-m-width-25 {
14266
- --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-25--Width);
14634
+ .pf-v6-c-spinner.pf-m-inline {
14635
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
14267
14636
  }
14268
14637
 
14269
- .pf-v6-c-skeleton.pf-m-width-33 {
14270
- --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-33--Width);
14638
+ .pf-v6-c-spinner.pf-m-sm {
14639
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
14271
14640
  }
14272
14641
 
14273
- .pf-v6-c-skeleton.pf-m-width-50 {
14274
- --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-50--Width);
14642
+ .pf-v6-c-spinner.pf-m-md {
14643
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-md--diameter);
14275
14644
  }
14276
14645
 
14277
- .pf-v6-c-skeleton.pf-m-width-66 {
14278
- --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-66--Width);
14646
+ .pf-v6-c-spinner.pf-m-lg {
14647
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-lg--diameter);
14279
14648
  }
14280
14649
 
14281
- .pf-v6-c-skeleton.pf-m-width-75 {
14282
- --pf-v6-c-skeleton--Width: var(--pf-v6-c-skeleton--m-width-75--Width);
14650
+ .pf-v6-c-spinner.pf-m-xl {
14651
+ --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xl--diameter);
14283
14652
  }
14284
14653
 
14285
- .pf-v6-c-skeleton.pf-m-height-sm {
14286
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-sm--Height);
14654
+ .pf-v6-c-spinner__path {
14655
+ width: 100%;
14656
+ height: 100%;
14657
+ stroke: var(--pf-v6-c-spinner--Color);
14658
+ stroke-dasharray: 283;
14659
+ stroke-dashoffset: 280;
14660
+ stroke-linecap: round;
14661
+ stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
14662
+ transform-origin: 50% 50%;
14663
+ animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
14287
14664
  }
14288
14665
 
14289
- .pf-v6-c-skeleton.pf-m-height-md {
14290
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-md--Height);
14666
+ @keyframes pf-v6-c-spinner-animation-rotate {
14667
+ 0% {
14668
+ transform: rotate(0deg);
14669
+ }
14670
+ 100% {
14671
+ transform: rotate(360deg);
14672
+ }
14291
14673
  }
14292
-
14293
- .pf-v6-c-skeleton.pf-m-height-lg {
14294
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-lg--Height);
14674
+ @keyframes pf-v6-c-spinner-animation-dash {
14675
+ 0% {
14676
+ stroke-dashoffset: 280;
14677
+ transform: rotate(0);
14678
+ }
14679
+ 15% {
14680
+ stroke-width: calc(var(--pf-v6-c-spinner__path--StrokeWidth) - 4);
14681
+ }
14682
+ 40% {
14683
+ stroke-dasharray: 220;
14684
+ stroke-dashoffset: 150;
14685
+ }
14686
+ 100% {
14687
+ stroke-dashoffset: 280;
14688
+ transform: rotate(720deg);
14689
+ }
14295
14690
  }
14296
-
14297
- .pf-v6-c-skeleton.pf-m-height-25 {
14298
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-25--Height);
14691
+ :where(:root, .pf-v6-c-switch) {
14692
+ --pf-v6-c-switch--FontSize: var(--pf-t--global--font--size--sm);
14693
+ --pf-v6-c-switch--ColumnGap: var(--pf-t--global--spacer--sm);
14694
+ --pf-v6-c-switch__toggle-icon--FontSize: calc(var(--pf-v6-c-switch--FontSize) * .625);
14695
+ --pf-v6-c-switch__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
14696
+ --pf-v6-c-switch__toggle-icon--InsetInlineStart: calc(var(--pf-v6-c-switch--FontSize) * .4);
14697
+ --pf-v6-c-switch__toggle-icon--Offset: 0.125rem;
14698
+ --pf-v6-c-switch__input--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
14699
+ --pf-v6-c-switch--LineHeight: var(--pf-t--global--font--line-height--body);
14700
+ --pf-v6-c-switch--Height: auto;
14701
+ --pf-v6-c-switch__input--checked__toggle--BackgroundColor: var(--pf-t--global--color--brand--default);
14702
+ --pf-v6-c-switch__input--checked__toggle--before--TranslateX: calc(100% + var(--pf-v6-c-switch__toggle-icon--Offset));
14703
+ --pf-v6-c-switch__input--checked__toggle--BorderWidth: 0;
14704
+ --pf-v6-c-switch__input--checked__label--Color: var(--pf-t--global--text--color--regular);
14705
+ --pf-v6-c-switch__input--not-checked__label--Color: var(--pf-t--global--text--color--subtle);
14706
+ --pf-v6-c-switch__input--disabled__label--Color: var(--pf-t--global--text--color--disabled);
14707
+ --pf-v6-c-switch__input--disabled__toggle--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
14708
+ --pf-v6-c-switch__input--checked__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--inverse);
14709
+ --pf-v6-c-switch__input--not-checked__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--subtle);
14710
+ --pf-v6-c-switch__input--disabled__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--on-disabled);
14711
+ --pf-v6-c-switch__input--focus__toggle--OutlineWidth: var(--pf-t--global--border--width--strong);
14712
+ --pf-v6-c-switch__input--focus__toggle--OutlineOffset: var(--pf-t--global--spacer--xs);
14713
+ --pf-v6-c-switch__input--focus__toggle--OutlineColor: var(--pf-t--global--color--brand--default);
14714
+ --pf-v6-c-switch__toggle--Height: calc(var(--pf-v6-c-switch--FontSize) * var(--pf-v6-c-switch--LineHeight));
14715
+ --pf-v6-c-switch__toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
14716
+ --pf-v6-c-switch__toggle--BorderColor: var(--pf-t--global--border--color--default);
14717
+ --pf-v6-c-switch__toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
14718
+ --pf-v6-c-switch__toggle--BorderRadius: var(--pf-t--global--border--radius--pill);
14719
+ --pf-v6-c-switch__toggle--before--Width: calc(var(--pf-v6-c-switch--FontSize) - var(--pf-v6-c-switch__toggle-icon--Offset));
14720
+ --pf-v6-c-switch__toggle--before--Height: var(--pf-v6-c-switch__toggle--before--Width);
14721
+ --pf-v6-c-switch__toggle--before--InsetInlineStart: calc((var(--pf-v6-c-switch__toggle--Height) - var(--pf-v6-c-switch__toggle--before--Height)) / 2);
14722
+ --pf-v6-c-switch__toggle--before--BorderRadius: var(--pf-t--global--border--radius--large);
14723
+ --pf-v6-c-switch__toggle--before--Transition: transform .25s ease 0s;
14724
+ --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));
14299
14725
  }
14300
14726
 
14301
- .pf-v6-c-skeleton.pf-m-height-33 {
14302
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-33--Height);
14727
+ .pf-v6-c-switch {
14728
+ position: relative;
14729
+ display: inline-grid;
14730
+ grid-template-columns: auto;
14731
+ grid-auto-columns: 1fr;
14732
+ column-gap: var(--pf-v6-c-switch--ColumnGap);
14733
+ height: var(--pf-v6-c-switch--Height);
14734
+ font-size: var(--pf-v6-c-switch--FontSize);
14735
+ line-height: var(--pf-v6-c-switch--LineHeight);
14736
+ vertical-align: middle;
14737
+ cursor: pointer;
14303
14738
  }
14304
14739
 
14305
- .pf-v6-c-skeleton.pf-m-height-50 {
14306
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-50--Height);
14740
+ .pf-v6-c-switch.pf-m-reverse .pf-v6-c-switch__label,
14741
+ .pf-v6-c-switch.pf-m-reverse .pf-v6-c-switch__toggle {
14742
+ grid-row: 1;
14307
14743
  }
14308
14744
 
14309
- .pf-v6-c-skeleton.pf-m-height-66 {
14310
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-66--Height);
14745
+ .pf-v6-c-switch.pf-m-reverse .pf-v6-c-switch__label {
14746
+ grid-column: 1;
14311
14747
  }
14312
14748
 
14313
- .pf-v6-c-skeleton.pf-m-height-75 {
14314
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-75--Height);
14749
+ .pf-v6-c-switch__input {
14750
+ position: absolute;
14751
+ cursor: pointer;
14752
+ opacity: 0;
14315
14753
  }
14316
14754
 
14317
- .pf-v6-c-skeleton.pf-m-height-100 {
14318
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-height-100--Height);
14755
+ .pf-v6-c-switch__input:focus-visible ~ .pf-v6-c-switch__toggle {
14756
+ outline: var(--pf-v6-c-switch__input--focus__toggle--OutlineWidth) solid var(--pf-v6-c-switch__input--focus__toggle--OutlineColor);
14757
+ outline-offset: var(--pf-v6-c-switch__input--focus__toggle--OutlineOffset);
14319
14758
  }
14320
14759
 
14321
- .pf-v6-c-skeleton.pf-m-text-4xl {
14322
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-4xl--Height);
14760
+ .pf-v6-c-switch__input:checked ~ .pf-v6-c-switch__label {
14761
+ color: var(--pf-v6-c-switch__input--checked__label--Color);
14323
14762
  }
14324
14763
 
14325
- .pf-v6-c-skeleton.pf-m-text-3xl {
14326
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-3xl--Height);
14764
+ .pf-v6-c-switch__input:checked ~ .pf-v6-c-switch__toggle {
14765
+ --pf-v6-c-switch__toggle--BorderWidth: var(--pf-v6-c-switch__input--checked__toggle--BorderWidth);
14766
+ background-color: var(--pf-v6-c-switch__input--checked__toggle--BackgroundColor);
14327
14767
  }
14328
14768
 
14329
- .pf-v6-c-skeleton.pf-m-text-2xl {
14330
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-2xl--Height);
14769
+ .pf-v6-c-switch__input:checked ~ .pf-v6-c-switch__toggle::before {
14770
+ transform: translate(var(--pf-v6-c-switch__input--checked__toggle--before--TranslateX), -50%);
14771
+ background-color: var(--pf-v6-c-switch__input--checked__toggle--before--BackgroundColor);
14331
14772
  }
14332
14773
 
14333
- .pf-v6-c-skeleton.pf-m-text-xl {
14334
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-xl--Height);
14774
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-switch__input:checked ~ .pf-v6-c-switch__toggle::before {
14775
+ transform: translate(calc(var(--pf-v6-c-switch__input--checked__toggle--before--TranslateX) * var(--pf-v6-global--inverse--multiplier)), -50%);
14335
14776
  }
14336
14777
 
14337
- .pf-v6-c-skeleton.pf-m-text-lg {
14338
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-lg--Height);
14778
+ .pf-v6-c-switch__input:not(:checked) ~ .pf-v6-c-switch__label {
14779
+ color: var(--pf-v6-c-switch__input--not-checked__label--Color);
14339
14780
  }
14340
14781
 
14341
- .pf-v6-c-skeleton.pf-m-text-md {
14342
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-md--Height);
14782
+ .pf-v6-c-switch__input:not(:checked) ~ .pf-v6-c-switch__toggle .pf-v6-c-switch__toggle-icon {
14783
+ display: none;
14343
14784
  }
14344
14785
 
14345
- .pf-v6-c-skeleton.pf-m-text-sm {
14346
- --pf-v6-c-skeleton--Height: var(--pf-v6-c-skeleton--m-text-sm--Height);
14786
+ .pf-v6-c-switch__input:disabled {
14787
+ cursor: not-allowed;
14347
14788
  }
14348
14789
 
14349
- @keyframes pf-v6-c-skeleton-loading {
14350
- 0% {
14351
- transform: translateX(-100%);
14352
- }
14353
- 60% {
14354
- transform: translateX(100%);
14355
- }
14356
- 100% {
14357
- transform: translateX(100%);
14358
- }
14359
- }
14360
- :where(:root, .pf-v6-c-spinner) {
14361
- --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
14362
- --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
14363
- --pf-v6-c-spinner--Height: var(--pf-v6-c-spinner--diameter);
14364
- --pf-v6-c-spinner--Color: var(--pf-t--global--icon--color--brand--default);
14365
- --pf-v6-c-spinner--AnimationDuration: 1.4s;
14366
- --pf-v6-c-spinner--AnimationTimingFunction: linear;
14367
- --pf-v6-c-spinner--StrokeWidth: 10;
14368
- --pf-v6-c-spinner__path--StrokeWidth: var(--pf-v6-c-spinner--StrokeWidth);
14369
- --pf-v6-c-spinner__path--AnimationTimingFunction: ease-in-out;
14370
- --pf-v6-c-spinner--m-sm--diameter: var(--pf-t--global--icon--size--md);
14371
- --pf-v6-c-spinner--m-md--diameter: var(--pf-t--global--icon--size--lg);
14372
- --pf-v6-c-spinner--m-lg--diameter: var(--pf-t--global--icon--size--xl);
14373
- --pf-v6-c-spinner--m-xl--diameter: var(--pf-t--global--icon--size--2xl);
14374
- --pf-v6-c-spinner--m-inline--diameter: 1em;
14790
+ .pf-v6-c-switch__input:disabled ~ .pf-v6-c-switch__label {
14791
+ color: var(--pf-v6-c-switch__input--disabled__label--Color);
14792
+ cursor: not-allowed;
14375
14793
  }
14376
14794
 
14377
- .pf-v6-c-spinner {
14378
- width: var(--pf-v6-c-spinner--Width);
14379
- height: var(--pf-v6-c-spinner--Height);
14380
- overflow: hidden;
14381
- animation: pf-v6-c-spinner-animation-rotate calc(var(--pf-v6-c-spinner--AnimationDuration) * 2) var(--pf-v6-c-spinner--AnimationTimingFunction) infinite;
14795
+ .pf-v6-c-switch__input:disabled ~ .pf-v6-c-switch__toggle {
14796
+ --pf-v6-c-switch__toggle-icon--Color: var(--pf-v6-c-switch__input--disabled__toggle-icon--Color);
14797
+ cursor: not-allowed;
14798
+ background-color: var(--pf-v6-c-switch__input--disabled__toggle--BackgroundColor);
14382
14799
  }
14383
14800
 
14384
- .pf-v6-c-spinner.pf-m-inline {
14385
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-inline--diameter);
14801
+ .pf-v6-c-switch__input:disabled ~ .pf-v6-c-switch__toggle::before {
14802
+ background-color: var(--pf-v6-c-switch__input--disabled__toggle--before--BackgroundColor);
14386
14803
  }
14387
14804
 
14388
- .pf-v6-c-spinner.pf-m-sm {
14389
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-sm--diameter);
14805
+ .pf-v6-c-switch__toggle {
14806
+ position: relative;
14807
+ display: inline-block;
14808
+ width: var(--pf-v6-c-switch__toggle--Width);
14809
+ height: var(--pf-v6-c-switch__toggle--Height);
14810
+ background-color: var(--pf-v6-c-switch__toggle--BackgroundColor);
14811
+ border-radius: var(--pf-v6-c-switch__toggle--BorderRadius);
14390
14812
  }
14391
14813
 
14392
- .pf-v6-c-spinner.pf-m-md {
14393
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-md--diameter);
14814
+ .pf-v6-c-switch__toggle::before {
14815
+ position: absolute;
14816
+ inset-block-start: 50%;
14817
+ inset-inline-start: var(--pf-v6-c-switch__toggle--before--InsetInlineStart);
14818
+ display: block;
14819
+ width: var(--pf-v6-c-switch__toggle--before--Width);
14820
+ height: var(--pf-v6-c-switch__toggle--before--Height);
14821
+ content: "";
14822
+ background-color: var(--pf-v6-c-switch__input--not-checked__toggle--before--BackgroundColor);
14823
+ border-radius: var(--pf-v6-c-switch__toggle--before--BorderRadius);
14824
+ transition: var(--pf-v6-c-switch__toggle--before--Transition);
14825
+ transform: translateY(-50%);
14394
14826
  }
14395
14827
 
14396
- .pf-v6-c-spinner.pf-m-lg {
14397
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-lg--diameter);
14828
+ .pf-v6-c-switch__toggle::after {
14829
+ position: absolute;
14830
+ inset: 0;
14831
+ content: "";
14832
+ border: var(--pf-v6-c-switch__toggle--BorderWidth) solid var(--pf-v6-c-switch__toggle--BorderColor);
14833
+ border-radius: var(--pf-v6-c-switch__toggle--BorderRadius);
14398
14834
  }
14399
14835
 
14400
- .pf-v6-c-spinner.pf-m-xl {
14401
- --pf-v6-c-spinner--diameter: var(--pf-v6-c-spinner--m-xl--diameter);
14836
+ .pf-v6-c-switch__toggle-icon {
14837
+ position: absolute;
14838
+ inset-block-start: 0;
14839
+ inset-block-end: 0;
14840
+ inset-inline-start: var(--pf-v6-c-switch__toggle-icon--InsetInlineStart);
14841
+ display: flex;
14842
+ align-items: center;
14843
+ font-size: var(--pf-v6-c-switch__toggle-icon--FontSize);
14844
+ color: var(--pf-v6-c-switch__toggle-icon--Color);
14402
14845
  }
14403
14846
 
14404
- .pf-v6-c-spinner__path {
14405
- width: 100%;
14406
- height: 100%;
14407
- stroke: var(--pf-v6-c-spinner--Color);
14408
- stroke-dasharray: 283;
14409
- stroke-dashoffset: 280;
14410
- stroke-linecap: round;
14411
- stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
14412
- transform-origin: 50% 50%;
14413
- animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
14847
+ .pf-v6-c-switch__label {
14848
+ display: inline-block;
14849
+ grid-column: 2;
14850
+ vertical-align: top;
14414
14851
  }
14415
14852
 
14416
- @keyframes pf-v6-c-spinner-animation-rotate {
14417
- 0% {
14418
- transform: rotate(0deg);
14419
- }
14420
- 100% {
14421
- transform: rotate(360deg);
14422
- }
14423
- }
14424
- @keyframes pf-v6-c-spinner-animation-dash {
14425
- 0% {
14426
- stroke-dashoffset: 280;
14427
- transform: rotate(0);
14428
- }
14429
- 15% {
14430
- stroke-width: calc(var(--pf-v6-c-spinner__path--StrokeWidth) - 4);
14431
- }
14432
- 40% {
14433
- stroke-dasharray: 220;
14434
- stroke-dashoffset: 150;
14435
- }
14436
- 100% {
14437
- stroke-dashoffset: 280;
14438
- transform: rotate(720deg);
14439
- }
14440
- }
14441
14853
  :where(:root, .pf-v6-c-tabs) {
14442
14854
  --pf-v6-c-tabs--inset: 0;
14443
14855
  --pf-v6-c-tabs--Width: auto;
@@ -15361,168 +15773,6 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15361
15773
  --pf-v6-c-tab-content__body--PaddingInlineStart: var(--pf-v6-c-tab-content__body--m-padding--PaddingInlineStart);
15362
15774
  }
15363
15775
 
15364
- :where(:root, .pf-v6-c-switch) {
15365
- --pf-v6-c-switch--FontSize: var(--pf-t--global--font--size--sm);
15366
- --pf-v6-c-switch--ColumnGap: var(--pf-t--global--spacer--sm);
15367
- --pf-v6-c-switch__toggle-icon--FontSize: calc(var(--pf-v6-c-switch--FontSize) * .625);
15368
- --pf-v6-c-switch__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
15369
- --pf-v6-c-switch__toggle-icon--InsetInlineStart: calc(var(--pf-v6-c-switch--FontSize) * .4);
15370
- --pf-v6-c-switch__toggle-icon--Offset: 0.125rem;
15371
- --pf-v6-c-switch__input--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
15372
- --pf-v6-c-switch--LineHeight: var(--pf-t--global--font--line-height--body);
15373
- --pf-v6-c-switch--Height: auto;
15374
- --pf-v6-c-switch__input--checked__toggle--BackgroundColor: var(--pf-t--global--color--brand--default);
15375
- --pf-v6-c-switch__input--checked__toggle--before--TranslateX: calc(100% + var(--pf-v6-c-switch__toggle-icon--Offset));
15376
- --pf-v6-c-switch__input--checked__toggle--BorderWidth: 0;
15377
- --pf-v6-c-switch__input--checked__label--Color: var(--pf-t--global--text--color--regular);
15378
- --pf-v6-c-switch__input--not-checked__label--Color: var(--pf-t--global--text--color--subtle);
15379
- --pf-v6-c-switch__input--disabled__label--Color: var(--pf-t--global--text--color--disabled);
15380
- --pf-v6-c-switch__input--disabled__toggle--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
15381
- --pf-v6-c-switch__input--checked__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--inverse);
15382
- --pf-v6-c-switch__input--not-checked__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--subtle);
15383
- --pf-v6-c-switch__input--disabled__toggle--before--BackgroundColor: var(--pf-t--global--icon--color--on-disabled);
15384
- --pf-v6-c-switch__input--focus__toggle--OutlineWidth: var(--pf-t--global--border--width--strong);
15385
- --pf-v6-c-switch__input--focus__toggle--OutlineOffset: var(--pf-t--global--spacer--xs);
15386
- --pf-v6-c-switch__input--focus__toggle--OutlineColor: var(--pf-t--global--color--brand--default);
15387
- --pf-v6-c-switch__toggle--Height: calc(var(--pf-v6-c-switch--FontSize) * var(--pf-v6-c-switch--LineHeight));
15388
- --pf-v6-c-switch__toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
15389
- --pf-v6-c-switch__toggle--BorderColor: var(--pf-t--global--border--color--default);
15390
- --pf-v6-c-switch__toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
15391
- --pf-v6-c-switch__toggle--BorderRadius: var(--pf-t--global--border--radius--pill);
15392
- --pf-v6-c-switch__toggle--before--Width: calc(var(--pf-v6-c-switch--FontSize) - var(--pf-v6-c-switch__toggle-icon--Offset));
15393
- --pf-v6-c-switch__toggle--before--Height: var(--pf-v6-c-switch__toggle--before--Width);
15394
- --pf-v6-c-switch__toggle--before--InsetInlineStart: calc((var(--pf-v6-c-switch__toggle--Height) - var(--pf-v6-c-switch__toggle--before--Height)) / 2);
15395
- --pf-v6-c-switch__toggle--before--BorderRadius: var(--pf-t--global--border--radius--large);
15396
- --pf-v6-c-switch__toggle--before--Transition: transform .25s ease 0s;
15397
- --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));
15398
- }
15399
-
15400
- .pf-v6-c-switch {
15401
- position: relative;
15402
- display: inline-grid;
15403
- grid-template-columns: auto;
15404
- grid-auto-columns: 1fr;
15405
- column-gap: var(--pf-v6-c-switch--ColumnGap);
15406
- height: var(--pf-v6-c-switch--Height);
15407
- font-size: var(--pf-v6-c-switch--FontSize);
15408
- line-height: var(--pf-v6-c-switch--LineHeight);
15409
- vertical-align: middle;
15410
- cursor: pointer;
15411
- }
15412
-
15413
- .pf-v6-c-switch.pf-m-reverse .pf-v6-c-switch__label,
15414
- .pf-v6-c-switch.pf-m-reverse .pf-v6-c-switch__toggle {
15415
- grid-row: 1;
15416
- }
15417
-
15418
- .pf-v6-c-switch.pf-m-reverse .pf-v6-c-switch__label {
15419
- grid-column: 1;
15420
- }
15421
-
15422
- .pf-v6-c-switch__input {
15423
- position: absolute;
15424
- cursor: pointer;
15425
- opacity: 0;
15426
- }
15427
-
15428
- .pf-v6-c-switch__input:focus-visible ~ .pf-v6-c-switch__toggle {
15429
- outline: var(--pf-v6-c-switch__input--focus__toggle--OutlineWidth) solid var(--pf-v6-c-switch__input--focus__toggle--OutlineColor);
15430
- outline-offset: var(--pf-v6-c-switch__input--focus__toggle--OutlineOffset);
15431
- }
15432
-
15433
- .pf-v6-c-switch__input:checked ~ .pf-v6-c-switch__label {
15434
- color: var(--pf-v6-c-switch__input--checked__label--Color);
15435
- }
15436
-
15437
- .pf-v6-c-switch__input:checked ~ .pf-v6-c-switch__toggle {
15438
- --pf-v6-c-switch__toggle--BorderWidth: var(--pf-v6-c-switch__input--checked__toggle--BorderWidth);
15439
- background-color: var(--pf-v6-c-switch__input--checked__toggle--BackgroundColor);
15440
- }
15441
-
15442
- .pf-v6-c-switch__input:checked ~ .pf-v6-c-switch__toggle::before {
15443
- transform: translate(var(--pf-v6-c-switch__input--checked__toggle--before--TranslateX), -50%);
15444
- background-color: var(--pf-v6-c-switch__input--checked__toggle--before--BackgroundColor);
15445
- }
15446
-
15447
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-switch__input:checked ~ .pf-v6-c-switch__toggle::before {
15448
- transform: translate(calc(var(--pf-v6-c-switch__input--checked__toggle--before--TranslateX) * var(--pf-v6-global--inverse--multiplier)), -50%);
15449
- }
15450
-
15451
- .pf-v6-c-switch__input:not(:checked) ~ .pf-v6-c-switch__label {
15452
- color: var(--pf-v6-c-switch__input--not-checked__label--Color);
15453
- }
15454
-
15455
- .pf-v6-c-switch__input:not(:checked) ~ .pf-v6-c-switch__toggle .pf-v6-c-switch__toggle-icon {
15456
- display: none;
15457
- }
15458
-
15459
- .pf-v6-c-switch__input:disabled {
15460
- cursor: not-allowed;
15461
- }
15462
-
15463
- .pf-v6-c-switch__input:disabled ~ .pf-v6-c-switch__label {
15464
- color: var(--pf-v6-c-switch__input--disabled__label--Color);
15465
- cursor: not-allowed;
15466
- }
15467
-
15468
- .pf-v6-c-switch__input:disabled ~ .pf-v6-c-switch__toggle {
15469
- --pf-v6-c-switch__toggle-icon--Color: var(--pf-v6-c-switch__input--disabled__toggle-icon--Color);
15470
- cursor: not-allowed;
15471
- background-color: var(--pf-v6-c-switch__input--disabled__toggle--BackgroundColor);
15472
- }
15473
-
15474
- .pf-v6-c-switch__input:disabled ~ .pf-v6-c-switch__toggle::before {
15475
- background-color: var(--pf-v6-c-switch__input--disabled__toggle--before--BackgroundColor);
15476
- }
15477
-
15478
- .pf-v6-c-switch__toggle {
15479
- position: relative;
15480
- display: inline-block;
15481
- width: var(--pf-v6-c-switch__toggle--Width);
15482
- height: var(--pf-v6-c-switch__toggle--Height);
15483
- background-color: var(--pf-v6-c-switch__toggle--BackgroundColor);
15484
- border-radius: var(--pf-v6-c-switch__toggle--BorderRadius);
15485
- }
15486
-
15487
- .pf-v6-c-switch__toggle::before {
15488
- position: absolute;
15489
- inset-block-start: 50%;
15490
- inset-inline-start: var(--pf-v6-c-switch__toggle--before--InsetInlineStart);
15491
- display: block;
15492
- width: var(--pf-v6-c-switch__toggle--before--Width);
15493
- height: var(--pf-v6-c-switch__toggle--before--Height);
15494
- content: "";
15495
- background-color: var(--pf-v6-c-switch__input--not-checked__toggle--before--BackgroundColor);
15496
- border-radius: var(--pf-v6-c-switch__toggle--before--BorderRadius);
15497
- transition: var(--pf-v6-c-switch__toggle--before--Transition);
15498
- transform: translateY(-50%);
15499
- }
15500
-
15501
- .pf-v6-c-switch__toggle::after {
15502
- position: absolute;
15503
- inset: 0;
15504
- content: "";
15505
- border: var(--pf-v6-c-switch__toggle--BorderWidth) solid var(--pf-v6-c-switch__toggle--BorderColor);
15506
- border-radius: var(--pf-v6-c-switch__toggle--BorderRadius);
15507
- }
15508
-
15509
- .pf-v6-c-switch__toggle-icon {
15510
- position: absolute;
15511
- inset-block-start: 0;
15512
- inset-block-end: 0;
15513
- inset-inline-start: var(--pf-v6-c-switch__toggle-icon--InsetInlineStart);
15514
- display: flex;
15515
- align-items: center;
15516
- font-size: var(--pf-v6-c-switch__toggle-icon--FontSize);
15517
- color: var(--pf-v6-c-switch__toggle-icon--Color);
15518
- }
15519
-
15520
- .pf-v6-c-switch__label {
15521
- display: inline-block;
15522
- grid-column: 2;
15523
- vertical-align: top;
15524
- }
15525
-
15526
15776
  :where(:root, .pf-v6-c-tile) {
15527
15777
  --pf-v6-c-tile--PaddingBlockStart: var(--pf-t--global--spacer--lg);
15528
15778
  --pf-v6-c-tile--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -15628,51 +15878,10 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15628
15878
  color: var(--pf-v6-c-tile__body--Color);
15629
15879
  }
15630
15880
 
15631
- .pf-v6-c-tile__icon {
15632
- margin-inline-end: var(--pf-v6-c-tile__icon--MarginInlineEnd);
15633
- font-size: var(--pf-v6-c-tile__icon--FontSize);
15634
- color: var(--pf-v6-c-tile__icon--Color);
15635
- }
15636
-
15637
- :where(:root, .pf-v6-c-timestamp) {
15638
- --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
15639
- --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
15640
- --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
15641
- --pf-v6-c-timestamp--m-help-text--TextDecorationLine: underline;
15642
- --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: dashed;
15643
- --pf-v6-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-t--global--border--width--regular);
15644
- --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
15645
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-t--global--border--color--default);
15646
- --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
15647
- --pf-v6-c-timestamp--m-help-text--focus--Color: var(--pf-t--global--text--color--regular);
15648
- --pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-t--global--text--color--regular);
15649
- --pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-t--global--text--color--regular);
15650
- }
15651
-
15652
- .pf-v6-c-timestamp {
15653
- display: inline-block;
15654
- font-size: var(--pf-v6-c-timestamp--FontSize);
15655
- color: var(--pf-v6-c-timestamp--Color);
15656
- outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
15657
- }
15658
-
15659
- .pf-v6-c-timestamp.pf-m-help-text {
15660
- text-decoration-line: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine);
15661
- text-decoration-thickness: var(--pf-v6-c-timestamp--m-help-text--TextDecorationThickness);
15662
- text-decoration-style: var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
15663
- text-decoration-color: var(--pf-v6-c-timestamp--m-help-text--TextDecorationColor);
15664
- text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
15665
- cursor: pointer;
15666
- }
15667
-
15668
- .pf-v6-c-timestamp.pf-m-help-text:hover {
15669
- --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--hover--Color);
15670
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor);
15671
- }
15672
-
15673
- .pf-v6-c-timestamp.pf-m-help-text:focus {
15674
- --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--focus--Color);
15675
- --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor);
15881
+ .pf-v6-c-tile__icon {
15882
+ margin-inline-end: var(--pf-v6-c-tile__icon--MarginInlineEnd);
15883
+ font-size: var(--pf-v6-c-tile__icon--FontSize);
15884
+ color: var(--pf-v6-c-tile__icon--Color);
15676
15885
  }
15677
15886
 
15678
15887
  :where(:root, .pf-v6-c-title) {
@@ -15792,6 +16001,47 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
15792
16001
  line-height: var(--pf-v6-c-title--m-h6--LineHeight);
15793
16002
  }
15794
16003
 
16004
+ :where(:root, .pf-v6-c-timestamp) {
16005
+ --pf-v6-c-timestamp--FontSize: var(--pf-t--global--font--size--body--sm);
16006
+ --pf-v6-c-timestamp--Color: var(--pf-t--global--text--color--subtle);
16007
+ --pf-v6-c-timestamp--OutlineOffset: 0.1875rem;
16008
+ --pf-v6-c-timestamp--m-help-text--TextDecorationLine: underline;
16009
+ --pf-v6-c-timestamp--m-help-text--TextDecorationStyle: dashed;
16010
+ --pf-v6-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-t--global--border--width--regular);
16011
+ --pf-v6-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
16012
+ --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-t--global--border--color--default);
16013
+ --pf-v6-c-timestamp--m-help-text--hover--Color: var(--pf-t--global--text--color--regular);
16014
+ --pf-v6-c-timestamp--m-help-text--focus--Color: var(--pf-t--global--text--color--regular);
16015
+ --pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-t--global--text--color--regular);
16016
+ --pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-t--global--text--color--regular);
16017
+ }
16018
+
16019
+ .pf-v6-c-timestamp {
16020
+ display: inline-block;
16021
+ font-size: var(--pf-v6-c-timestamp--FontSize);
16022
+ color: var(--pf-v6-c-timestamp--Color);
16023
+ outline-offset: var(--pf-v6-c-timestamp--OutlineOffset);
16024
+ }
16025
+
16026
+ .pf-v6-c-timestamp.pf-m-help-text {
16027
+ text-decoration-line: var(--pf-v6-c-timestamp--m-help-text--TextDecorationLine);
16028
+ text-decoration-thickness: var(--pf-v6-c-timestamp--m-help-text--TextDecorationThickness);
16029
+ text-decoration-style: var(--pf-v6-c-timestamp--m-help-text--TextDecorationStyle);
16030
+ text-decoration-color: var(--pf-v6-c-timestamp--m-help-text--TextDecorationColor);
16031
+ text-underline-offset: var(--pf-v6-c-timestamp--m-help-text--TextUnderlineOffset);
16032
+ cursor: pointer;
16033
+ }
16034
+
16035
+ .pf-v6-c-timestamp.pf-m-help-text:hover {
16036
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--hover--Color);
16037
+ --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--hover--TextDecorationColor);
16038
+ }
16039
+
16040
+ .pf-v6-c-timestamp.pf-m-help-text:focus {
16041
+ --pf-v6-c-timestamp--Color: var(--pf-v6-c-timestamp--m-help-text--focus--Color);
16042
+ --pf-v6-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v6-c-timestamp--m-help-text--focus--TextDecorationColor);
16043
+ }
16044
+
15795
16045
  :where(:root, .pf-v6-c-toggle-group) {
15796
16046
  --pf-v6-c-toggle-group__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
15797
16047
  --pf-v6-c-toggle-group__button--PaddingInlineEnd: var(--pf-t--global--spacer--md);
@@ -19081,6 +19331,108 @@ label.pf-v6-c-tree-view__node-text {
19081
19331
  border-block-start: var(--pf-v6-c-wizard__footer--BorderBlockStartWidth) solid var(--pf-v6-c-wizard__footer--BorderBlockStartColor);
19082
19332
  }
19083
19333
 
19334
+ :where(:root, .pf-v6-c-panel) {
19335
+ --pf-v6-c-panel--Width: auto;
19336
+ --pf-v6-c-panel--MinWidth: auto;
19337
+ --pf-v6-c-panel--MaxWidth: none;
19338
+ --pf-v6-c-panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
19339
+ --pf-v6-c-panel--BoxShadow: none;
19340
+ --pf-v6-c-panel--BorderRadius: var(--pf-t--global--border--radius--small);
19341
+ --pf-v6-c-panel--before--BorderWidth: 0;
19342
+ --pf-v6-c-panel--before--BorderColor: var(--pf-t--global--border--color--default);
19343
+ --pf-v6-c-panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
19344
+ --pf-v6-c-panel--m-bordered--before--BorderWidth: var(--pf-t--global--border--width--box--default);
19345
+ --pf-v6-c-panel--m-raised--BoxShadow: var(--pf-t--global--box-shadow--md);
19346
+ --pf-v6-c-panel--m-raised--BackgroundColor: var(--pf-t--global--background--color--floating--default);
19347
+ --pf-v6-c-panel__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
19348
+ --pf-v6-c-panel__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
19349
+ --pf-v6-c-panel__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
19350
+ --pf-v6-c-panel__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
19351
+ --pf-v6-c-panel__main--MaxHeight: none;
19352
+ --pf-v6-c-panel__main--Overflow: visible;
19353
+ --pf-v6-c-panel__main-body--PaddingBlockStart: var(--pf-t--global--spacer--md);
19354
+ --pf-v6-c-panel__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
19355
+ --pf-v6-c-panel__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--md);
19356
+ --pf-v6-c-panel__main-body--PaddingInlineStart: var(--pf-t--global--spacer--lg);
19357
+ --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-t--global--spacer--sm);
19358
+ --pf-v6-c-panel__footer--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
19359
+ --pf-v6-c-panel__footer--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
19360
+ --pf-v6-c-panel__footer--PaddingInlineStart: var(--pf-t--global--spacer--lg);
19361
+ --pf-v6-c-panel__footer--BoxShadow: none;
19362
+ --pf-v6-c-panel--m-scrollable__main--MaxHeight: 18.75rem;
19363
+ --pf-v6-c-panel--m-scrollable__main--Overflow: auto;
19364
+ --pf-v6-c-panel--m-scrollable__footer--BoxShadow: var(--pf-t--global--box-shadow--md--top);
19365
+ --pf-v6-c-panel--m-scrollable__footer--PaddingBlockStart: var(--pf-t--global--spacer--md);
19366
+ --pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd: var(--pf-t--global--spacer--md);
19367
+ }
19368
+
19369
+ .pf-v6-c-panel {
19370
+ position: relative;
19371
+ width: var(--pf-v6-c-panel--Width);
19372
+ min-width: var(--pf-v6-c-panel--MinWidth);
19373
+ max-width: var(--pf-v6-c-panel--MaxWidth);
19374
+ background-color: var(--pf-v6-c-panel--BackgroundColor);
19375
+ border-radius: var(--pf-v6-c-panel--BorderRadius);
19376
+ box-shadow: var(--pf-v6-c-panel--BoxShadow);
19377
+ }
19378
+
19379
+ .pf-v6-c-panel::before {
19380
+ position: absolute;
19381
+ inset: 0;
19382
+ pointer-events: none;
19383
+ content: "";
19384
+ border: var(--pf-v6-c-panel--before--BorderWidth) solid var(--pf-v6-c-panel--before--BorderColor);
19385
+ border-radius: var(--pf-v6-c-panel--BorderRadius);
19386
+ }
19387
+
19388
+ .pf-v6-c-panel.pf-m-bordered {
19389
+ --pf-v6-c-panel--before--BorderWidth: var(--pf-v6-c-panel--m-bordered--before--BorderWidth);
19390
+ }
19391
+
19392
+ .pf-v6-c-panel.pf-m-secondary {
19393
+ --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-secondary--BackgroundColor);
19394
+ }
19395
+
19396
+ .pf-v6-c-panel.pf-m-raised {
19397
+ --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-raised--BackgroundColor);
19398
+ --pf-v6-c-panel--BoxShadow: var(--pf-v6-c-panel--m-raised--BoxShadow);
19399
+ }
19400
+
19401
+ .pf-v6-c-panel.pf-m-scrollable {
19402
+ --pf-v6-c-panel__main--MaxHeight: var(--pf-v6-c-panel--m-scrollable__main--MaxHeight);
19403
+ --pf-v6-c-panel__main--Overflow: var(--pf-v6-c-panel--m-scrollable__main--Overflow);
19404
+ --pf-v6-c-panel__footer--BoxShadow: var(--pf-v6-c-panel--m-scrollable__footer--BoxShadow);
19405
+ --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-v6-c-panel--m-scrollable__footer--PaddingBlockStart);
19406
+ --pf-v6-c-panel__footer--PaddingBlockEnd: var(--pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd);
19407
+ }
19408
+
19409
+ .pf-v6-c-panel__header {
19410
+ padding-block-start: var(--pf-v6-c-panel__header--PaddingBlockStart);
19411
+ padding-block-end: var(--pf-v6-c-panel__header--PaddingBlockEnd);
19412
+ padding-inline-start: var(--pf-v6-c-panel__header--PaddingInlineStart);
19413
+ padding-inline-end: var(--pf-v6-c-panel__header--PaddingInlineEnd);
19414
+ }
19415
+
19416
+ .pf-v6-c-panel__main {
19417
+ max-height: var(--pf-v6-c-panel__main--MaxHeight);
19418
+ overflow: var(--pf-v6-c-panel__main--Overflow);
19419
+ }
19420
+
19421
+ .pf-v6-c-panel__main-body {
19422
+ padding-block-start: var(--pf-v6-c-panel__main-body--PaddingBlockStart);
19423
+ padding-block-end: var(--pf-v6-c-panel__main-body--PaddingBlockEnd);
19424
+ padding-inline-start: var(--pf-v6-c-panel__main-body--PaddingInlineStart);
19425
+ padding-inline-end: var(--pf-v6-c-panel__main-body--PaddingInlineEnd);
19426
+ }
19427
+
19428
+ .pf-v6-c-panel__footer {
19429
+ padding-block-start: var(--pf-v6-c-panel__footer--PaddingBlockStart);
19430
+ padding-block-end: var(--pf-v6-c-panel__footer--PaddingBlockEnd);
19431
+ padding-inline-start: var(--pf-v6-c-panel__footer--PaddingInlineStart);
19432
+ padding-inline-end: var(--pf-v6-c-panel__footer--PaddingInlineEnd);
19433
+ box-shadow: var(--pf-v6-c-panel__footer--BoxShadow);
19434
+ }
19435
+
19084
19436
  :where(:root, .pf-v6-c-alert-group) {
19085
19437
  --pf-v6-c-alert-group__item--MarginBlockStart: var(--pf-t--global--spacer--gap--group--vertical);
19086
19438
  --pf-v6-c-alert-group--m-toast--InsetBlockStart: var(--pf-t--global--spacer--2xl);
@@ -19245,114 +19597,12 @@ label.pf-v6-c-tree-view__node-text {
19245
19597
 
19246
19598
  @supports (-webkit-hyphens: none) {
19247
19599
  .pf-v6-c-truncate__end {
19248
- direction: ltr;
19249
- }
19250
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-truncate__end {
19251
- direction: rtl;
19252
- }
19253
- }
19254
- :where(:root, .pf-v6-c-panel) {
19255
- --pf-v6-c-panel--Width: auto;
19256
- --pf-v6-c-panel--MinWidth: auto;
19257
- --pf-v6-c-panel--MaxWidth: none;
19258
- --pf-v6-c-panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
19259
- --pf-v6-c-panel--BoxShadow: none;
19260
- --pf-v6-c-panel--BorderRadius: var(--pf-t--global--border--radius--small);
19261
- --pf-v6-c-panel--before--BorderWidth: 0;
19262
- --pf-v6-c-panel--before--BorderColor: var(--pf-t--global--border--color--default);
19263
- --pf-v6-c-panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
19264
- --pf-v6-c-panel--m-bordered--before--BorderWidth: var(--pf-t--global--border--width--box--default);
19265
- --pf-v6-c-panel--m-raised--BoxShadow: var(--pf-t--global--box-shadow--md);
19266
- --pf-v6-c-panel--m-raised--BackgroundColor: var(--pf-t--global--background--color--floating--default);
19267
- --pf-v6-c-panel__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
19268
- --pf-v6-c-panel__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
19269
- --pf-v6-c-panel__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
19270
- --pf-v6-c-panel__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
19271
- --pf-v6-c-panel__main--MaxHeight: none;
19272
- --pf-v6-c-panel__main--Overflow: visible;
19273
- --pf-v6-c-panel__main-body--PaddingBlockStart: var(--pf-t--global--spacer--md);
19274
- --pf-v6-c-panel__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
19275
- --pf-v6-c-panel__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--md);
19276
- --pf-v6-c-panel__main-body--PaddingInlineStart: var(--pf-t--global--spacer--lg);
19277
- --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-t--global--spacer--sm);
19278
- --pf-v6-c-panel__footer--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
19279
- --pf-v6-c-panel__footer--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
19280
- --pf-v6-c-panel__footer--PaddingInlineStart: var(--pf-t--global--spacer--lg);
19281
- --pf-v6-c-panel__footer--BoxShadow: none;
19282
- --pf-v6-c-panel--m-scrollable__main--MaxHeight: 18.75rem;
19283
- --pf-v6-c-panel--m-scrollable__main--Overflow: auto;
19284
- --pf-v6-c-panel--m-scrollable__footer--BoxShadow: var(--pf-t--global--box-shadow--md--top);
19285
- --pf-v6-c-panel--m-scrollable__footer--PaddingBlockStart: var(--pf-t--global--spacer--md);
19286
- --pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd: var(--pf-t--global--spacer--md);
19287
- }
19288
-
19289
- .pf-v6-c-panel {
19290
- position: relative;
19291
- width: var(--pf-v6-c-panel--Width);
19292
- min-width: var(--pf-v6-c-panel--MinWidth);
19293
- max-width: var(--pf-v6-c-panel--MaxWidth);
19294
- background-color: var(--pf-v6-c-panel--BackgroundColor);
19295
- border-radius: var(--pf-v6-c-panel--BorderRadius);
19296
- box-shadow: var(--pf-v6-c-panel--BoxShadow);
19297
- }
19298
-
19299
- .pf-v6-c-panel::before {
19300
- position: absolute;
19301
- inset: 0;
19302
- pointer-events: none;
19303
- content: "";
19304
- border: var(--pf-v6-c-panel--before--BorderWidth) solid var(--pf-v6-c-panel--before--BorderColor);
19305
- border-radius: var(--pf-v6-c-panel--BorderRadius);
19306
- }
19307
-
19308
- .pf-v6-c-panel.pf-m-bordered {
19309
- --pf-v6-c-panel--before--BorderWidth: var(--pf-v6-c-panel--m-bordered--before--BorderWidth);
19310
- }
19311
-
19312
- .pf-v6-c-panel.pf-m-secondary {
19313
- --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-secondary--BackgroundColor);
19314
- }
19315
-
19316
- .pf-v6-c-panel.pf-m-raised {
19317
- --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-raised--BackgroundColor);
19318
- --pf-v6-c-panel--BoxShadow: var(--pf-v6-c-panel--m-raised--BoxShadow);
19319
- }
19320
-
19321
- .pf-v6-c-panel.pf-m-scrollable {
19322
- --pf-v6-c-panel__main--MaxHeight: var(--pf-v6-c-panel--m-scrollable__main--MaxHeight);
19323
- --pf-v6-c-panel__main--Overflow: var(--pf-v6-c-panel--m-scrollable__main--Overflow);
19324
- --pf-v6-c-panel__footer--BoxShadow: var(--pf-v6-c-panel--m-scrollable__footer--BoxShadow);
19325
- --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-v6-c-panel--m-scrollable__footer--PaddingBlockStart);
19326
- --pf-v6-c-panel__footer--PaddingBlockEnd: var(--pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd);
19327
- }
19328
-
19329
- .pf-v6-c-panel__header {
19330
- padding-block-start: var(--pf-v6-c-panel__header--PaddingBlockStart);
19331
- padding-block-end: var(--pf-v6-c-panel__header--PaddingBlockEnd);
19332
- padding-inline-start: var(--pf-v6-c-panel__header--PaddingInlineStart);
19333
- padding-inline-end: var(--pf-v6-c-panel__header--PaddingInlineEnd);
19334
- }
19335
-
19336
- .pf-v6-c-panel__main {
19337
- max-height: var(--pf-v6-c-panel__main--MaxHeight);
19338
- overflow: var(--pf-v6-c-panel__main--Overflow);
19339
- }
19340
-
19341
- .pf-v6-c-panel__main-body {
19342
- padding-block-start: var(--pf-v6-c-panel__main-body--PaddingBlockStart);
19343
- padding-block-end: var(--pf-v6-c-panel__main-body--PaddingBlockEnd);
19344
- padding-inline-start: var(--pf-v6-c-panel__main-body--PaddingInlineStart);
19345
- padding-inline-end: var(--pf-v6-c-panel__main-body--PaddingInlineEnd);
19346
- }
19347
-
19348
- .pf-v6-c-panel__footer {
19349
- padding-block-start: var(--pf-v6-c-panel__footer--PaddingBlockStart);
19350
- padding-block-end: var(--pf-v6-c-panel__footer--PaddingBlockEnd);
19351
- padding-inline-start: var(--pf-v6-c-panel__footer--PaddingInlineStart);
19352
- padding-inline-end: var(--pf-v6-c-panel__footer--PaddingInlineEnd);
19353
- box-shadow: var(--pf-v6-c-panel__footer--BoxShadow);
19600
+ direction: ltr;
19601
+ }
19602
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-truncate__end {
19603
+ direction: rtl;
19604
+ }
19354
19605
  }
19355
-
19356
19606
  :where(:root, .pf-v6-l-bullseye) {
19357
19607
  --pf-v6-l-bullseye--Padding: 0;
19358
19608
  }
@@ -22976,256 +23226,6 @@ label.pf-v6-c-tree-view__node-text {
22976
23226
  gap: var(--pf-v6-l-stack--m-gutter--Gap);
22977
23227
  }
22978
23228
 
22979
- :where(:root, .pf-v6-c-avatar) {
22980
- --pf-v6-c-avatar--BorderColor: transparent;
22981
- --pf-v6-c-avatar--BorderWidth: 0;
22982
- --pf-v6-c-avatar--BorderRadius: var(--pf-t--global--border--radius--pill);
22983
- --pf-v6-c-avatar--Width: 2.25rem;
22984
- --pf-v6-c-avatar--Height: 2.25rem;
22985
- --pf-v6-c-avatar--m-sm--Width: 1.5rem;
22986
- --pf-v6-c-avatar--m-sm--Height: 1.5rem;
22987
- --pf-v6-c-avatar--m-md--Width: 2.25rem;
22988
- --pf-v6-c-avatar--m-md--Height: 2.25rem;
22989
- --pf-v6-c-avatar--m-lg--Width: 4.5rem;
22990
- --pf-v6-c-avatar--m-lg--Height: 4.5rem;
22991
- --pf-v6-c-avatar--m-xl--Width: 8rem;
22992
- --pf-v6-c-avatar--m-xl--Height: 8rem;
22993
- --pf-v6-c-avatar--m-bordered--BorderColor: var(--pf-t--global--border--color--default);
22994
- --pf-v6-c-avatar--m-bordered--BorderWidth: var(--pf-t--global--border--width--box--default);
22995
- }
22996
-
22997
- .pf-v6-c-avatar {
22998
- width: var(--pf-v6-c-avatar--Width);
22999
- height: var(--pf-v6-c-avatar--Height);
23000
- border: var(--pf-v6-c-avatar--BorderWidth) solid var(--pf-v6-c-avatar--BorderColor);
23001
- border-radius: var(--pf-v6-c-avatar--BorderRadius);
23002
- }
23003
-
23004
- .pf-v6-c-avatar.pf-m-bordered {
23005
- --pf-v6-c-avatar--BorderColor: var(--pf-v6-c-avatar--m-bordered--BorderColor);
23006
- --pf-v6-c-avatar--BorderWidth: var(--pf-v6-c-avatar--m-bordered--BorderWidth);
23007
- }
23008
-
23009
- .pf-v6-c-avatar.pf-m-sm {
23010
- --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-sm--Width);
23011
- --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-sm--Height);
23012
- }
23013
-
23014
- @media (min-width: 576px) {
23015
- .pf-v6-c-avatar.pf-m-sm {
23016
- --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-sm--Width-on-sm, var(--pf-v6-c-avatar--m-sm--Width));
23017
- }
23018
- }
23019
- @media (min-width: 768px) {
23020
- .pf-v6-c-avatar.pf-m-sm {
23021
- --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)));
23022
- }
23023
- }
23024
- @media (min-width: 992px) {
23025
- .pf-v6-c-avatar.pf-m-sm {
23026
- --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))));
23027
- }
23028
- }
23029
- @media (min-width: 1200px) {
23030
- .pf-v6-c-avatar.pf-m-sm {
23031
- --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)))));
23032
- }
23033
- }
23034
- @media (min-width: 1450px) {
23035
- .pf-v6-c-avatar.pf-m-sm {
23036
- --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))))));
23037
- }
23038
- }
23039
- @media (min-width: 576px) {
23040
- .pf-v6-c-avatar.pf-m-sm {
23041
- --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-sm--Height-on-sm, var(--pf-v6-c-avatar--m-sm--Height));
23042
- }
23043
- }
23044
- @media (min-width: 768px) {
23045
- .pf-v6-c-avatar.pf-m-sm {
23046
- --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)));
23047
- }
23048
- }
23049
- @media (min-width: 992px) {
23050
- .pf-v6-c-avatar.pf-m-sm {
23051
- --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))));
23052
- }
23053
- }
23054
- @media (min-width: 1200px) {
23055
- .pf-v6-c-avatar.pf-m-sm {
23056
- --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)))));
23057
- }
23058
- }
23059
- @media (min-width: 1450px) {
23060
- .pf-v6-c-avatar.pf-m-sm {
23061
- --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))))));
23062
- }
23063
- }
23064
- .pf-v6-c-avatar.pf-m-md {
23065
- --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-md--Width);
23066
- --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-md--Height);
23067
- }
23068
-
23069
- @media (min-width: 576px) {
23070
- .pf-v6-c-avatar.pf-m-md {
23071
- --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-md--Width-on-sm, var(--pf-v6-c-avatar--m-md--Width));
23072
- }
23073
- }
23074
- @media (min-width: 768px) {
23075
- .pf-v6-c-avatar.pf-m-md {
23076
- --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)));
23077
- }
23078
- }
23079
- @media (min-width: 992px) {
23080
- .pf-v6-c-avatar.pf-m-md {
23081
- --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))));
23082
- }
23083
- }
23084
- @media (min-width: 1200px) {
23085
- .pf-v6-c-avatar.pf-m-md {
23086
- --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)))));
23087
- }
23088
- }
23089
- @media (min-width: 1450px) {
23090
- .pf-v6-c-avatar.pf-m-md {
23091
- --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))))));
23092
- }
23093
- }
23094
- @media (min-width: 576px) {
23095
- .pf-v6-c-avatar.pf-m-md {
23096
- --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-md--Height-on-sm, var(--pf-v6-c-avatar--m-md--Height));
23097
- }
23098
- }
23099
- @media (min-width: 768px) {
23100
- .pf-v6-c-avatar.pf-m-md {
23101
- --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)));
23102
- }
23103
- }
23104
- @media (min-width: 992px) {
23105
- .pf-v6-c-avatar.pf-m-md {
23106
- --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))));
23107
- }
23108
- }
23109
- @media (min-width: 1200px) {
23110
- .pf-v6-c-avatar.pf-m-md {
23111
- --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)))));
23112
- }
23113
- }
23114
- @media (min-width: 1450px) {
23115
- .pf-v6-c-avatar.pf-m-md {
23116
- --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))))));
23117
- }
23118
- }
23119
- .pf-v6-c-avatar.pf-m-lg {
23120
- --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-lg--Width);
23121
- --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-lg--Height);
23122
- }
23123
-
23124
- @media (min-width: 576px) {
23125
- .pf-v6-c-avatar.pf-m-lg {
23126
- --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-lg--Width-on-sm, var(--pf-v6-c-avatar--m-lg--Width));
23127
- }
23128
- }
23129
- @media (min-width: 768px) {
23130
- .pf-v6-c-avatar.pf-m-lg {
23131
- --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)));
23132
- }
23133
- }
23134
- @media (min-width: 992px) {
23135
- .pf-v6-c-avatar.pf-m-lg {
23136
- --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))));
23137
- }
23138
- }
23139
- @media (min-width: 1200px) {
23140
- .pf-v6-c-avatar.pf-m-lg {
23141
- --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)))));
23142
- }
23143
- }
23144
- @media (min-width: 1450px) {
23145
- .pf-v6-c-avatar.pf-m-lg {
23146
- --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))))));
23147
- }
23148
- }
23149
- @media (min-width: 576px) {
23150
- .pf-v6-c-avatar.pf-m-lg {
23151
- --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-lg--Height-on-sm, var(--pf-v6-c-avatar--m-lg--Height));
23152
- }
23153
- }
23154
- @media (min-width: 768px) {
23155
- .pf-v6-c-avatar.pf-m-lg {
23156
- --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)));
23157
- }
23158
- }
23159
- @media (min-width: 992px) {
23160
- .pf-v6-c-avatar.pf-m-lg {
23161
- --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))));
23162
- }
23163
- }
23164
- @media (min-width: 1200px) {
23165
- .pf-v6-c-avatar.pf-m-lg {
23166
- --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)))));
23167
- }
23168
- }
23169
- @media (min-width: 1450px) {
23170
- .pf-v6-c-avatar.pf-m-lg {
23171
- --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))))));
23172
- }
23173
- }
23174
- .pf-v6-c-avatar.pf-m-xl {
23175
- --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-xl--Width);
23176
- --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-xl--Height);
23177
- }
23178
-
23179
- @media (min-width: 576px) {
23180
- .pf-v6-c-avatar.pf-m-xl {
23181
- --pf-v6-c-avatar--Width: var(--pf-v6-c-avatar--m-xl--Width-on-sm, var(--pf-v6-c-avatar--m-xl--Width));
23182
- }
23183
- }
23184
- @media (min-width: 768px) {
23185
- .pf-v6-c-avatar.pf-m-xl {
23186
- --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)));
23187
- }
23188
- }
23189
- @media (min-width: 992px) {
23190
- .pf-v6-c-avatar.pf-m-xl {
23191
- --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))));
23192
- }
23193
- }
23194
- @media (min-width: 1200px) {
23195
- .pf-v6-c-avatar.pf-m-xl {
23196
- --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)))));
23197
- }
23198
- }
23199
- @media (min-width: 1450px) {
23200
- .pf-v6-c-avatar.pf-m-xl {
23201
- --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))))));
23202
- }
23203
- }
23204
- @media (min-width: 576px) {
23205
- .pf-v6-c-avatar.pf-m-xl {
23206
- --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height));
23207
- }
23208
- }
23209
- @media (min-width: 768px) {
23210
- .pf-v6-c-avatar.pf-m-xl {
23211
- --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)));
23212
- }
23213
- }
23214
- @media (min-width: 992px) {
23215
- .pf-v6-c-avatar.pf-m-xl {
23216
- --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))));
23217
- }
23218
- }
23219
- @media (min-width: 1200px) {
23220
- .pf-v6-c-avatar.pf-m-xl {
23221
- --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)))));
23222
- }
23223
- }
23224
- @media (min-width: 1450px) {
23225
- .pf-v6-c-avatar.pf-m-xl {
23226
- --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))))));
23227
- }
23228
- }
23229
23229
  :where(:root, .pf-v6-c-about-modal-box) {
23230
23230
  --pf-v6-c-about-modal-box--BackgroundImage: none;
23231
23231
  --pf-v6-c-about-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);