@patternfly/react-core 4.249.0 → 4.250.0

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 (190) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/esm/next/components/Select/Select.d.ts +28 -0
  3. package/dist/esm/next/components/Select/Select.d.ts.map +1 -0
  4. package/dist/esm/next/components/Select/Select.js +62 -0
  5. package/dist/esm/next/components/Select/Select.js.map +1 -0
  6. package/dist/esm/next/components/Select/SelectGroup.d.ts +12 -0
  7. package/dist/esm/next/components/Select/SelectGroup.d.ts.map +1 -0
  8. package/dist/esm/next/components/Select/SelectGroup.js +10 -0
  9. package/dist/esm/next/components/Select/SelectGroup.js.map +1 -0
  10. package/dist/esm/next/components/Select/SelectList.d.ts +10 -0
  11. package/dist/esm/next/components/Select/SelectList.d.ts.map +1 -0
  12. package/dist/esm/next/components/Select/SelectList.js +10 -0
  13. package/dist/esm/next/components/Select/SelectList.js.map +1 -0
  14. package/dist/esm/next/components/Select/SelectOption.d.ts +20 -0
  15. package/dist/esm/next/components/Select/SelectOption.d.ts.map +1 -0
  16. package/dist/esm/next/components/Select/SelectOption.js +10 -0
  17. package/dist/esm/next/components/Select/SelectOption.js.map +1 -0
  18. package/dist/esm/next/components/Select/index.d.ts +5 -0
  19. package/dist/esm/next/components/Select/index.d.ts.map +1 -0
  20. package/dist/esm/next/components/Select/index.js +5 -0
  21. package/dist/esm/next/components/Select/index.js.map +1 -0
  22. package/dist/esm/next/components/Wizard/Wizard.d.ts +9 -7
  23. package/dist/esm/next/components/Wizard/Wizard.d.ts.map +1 -1
  24. package/dist/esm/next/components/Wizard/Wizard.js +62 -48
  25. package/dist/esm/next/components/Wizard/Wizard.js.map +1 -1
  26. package/dist/esm/next/components/Wizard/WizardBody.d.ts +2 -2
  27. package/dist/esm/next/components/Wizard/WizardBody.d.ts.map +1 -1
  28. package/dist/esm/next/components/Wizard/WizardBody.js +1 -1
  29. package/dist/esm/next/components/Wizard/WizardBody.js.map +1 -1
  30. package/dist/esm/next/components/Wizard/WizardContext.d.ts +21 -20
  31. package/dist/esm/next/components/Wizard/WizardContext.d.ts.map +1 -1
  32. package/dist/esm/next/components/Wizard/WizardContext.js +63 -32
  33. package/dist/esm/next/components/Wizard/WizardContext.js.map +1 -1
  34. package/dist/esm/next/components/Wizard/WizardFooter.d.ts +20 -6
  35. package/dist/esm/next/components/Wizard/WizardFooter.d.ts.map +1 -1
  36. package/dist/esm/next/components/Wizard/WizardFooter.js +13 -4
  37. package/dist/esm/next/components/Wizard/WizardFooter.js.map +1 -1
  38. package/dist/esm/next/components/Wizard/WizardHeader.d.ts +1 -1
  39. package/dist/esm/next/components/Wizard/WizardHeader.d.ts.map +1 -1
  40. package/dist/esm/next/components/Wizard/WizardHeader.js +2 -2
  41. package/dist/esm/next/components/Wizard/WizardHeader.js.map +1 -1
  42. package/dist/esm/next/components/Wizard/WizardNav.d.ts +5 -5
  43. package/dist/esm/next/components/Wizard/WizardNav.d.ts.map +1 -1
  44. package/dist/esm/next/components/Wizard/WizardNav.js +3 -4
  45. package/dist/esm/next/components/Wizard/WizardNav.js.map +1 -1
  46. package/dist/esm/next/components/Wizard/WizardNavInternal.d.ts +14 -0
  47. package/dist/esm/next/components/Wizard/WizardNavInternal.d.ts.map +1 -0
  48. package/dist/esm/next/components/Wizard/WizardNavInternal.js +49 -0
  49. package/dist/esm/next/components/Wizard/WizardNavInternal.js.map +1 -0
  50. package/dist/esm/next/components/Wizard/WizardNavItem.d.ts +12 -8
  51. package/dist/esm/next/components/Wizard/WizardNavItem.d.ts.map +1 -1
  52. package/dist/esm/next/components/Wizard/WizardNavItem.js +23 -12
  53. package/dist/esm/next/components/Wizard/WizardNavItem.js.map +1 -1
  54. package/dist/esm/next/components/Wizard/WizardStep.d.ts +22 -6
  55. package/dist/esm/next/components/Wizard/WizardStep.d.ts.map +1 -1
  56. package/dist/esm/next/components/Wizard/WizardStep.js +20 -1
  57. package/dist/esm/next/components/Wizard/WizardStep.js.map +1 -1
  58. package/dist/esm/next/components/Wizard/WizardToggle.d.ts +9 -15
  59. package/dist/esm/next/components/Wizard/WizardToggle.d.ts.map +1 -1
  60. package/dist/esm/next/components/Wizard/WizardToggle.js +15 -50
  61. package/dist/esm/next/components/Wizard/WizardToggle.js.map +1 -1
  62. package/dist/esm/next/components/Wizard/hooks/useWizardFooter.d.ts +2 -2
  63. package/dist/esm/next/components/Wizard/hooks/useWizardFooter.d.ts.map +1 -1
  64. package/dist/esm/next/components/Wizard/hooks/useWizardFooter.js +3 -3
  65. package/dist/esm/next/components/Wizard/hooks/useWizardFooter.js.map +1 -1
  66. package/dist/esm/next/components/Wizard/types.d.ts +37 -46
  67. package/dist/esm/next/components/Wizard/types.d.ts.map +1 -1
  68. package/dist/esm/next/components/Wizard/types.js +10 -2
  69. package/dist/esm/next/components/Wizard/types.js.map +1 -1
  70. package/dist/esm/next/components/Wizard/utils.d.ts +4 -5
  71. package/dist/esm/next/components/Wizard/utils.d.ts.map +1 -1
  72. package/dist/esm/next/components/Wizard/utils.js +20 -13
  73. package/dist/esm/next/components/Wizard/utils.js.map +1 -1
  74. package/dist/esm/next/components/index.d.ts +2 -1
  75. package/dist/esm/next/components/index.d.ts.map +1 -1
  76. package/dist/esm/next/components/index.js +2 -1
  77. package/dist/esm/next/components/index.js.map +1 -1
  78. package/dist/js/next/components/Select/Select.d.ts +28 -0
  79. package/dist/js/next/components/Select/Select.d.ts.map +1 -0
  80. package/dist/js/next/components/Select/Select.js +65 -0
  81. package/dist/js/next/components/Select/Select.js.map +1 -0
  82. package/dist/js/next/components/Select/SelectGroup.d.ts +12 -0
  83. package/dist/js/next/components/Select/SelectGroup.d.ts.map +1 -0
  84. package/dist/js/next/components/Select/SelectGroup.js +14 -0
  85. package/dist/js/next/components/Select/SelectGroup.js.map +1 -0
  86. package/dist/js/next/components/Select/SelectList.d.ts +10 -0
  87. package/dist/js/next/components/Select/SelectList.d.ts.map +1 -0
  88. package/dist/js/next/components/Select/SelectList.js +14 -0
  89. package/dist/js/next/components/Select/SelectList.js.map +1 -0
  90. package/dist/js/next/components/Select/SelectOption.d.ts +20 -0
  91. package/dist/js/next/components/Select/SelectOption.d.ts.map +1 -0
  92. package/dist/js/next/components/Select/SelectOption.js +14 -0
  93. package/dist/js/next/components/Select/SelectOption.js.map +1 -0
  94. package/dist/js/next/components/Select/index.d.ts +5 -0
  95. package/dist/js/next/components/Select/index.d.ts.map +1 -0
  96. package/dist/js/next/components/Select/index.js +8 -0
  97. package/dist/js/next/components/Select/index.js.map +1 -0
  98. package/dist/js/next/components/Wizard/Wizard.d.ts +9 -7
  99. package/dist/js/next/components/Wizard/Wizard.d.ts.map +1 -1
  100. package/dist/js/next/components/Wizard/Wizard.js +59 -45
  101. package/dist/js/next/components/Wizard/Wizard.js.map +1 -1
  102. package/dist/js/next/components/Wizard/WizardBody.d.ts +2 -2
  103. package/dist/js/next/components/Wizard/WizardBody.d.ts.map +1 -1
  104. package/dist/js/next/components/Wizard/WizardBody.js +1 -1
  105. package/dist/js/next/components/Wizard/WizardBody.js.map +1 -1
  106. package/dist/js/next/components/Wizard/WizardContext.d.ts +21 -20
  107. package/dist/js/next/components/Wizard/WizardContext.d.ts.map +1 -1
  108. package/dist/js/next/components/Wizard/WizardContext.js +61 -30
  109. package/dist/js/next/components/Wizard/WizardContext.js.map +1 -1
  110. package/dist/js/next/components/Wizard/WizardFooter.d.ts +20 -6
  111. package/dist/js/next/components/Wizard/WizardFooter.d.ts.map +1 -1
  112. package/dist/js/next/components/Wizard/WizardFooter.js +15 -6
  113. package/dist/js/next/components/Wizard/WizardFooter.js.map +1 -1
  114. package/dist/js/next/components/Wizard/WizardHeader.d.ts +1 -1
  115. package/dist/js/next/components/Wizard/WizardHeader.d.ts.map +1 -1
  116. package/dist/js/next/components/Wizard/WizardHeader.js +2 -2
  117. package/dist/js/next/components/Wizard/WizardHeader.js.map +1 -1
  118. package/dist/js/next/components/Wizard/WizardNav.d.ts +5 -5
  119. package/dist/js/next/components/Wizard/WizardNav.d.ts.map +1 -1
  120. package/dist/js/next/components/Wizard/WizardNav.js +3 -4
  121. package/dist/js/next/components/Wizard/WizardNav.js.map +1 -1
  122. package/dist/js/next/components/Wizard/WizardNavInternal.d.ts +14 -0
  123. package/dist/js/next/components/Wizard/WizardNavInternal.d.ts.map +1 -0
  124. package/dist/js/next/components/Wizard/WizardNavInternal.js +54 -0
  125. package/dist/js/next/components/Wizard/WizardNavInternal.js.map +1 -0
  126. package/dist/js/next/components/Wizard/WizardNavItem.d.ts +12 -8
  127. package/dist/js/next/components/Wizard/WizardNavItem.d.ts.map +1 -1
  128. package/dist/js/next/components/Wizard/WizardNavItem.js +23 -12
  129. package/dist/js/next/components/Wizard/WizardNavItem.js.map +1 -1
  130. package/dist/js/next/components/Wizard/WizardStep.d.ts +22 -6
  131. package/dist/js/next/components/Wizard/WizardStep.d.ts.map +1 -1
  132. package/dist/js/next/components/Wizard/WizardStep.js +20 -1
  133. package/dist/js/next/components/Wizard/WizardStep.js.map +1 -1
  134. package/dist/js/next/components/Wizard/WizardToggle.d.ts +9 -15
  135. package/dist/js/next/components/Wizard/WizardToggle.d.ts.map +1 -1
  136. package/dist/js/next/components/Wizard/WizardToggle.js +15 -51
  137. package/dist/js/next/components/Wizard/WizardToggle.js.map +1 -1
  138. package/dist/js/next/components/Wizard/hooks/useWizardFooter.d.ts +2 -2
  139. package/dist/js/next/components/Wizard/hooks/useWizardFooter.d.ts.map +1 -1
  140. package/dist/js/next/components/Wizard/hooks/useWizardFooter.js +3 -3
  141. package/dist/js/next/components/Wizard/hooks/useWizardFooter.js.map +1 -1
  142. package/dist/js/next/components/Wizard/types.d.ts +37 -46
  143. package/dist/js/next/components/Wizard/types.d.ts.map +1 -1
  144. package/dist/js/next/components/Wizard/types.js +12 -3
  145. package/dist/js/next/components/Wizard/types.js.map +1 -1
  146. package/dist/js/next/components/Wizard/utils.d.ts +4 -5
  147. package/dist/js/next/components/Wizard/utils.d.ts.map +1 -1
  148. package/dist/js/next/components/Wizard/utils.js +24 -15
  149. package/dist/js/next/components/Wizard/utils.js.map +1 -1
  150. package/dist/js/next/components/index.d.ts +2 -1
  151. package/dist/js/next/components/index.d.ts.map +1 -1
  152. package/dist/js/next/components/index.js +2 -1
  153. package/dist/js/next/components/index.js.map +1 -1
  154. package/dist/umd/react-core.min.css +940 -940
  155. package/package.json +2 -2
  156. package/src/next/components/Select/Select.tsx +129 -0
  157. package/src/next/components/Select/SelectGroup.tsx +24 -0
  158. package/src/next/components/Select/SelectList.tsx +21 -0
  159. package/src/next/components/Select/SelectOption.tsx +31 -0
  160. package/src/next/components/Select/examples/Select.md +37 -0
  161. package/src/next/components/Select/examples/SelectBasic.tsx +54 -0
  162. package/src/next/components/Select/examples/SelectCheckbox.tsx +67 -0
  163. package/src/next/components/Select/examples/SelectGrouped.tsx +63 -0
  164. package/src/next/components/Select/examples/SelectMultiTypeahead.tsx +195 -0
  165. package/src/next/components/Select/examples/SelectTypeahead.tsx +191 -0
  166. package/src/next/components/Select/index.ts +4 -0
  167. package/src/next/components/Wizard/Wizard.tsx +107 -64
  168. package/src/next/components/Wizard/WizardBody.tsx +4 -4
  169. package/src/next/components/Wizard/WizardContext.tsx +117 -65
  170. package/src/next/components/Wizard/WizardFooter.tsx +39 -17
  171. package/src/next/components/Wizard/WizardHeader.tsx +6 -3
  172. package/src/next/components/Wizard/WizardNav.tsx +9 -10
  173. package/src/next/components/Wizard/WizardNavInternal.tsx +137 -0
  174. package/src/next/components/Wizard/WizardNavItem.tsx +47 -20
  175. package/src/next/components/Wizard/WizardStep.tsx +52 -7
  176. package/src/next/components/Wizard/WizardToggle.tsx +24 -142
  177. package/src/next/components/Wizard/__tests__/Wizard.test.tsx +10 -13
  178. package/src/next/components/Wizard/__tests__/WizardBody.test.tsx +3 -3
  179. package/src/next/components/Wizard/__tests__/WizardFooter.test.tsx +11 -14
  180. package/src/next/components/Wizard/__tests__/WizardStep.test.tsx +100 -0
  181. package/src/next/components/Wizard/__tests__/WizardToggle.test.tsx +4 -4
  182. package/src/next/components/Wizard/examples/Wizard.md +40 -15
  183. package/src/next/components/Wizard/examples/WizardBasic.tsx +2 -2
  184. package/src/next/components/Wizard/examples/WizardCustomNav.tsx +4 -4
  185. package/src/next/components/Wizard/examples/WizardKitchenSink.tsx +126 -60
  186. package/src/next/components/Wizard/hooks/__tests__/useWizardFooter.test.tsx +23 -34
  187. package/src/next/components/Wizard/hooks/useWizardFooter.tsx +5 -5
  188. package/src/next/components/Wizard/types.tsx +59 -53
  189. package/src/next/components/Wizard/utils.ts +25 -16
  190. package/src/next/components/index.ts +2 -1
@@ -10312,6 +10312,150 @@ label.pf-c-input-group__text {
10312
10312
  --pf-c-sidebar__panel--FlexBasis: 100%;
10313
10313
  }
10314
10314
  }
10315
+ .pf-c-label-group {
10316
+ --pf-c-label-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
10317
+ --pf-c-label-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
10318
+ --pf-c-label-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
10319
+ --pf-c-label-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
10320
+ --pf-c-label-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
10321
+ --pf-c-label-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
10322
+ --pf-c-label-group--m-vertical--m-category--PaddingRight: var(--pf-global--spacer--sm);
10323
+ --pf-c-label-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
10324
+ --pf-c-label-group--m-category--BorderWidth: var(--pf-global--BorderWidth--sm);
10325
+ --pf-c-label-group--m-category--BorderColor: var(--pf-global--BorderColor--300);
10326
+ --pf-c-label-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--100);
10327
+ --pf-c-label-group__label--MarginRight: var(--pf-global--spacer--sm);
10328
+ --pf-c-label-group__label--MarginBottom: 0;
10329
+ --pf-c-label-group--m-vertical__label--MarginBottom: var(--pf-global--spacer--sm);
10330
+ --pf-c-label-group__label--FontSize: var(--pf-global--FontSize--sm);
10331
+ --pf-c-label-group__label--MaxWidth: 18ch;
10332
+ --pf-c-label-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
10333
+ --pf-c-label-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
10334
+ --pf-c-label-group--m-vertical__close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
10335
+ --pf-c-label-group--m-vertical__close--MarginRight: calc(var(--pf-global--spacer--form-element) * -1);
10336
+ --pf-c-label-group--m-vertical__close--MarginLeft: var(--pf-global--spacer--sm);
10337
+ --pf-c-label-group--m-vertical__close--c-button--PaddingRight: var(--pf-global--spacer--sm);
10338
+ --pf-c-label-group--m-vertical__close--c-button--PaddingLeft: var(--pf-global--spacer--sm);
10339
+ --pf-c-label-group__list-item--MarginRight: var(--pf-global--spacer--xs);
10340
+ --pf-c-label-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
10341
+ --pf-c-label-group__textarea--MinWidth: 12.5rem;
10342
+ --pf-c-label-group__textarea--PaddingTop: 0.125rem;
10343
+ --pf-c-label-group__textarea--PaddingRight: var(--pf-global--spacer--xs);
10344
+ --pf-c-label-group__textarea--PaddingBottom: 0;
10345
+ --pf-c-label-group__textarea--PaddingLeft: var(--pf-global--spacer--xs);
10346
+ display: inline-flex;
10347
+ align-items: center;
10348
+ }
10349
+
10350
+ .pf-c-label-group.pf-m-category {
10351
+ padding-top: var(--pf-c-label-group--m-category--PaddingTop);
10352
+ padding-right: var(--pf-c-label-group--m-category--PaddingRight);
10353
+ padding-bottom: var(--pf-c-label-group--m-category--PaddingBottom);
10354
+ padding-left: var(--pf-c-label-group--m-category--PaddingLeft);
10355
+ background-color: var(--pf-c-label-group--m-category--BackgroundColor);
10356
+ border: var(--pf-c-label-group--m-category--BorderWidth) solid var(--pf-c-label-group--m-category--BorderColor);
10357
+ border-radius: var(--pf-c-label-group--m-category--BorderRadius);
10358
+ }
10359
+
10360
+ .pf-c-label-group.pf-m-vertical {
10361
+ --pf-c-label-group__list--MarginRight: 0;
10362
+ --pf-c-label-group__list--MarginBottom: 0;
10363
+ --pf-c-label-group__list-item--MarginRight: 0;
10364
+ --pf-c-label-group__label--MarginRight: 0;
10365
+ --pf-c-label-group__label--MarginBottom: var(--pf-c-label-group--m-vertical__label--MarginBottom);
10366
+ --pf-c-label-group__close--MarginTop: var(--pf-c-label-group--m-vertical__close--MarginTop);
10367
+ --pf-c-label-group__close--MarginLeft: var(--pf-c-label-group--m-vertical__close--MarginLeft);
10368
+ --pf-c-label-group__close--MarginBottom: 0;
10369
+ --pf-c-label-group__close--MarginRight: var(--pf-c-label-group--m-vertical__close--MarginRight);
10370
+ --pf-c-label-group--m-category--PaddingRight: var(--pf-c-label-group--m-vertical--m-category--PaddingRight);
10371
+ }
10372
+
10373
+ .pf-c-label-group.pf-m-vertical.pf-c-label-group {
10374
+ align-items: flex-start;
10375
+ }
10376
+
10377
+ .pf-c-label-group.pf-m-vertical .pf-c-label-group__list {
10378
+ flex-direction: column;
10379
+ align-items: flex-start;
10380
+ }
10381
+
10382
+ .pf-c-label-group.pf-m-vertical .pf-c-label-group__main {
10383
+ flex-direction: column;
10384
+ }
10385
+
10386
+ .pf-c-label-group.pf-m-vertical .pf-c-label-group__list-item:last-child {
10387
+ --pf-c-label-group__list-item--MarginBottom: 0;
10388
+ }
10389
+
10390
+ .pf-c-label-group.pf-m-vertical .pf-c-label-group__close .pf-c-button {
10391
+ --pf-c-button--PaddingLeft: var(--pf-c-label-group--m-vertical__close--c-button--PaddingLeft);
10392
+ --pf-c-button--PaddingRight: var(--pf-c-label-group--m-vertical__close--c-button--PaddingRight);
10393
+ }
10394
+
10395
+ .pf-c-label-group.pf-m-editable,
10396
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__main,
10397
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__list {
10398
+ display: flex;
10399
+ }
10400
+
10401
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__main,
10402
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__list,
10403
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__list-item.pf-m-textarea,
10404
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__textarea {
10405
+ flex: 1;
10406
+ }
10407
+
10408
+ .pf-c-label-group__main {
10409
+ display: flex;
10410
+ flex: 1;
10411
+ flex-wrap: wrap;
10412
+ align-items: baseline;
10413
+ }
10414
+
10415
+ .pf-c-label-group__list {
10416
+ display: inline-flex;
10417
+ flex-wrap: wrap;
10418
+ margin-right: var(--pf-c-label-group__list--MarginRight);
10419
+ margin-bottom: var(--pf-c-label-group__list--MarginBottom);
10420
+ }
10421
+
10422
+ .pf-c-label-group__list-item {
10423
+ display: inline-flex;
10424
+ margin-right: var(--pf-c-label-group__list-item--MarginRight);
10425
+ margin-bottom: var(--pf-c-label-group__list-item--MarginBottom);
10426
+ }
10427
+
10428
+ .pf-c-label-group__label {
10429
+ overflow: hidden;
10430
+ text-overflow: ellipsis;
10431
+ white-space: nowrap;
10432
+ max-width: var(--pf-c-label-group__label--MaxWidth);
10433
+ margin-right: var(--pf-c-label-group__label--MarginRight);
10434
+ margin-bottom: var(--pf-c-label-group__label--MarginBottom);
10435
+ font-size: var(--pf-c-label-group__label--FontSize);
10436
+ }
10437
+
10438
+ .pf-c-label-group__close {
10439
+ margin-top: var(--pf-c-label-group__close--MarginTop);
10440
+ margin-right: var(--pf-c-label-group__close--MarginRight);
10441
+ margin-bottom: var(--pf-c-label-group__close--MarginBottom);
10442
+ margin-left: var(--pf-c-label-group__close--MarginLeft);
10443
+ }
10444
+
10445
+ .pf-c-label-group__textarea {
10446
+ min-width: var(--pf-c-label-group__textarea--MinWidth);
10447
+ padding: var(--pf-c-label-group__textarea--PaddingTop) var(--pf-c-label-group__textarea--PaddingRight) var(--pf-c-label-group__textarea--PaddingBottom) var(--pf-c-label-group__textarea--PaddingLeft);
10448
+ white-space: nowrap;
10449
+ resize: none;
10450
+ border: 0;
10451
+ -ms-overflow-style: none;
10452
+ scrollbar-width: none;
10453
+ }
10454
+
10455
+ .pf-c-label-group__textarea::-webkit-scrollbar {
10456
+ display: none;
10457
+ }
10458
+
10315
10459
  .pf-c-label {
10316
10460
  --pf-c-label--PaddingTop: var(--pf-global--spacer--xs);
10317
10461
  --pf-c-label--PaddingRight: var(--pf-global--spacer--sm);
@@ -10775,209 +10919,65 @@ button.pf-c-label__content:focus {
10775
10919
  --pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor: var(--pf-global--palette--cyan-100);
10776
10920
  }
10777
10921
 
10778
- .pf-c-label-group {
10779
- --pf-c-label-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
10780
- --pf-c-label-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
10781
- --pf-c-label-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
10782
- --pf-c-label-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
10783
- --pf-c-label-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
10784
- --pf-c-label-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
10785
- --pf-c-label-group--m-vertical--m-category--PaddingRight: var(--pf-global--spacer--sm);
10786
- --pf-c-label-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
10787
- --pf-c-label-group--m-category--BorderWidth: var(--pf-global--BorderWidth--sm);
10788
- --pf-c-label-group--m-category--BorderColor: var(--pf-global--BorderColor--300);
10789
- --pf-c-label-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--100);
10790
- --pf-c-label-group__label--MarginRight: var(--pf-global--spacer--sm);
10791
- --pf-c-label-group__label--MarginBottom: 0;
10792
- --pf-c-label-group--m-vertical__label--MarginBottom: var(--pf-global--spacer--sm);
10793
- --pf-c-label-group__label--FontSize: var(--pf-global--FontSize--sm);
10794
- --pf-c-label-group__label--MaxWidth: 18ch;
10795
- --pf-c-label-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
10796
- --pf-c-label-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
10797
- --pf-c-label-group--m-vertical__close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
10798
- --pf-c-label-group--m-vertical__close--MarginRight: calc(var(--pf-global--spacer--form-element) * -1);
10799
- --pf-c-label-group--m-vertical__close--MarginLeft: var(--pf-global--spacer--sm);
10800
- --pf-c-label-group--m-vertical__close--c-button--PaddingRight: var(--pf-global--spacer--sm);
10801
- --pf-c-label-group--m-vertical__close--c-button--PaddingLeft: var(--pf-global--spacer--sm);
10802
- --pf-c-label-group__list-item--MarginRight: var(--pf-global--spacer--xs);
10803
- --pf-c-label-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
10804
- --pf-c-label-group__textarea--MinWidth: 12.5rem;
10805
- --pf-c-label-group__textarea--PaddingTop: 0.125rem;
10806
- --pf-c-label-group__textarea--PaddingRight: var(--pf-global--spacer--xs);
10807
- --pf-c-label-group__textarea--PaddingBottom: 0;
10808
- --pf-c-label-group__textarea--PaddingLeft: var(--pf-global--spacer--xs);
10809
- display: inline-flex;
10810
- align-items: center;
10922
+ .pf-c-list {
10923
+ --pf-c-list--PaddingLeft: var(--pf-global--spacer--lg);
10924
+ --pf-c-list--nested--MarginTop: var(--pf-global--spacer--sm);
10925
+ --pf-c-list--nested--MarginLeft: var(--pf-global--spacer--sm);
10926
+ --pf-c-list--ul--ListStyle: var(--pf-global--ListStyle);
10927
+ --pf-c-list--li--MarginTop: var(--pf-global--spacer--sm);
10928
+ --pf-c-list--m-inline--li--MarginRight: var(--pf-global--spacer--lg);
10929
+ --pf-c-list--m-bordered--li--PaddingBottom: var(--pf-global--spacer--sm);
10930
+ --pf-c-list--m-bordered--li--BorderBottomColor: var(--pf-global--BorderColor--100);
10931
+ --pf-c-list--m-bordered--li--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
10932
+ --pf-c-list__item-icon--MinWidth: var(--pf-global--icon--FontSize--sm);
10933
+ --pf-c-list__item-icon--MarginTop: 0.375rem;
10934
+ --pf-c-list__item-icon--MarginRight: var(--pf-global--spacer--sm);
10935
+ --pf-c-list__item-icon--Color: var(--pf-global--icon--Color--light);
10936
+ --pf-c-list__item-icon--FontSize: var(--pf-global--icon--FontSize--sm);
10937
+ --pf-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-global--icon--FontSize--lg);
10938
+ --pf-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-global--spacer--md);
10939
+ --pf-c-list--m-icon-lg__item-icon--FontSize: var(--pf-global--icon--FontSize--lg);
10940
+ padding-left: var(--pf-c-list--PaddingLeft);
10811
10941
  }
10812
10942
 
10813
- .pf-c-label-group.pf-m-category {
10814
- padding-top: var(--pf-c-label-group--m-category--PaddingTop);
10815
- padding-right: var(--pf-c-label-group--m-category--PaddingRight);
10816
- padding-bottom: var(--pf-c-label-group--m-category--PaddingBottom);
10817
- padding-left: var(--pf-c-label-group--m-category--PaddingLeft);
10818
- background-color: var(--pf-c-label-group--m-category--BackgroundColor);
10819
- border: var(--pf-c-label-group--m-category--BorderWidth) solid var(--pf-c-label-group--m-category--BorderColor);
10820
- border-radius: var(--pf-c-label-group--m-category--BorderRadius);
10943
+ .pf-c-list ol,
10944
+ .pf-c-list ul {
10945
+ margin-top: var(--pf-c-list--nested--MarginTop);
10946
+ margin-left: var(--pf-c-list--nested--MarginLeft);
10821
10947
  }
10822
10948
 
10823
- .pf-c-label-group.pf-m-vertical {
10824
- --pf-c-label-group__list--MarginRight: 0;
10825
- --pf-c-label-group__list--MarginBottom: 0;
10826
- --pf-c-label-group__list-item--MarginRight: 0;
10827
- --pf-c-label-group__label--MarginRight: 0;
10828
- --pf-c-label-group__label--MarginBottom: var(--pf-c-label-group--m-vertical__label--MarginBottom);
10829
- --pf-c-label-group__close--MarginTop: var(--pf-c-label-group--m-vertical__close--MarginTop);
10830
- --pf-c-label-group__close--MarginLeft: var(--pf-c-label-group--m-vertical__close--MarginLeft);
10831
- --pf-c-label-group__close--MarginBottom: 0;
10832
- --pf-c-label-group__close--MarginRight: var(--pf-c-label-group--m-vertical__close--MarginRight);
10833
- --pf-c-label-group--m-category--PaddingRight: var(--pf-c-label-group--m-vertical--m-category--PaddingRight);
10949
+ .pf-c-list li + li {
10950
+ margin-top: var(--pf-c-list--li--MarginTop);
10834
10951
  }
10835
10952
 
10836
- .pf-c-label-group.pf-m-vertical.pf-c-label-group {
10837
- align-items: flex-start;
10953
+ ul.pf-c-list {
10954
+ list-style: var(--pf-c-list--ul--ListStyle);
10838
10955
  }
10839
10956
 
10840
- .pf-c-label-group.pf-m-vertical .pf-c-label-group__list {
10841
- flex-direction: column;
10842
- align-items: flex-start;
10957
+ .pf-c-list .pf-c-list__item {
10958
+ display: flex;
10843
10959
  }
10844
10960
 
10845
- .pf-c-label-group.pf-m-vertical .pf-c-label-group__main {
10846
- flex-direction: column;
10961
+ .pf-c-list .pf-c-list__item-icon {
10962
+ flex-shrink: 0;
10963
+ min-width: var(--pf-c-list__item-icon--MinWidth);
10964
+ margin-top: var(--pf-c-list__item-icon--MarginTop);
10965
+ margin-right: var(--pf-c-list__item-icon--MarginRight);
10966
+ font-size: var(--pf-c-list__item-icon--FontSize);
10967
+ line-height: 1;
10968
+ color: var(--pf-c-list__item-icon--Color);
10847
10969
  }
10848
10970
 
10849
- .pf-c-label-group.pf-m-vertical .pf-c-label-group__list-item:last-child {
10850
- --pf-c-label-group__list-item--MarginBottom: 0;
10971
+ .pf-c-list.pf-m-icon-lg {
10972
+ --pf-c-list__item-icon--MinWidth: var(--pf-c-list--m-icon-lg__item-icon--MinWidth);
10973
+ --pf-c-list__item-icon--MarginTop: 0;
10974
+ --pf-c-list__item-icon--MarginRight: var(--pf-c-list--m-icon-lg__item-icon--MarginRight);
10975
+ --pf-c-list__item-icon--FontSize: var(--pf-c-list--m-icon-lg__item-icon--FontSize);
10851
10976
  }
10852
10977
 
10853
- .pf-c-label-group.pf-m-vertical .pf-c-label-group__close .pf-c-button {
10854
- --pf-c-button--PaddingLeft: var(--pf-c-label-group--m-vertical__close--c-button--PaddingLeft);
10855
- --pf-c-button--PaddingRight: var(--pf-c-label-group--m-vertical__close--c-button--PaddingRight);
10856
- }
10857
-
10858
- .pf-c-label-group.pf-m-editable,
10859
- .pf-c-label-group.pf-m-editable .pf-c-label-group__main,
10860
- .pf-c-label-group.pf-m-editable .pf-c-label-group__list {
10861
- display: flex;
10862
- }
10863
-
10864
- .pf-c-label-group.pf-m-editable .pf-c-label-group__main,
10865
- .pf-c-label-group.pf-m-editable .pf-c-label-group__list,
10866
- .pf-c-label-group.pf-m-editable .pf-c-label-group__list-item.pf-m-textarea,
10867
- .pf-c-label-group.pf-m-editable .pf-c-label-group__textarea {
10868
- flex: 1;
10869
- }
10870
-
10871
- .pf-c-label-group__main {
10872
- display: flex;
10873
- flex: 1;
10874
- flex-wrap: wrap;
10875
- align-items: baseline;
10876
- }
10877
-
10878
- .pf-c-label-group__list {
10879
- display: inline-flex;
10880
- flex-wrap: wrap;
10881
- margin-right: var(--pf-c-label-group__list--MarginRight);
10882
- margin-bottom: var(--pf-c-label-group__list--MarginBottom);
10883
- }
10884
-
10885
- .pf-c-label-group__list-item {
10886
- display: inline-flex;
10887
- margin-right: var(--pf-c-label-group__list-item--MarginRight);
10888
- margin-bottom: var(--pf-c-label-group__list-item--MarginBottom);
10889
- }
10890
-
10891
- .pf-c-label-group__label {
10892
- overflow: hidden;
10893
- text-overflow: ellipsis;
10894
- white-space: nowrap;
10895
- max-width: var(--pf-c-label-group__label--MaxWidth);
10896
- margin-right: var(--pf-c-label-group__label--MarginRight);
10897
- margin-bottom: var(--pf-c-label-group__label--MarginBottom);
10898
- font-size: var(--pf-c-label-group__label--FontSize);
10899
- }
10900
-
10901
- .pf-c-label-group__close {
10902
- margin-top: var(--pf-c-label-group__close--MarginTop);
10903
- margin-right: var(--pf-c-label-group__close--MarginRight);
10904
- margin-bottom: var(--pf-c-label-group__close--MarginBottom);
10905
- margin-left: var(--pf-c-label-group__close--MarginLeft);
10906
- }
10907
-
10908
- .pf-c-label-group__textarea {
10909
- min-width: var(--pf-c-label-group__textarea--MinWidth);
10910
- padding: var(--pf-c-label-group__textarea--PaddingTop) var(--pf-c-label-group__textarea--PaddingRight) var(--pf-c-label-group__textarea--PaddingBottom) var(--pf-c-label-group__textarea--PaddingLeft);
10911
- white-space: nowrap;
10912
- resize: none;
10913
- border: 0;
10914
- -ms-overflow-style: none;
10915
- scrollbar-width: none;
10916
- }
10917
-
10918
- .pf-c-label-group__textarea::-webkit-scrollbar {
10919
- display: none;
10920
- }
10921
-
10922
- .pf-c-list {
10923
- --pf-c-list--PaddingLeft: var(--pf-global--spacer--lg);
10924
- --pf-c-list--nested--MarginTop: var(--pf-global--spacer--sm);
10925
- --pf-c-list--nested--MarginLeft: var(--pf-global--spacer--sm);
10926
- --pf-c-list--ul--ListStyle: var(--pf-global--ListStyle);
10927
- --pf-c-list--li--MarginTop: var(--pf-global--spacer--sm);
10928
- --pf-c-list--m-inline--li--MarginRight: var(--pf-global--spacer--lg);
10929
- --pf-c-list--m-bordered--li--PaddingBottom: var(--pf-global--spacer--sm);
10930
- --pf-c-list--m-bordered--li--BorderBottomColor: var(--pf-global--BorderColor--100);
10931
- --pf-c-list--m-bordered--li--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
10932
- --pf-c-list__item-icon--MinWidth: var(--pf-global--icon--FontSize--sm);
10933
- --pf-c-list__item-icon--MarginTop: 0.375rem;
10934
- --pf-c-list__item-icon--MarginRight: var(--pf-global--spacer--sm);
10935
- --pf-c-list__item-icon--Color: var(--pf-global--icon--Color--light);
10936
- --pf-c-list__item-icon--FontSize: var(--pf-global--icon--FontSize--sm);
10937
- --pf-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-global--icon--FontSize--lg);
10938
- --pf-c-list--m-icon-lg__item-icon--MarginRight: var(--pf-global--spacer--md);
10939
- --pf-c-list--m-icon-lg__item-icon--FontSize: var(--pf-global--icon--FontSize--lg);
10940
- padding-left: var(--pf-c-list--PaddingLeft);
10941
- }
10942
-
10943
- .pf-c-list ol,
10944
- .pf-c-list ul {
10945
- margin-top: var(--pf-c-list--nested--MarginTop);
10946
- margin-left: var(--pf-c-list--nested--MarginLeft);
10947
- }
10948
-
10949
- .pf-c-list li + li {
10950
- margin-top: var(--pf-c-list--li--MarginTop);
10951
- }
10952
-
10953
- ul.pf-c-list {
10954
- list-style: var(--pf-c-list--ul--ListStyle);
10955
- }
10956
-
10957
- .pf-c-list .pf-c-list__item {
10958
- display: flex;
10959
- }
10960
-
10961
- .pf-c-list .pf-c-list__item-icon {
10962
- flex-shrink: 0;
10963
- min-width: var(--pf-c-list__item-icon--MinWidth);
10964
- margin-top: var(--pf-c-list__item-icon--MarginTop);
10965
- margin-right: var(--pf-c-list__item-icon--MarginRight);
10966
- font-size: var(--pf-c-list__item-icon--FontSize);
10967
- line-height: 1;
10968
- color: var(--pf-c-list__item-icon--Color);
10969
- }
10970
-
10971
- .pf-c-list.pf-m-icon-lg {
10972
- --pf-c-list__item-icon--MinWidth: var(--pf-c-list--m-icon-lg__item-icon--MinWidth);
10973
- --pf-c-list__item-icon--MarginTop: 0;
10974
- --pf-c-list__item-icon--MarginRight: var(--pf-c-list--m-icon-lg__item-icon--MarginRight);
10975
- --pf-c-list__item-icon--FontSize: var(--pf-c-list--m-icon-lg__item-icon--FontSize);
10976
- }
10977
-
10978
- .pf-c-list.pf-m-plain {
10979
- --pf-c-list--PaddingLeft: 0;
10980
- list-style: none;
10978
+ .pf-c-list.pf-m-plain {
10979
+ --pf-c-list--PaddingLeft: 0;
10980
+ list-style: none;
10981
10981
  }
10982
10982
 
10983
10983
  .pf-c-list.pf-m-inline {
@@ -11005,17 +11005,7 @@ ul.pf-c-list {
11005
11005
  --pf-c-list--m-bordered--li--BorderBottomWidth: 0;
11006
11006
  }
11007
11007
 
11008
- .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light {
11009
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
11010
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
11011
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
11012
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
11013
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
11014
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
11015
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
11016
- }
11017
-
11018
- .pf-c-masthead .pf-c-button.pf-m-plain, .pf-c-masthead {
11008
+ .pf-c-login__footer, .pf-c-login__header {
11019
11009
  --pf-global--Color--100: var(--pf-global--Color--light-100);
11020
11010
  --pf-global--Color--200: var(--pf-global--Color--light-200);
11021
11011
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
@@ -11025,11 +11015,11 @@ ul.pf-c-list {
11025
11015
  --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
11026
11016
  }
11027
11017
 
11028
- .pf-c-masthead .pf-c-button.pf-m-plain .pf-c-card, .pf-c-masthead .pf-c-card {
11018
+ .pf-c-login__footer .pf-c-card, .pf-c-login__header .pf-c-card {
11029
11019
  --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
11030
11020
  }
11031
11021
 
11032
- .pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button, .pf-c-masthead .pf-c-button {
11022
+ .pf-c-login__footer .pf-c-button, .pf-c-login__header .pf-c-button {
11033
11023
  --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
11034
11024
  --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
11035
11025
  --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
@@ -11048,289 +11038,441 @@ ul.pf-c-list {
11048
11038
  --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
11049
11039
  }
11050
11040
 
11051
- .pf-c-masthead {
11052
- --pf-c-masthead--PaddingLeft: var(--pf-c-masthead--inset);
11053
- --pf-c-masthead--PaddingRight: var(--pf-c-masthead--inset);
11054
- --pf-c-masthead--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
11055
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
11056
- --pf-c-masthead--xl--inset: var(--pf-global--spacer--lg);
11057
- --pf-c-masthead--m-display-stack--GridTemplateColumns: max-content 1fr;
11058
- --pf-c-masthead--m-display-stack__main--GridColumn: -1 / 1;
11059
- --pf-c-masthead--m-display-stack__main--MinHeight: 4.375rem;
11060
- --pf-c-masthead--m-display-stack__main--Order: -1;
11061
- --pf-c-masthead--m-display-stack__main--FlexBasis: 100%;
11062
- --pf-c-masthead--m-display-stack__main--PaddingTop: var(--pf-global--spacer--sm);
11063
- --pf-c-masthead--m-display-stack__main--PaddingBottom: var(--pf-global--spacer--sm);
11064
- --pf-c-masthead--m-display-stack__main--MarginRight: 0;
11065
- --pf-c-masthead--m-display-stack__main--before--BorderBottom: var(--pf-c-masthead__main--before--BorderBottomWidth) solid var(--pf-c-masthead__main--before--BorderBottomColor);
11066
- --pf-c-masthead--m-display-stack__toggle--GridColumn: 1;
11067
- --pf-c-masthead--m-display-stack__content--GridColumn: 2;
11068
- --pf-c-masthead--m-display-stack__content--MinHeight: auto;
11069
- --pf-c-masthead--m-display-stack__content--Order: 1;
11070
- --pf-c-masthead--m-display-stack__content--PaddingTop: 0;
11071
- --pf-c-masthead--m-display-stack__content--PaddingBottom: 0;
11072
- --pf-c-masthead--m-display-stack__content--MarginLeft: 0;
11073
- --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight: calc(var(--pf-c-masthead--inset) * -1);
11074
- --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-c-masthead--inset) * -1);
11075
- --pf-c-masthead--m-display-inline--GridTemplateColumns: max-content max-content 1fr;
11076
- --pf-c-masthead--m-display-inline__main--GridColumn: 2;
11077
- --pf-c-masthead--m-display-inline__main--MinHeight: 4.375rem;
11078
- --pf-c-masthead--m-display-inline__main--Order: 0;
11079
- --pf-c-masthead--m-display-inline__main--FlexBasis: auto;
11080
- --pf-c-masthead--m-display-inline__main--PaddingTop: 0;
11081
- --pf-c-masthead--m-display-inline__main--PaddingBottom: 0;
11082
- --pf-c-masthead--m-display-inline__main--MarginRight: calc(var(--pf-global--spacer--lg) / 2);
11083
- --pf-c-masthead--m-display-inline__main--BorderBottom: 0;
11084
- --pf-c-masthead--m-display-inline__toggle--GridColumn: 1;
11085
- --pf-c-masthead--m-display-inline__content--GridColumn: 3;
11086
- --pf-c-masthead--m-display-inline__content--MinHeight: 4.375rem;
11087
- --pf-c-masthead--m-display-inline__content--Order: 0;
11088
- --pf-c-masthead--m-display-inline__content--PaddingTop: 0;
11089
- --pf-c-masthead--m-display-inline__content--PaddingBottom: 0;
11090
- --pf-c-masthead--m-display-inline__content--MarginLeft: calc(var(--pf-global--spacer--lg) / 2);
11091
- --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight: 0;
11092
- --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft: 0;
11093
- --pf-c-masthead__main--before--Right: calc(var(--pf-c-masthead--inset) * -1);
11094
- --pf-c-masthead__main--before--Left: calc(var(--pf-c-masthead--inset) * -1);
11095
- --pf-c-masthead__main--before--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
11096
- --pf-c-masthead__main--before--BorderBottomColor: var(--pf-global--palette--black-600);
11097
- --pf-c-masthead__toggle--MarginRight: var(--pf-global--spacer--sm);
11098
- --pf-c-masthead__toggle--MarginLeft: calc(var(--pf-global--spacer--md) * -1);
11099
- --pf-c-masthead__toggle--c-button--FontSize: var(--pf-global--FontSize--2xl);
11100
- --pf-c-masthead--m-light--BackgroundColor: var(--pf-global--BackgroundColor--100);
11101
- --pf-c-masthead--m-light__main--BorderBottomColor: var(--pf-global--BorderColor--300);
11102
- --pf-c-masthead--m-light-200--BackgroundColor: var(--pf-global--BackgroundColor--200);
11103
- --pf-c-masthead--m-light-200__main--BorderBottomColor: var(--pf-global--BorderColor--100);
11104
- --pf-c-masthead--c-toolbar__item--Display: flex;
11105
- --pf-c-masthead--item-border-color--base: var(--pf-global--palette--black-800);
11106
- --pf-c-masthead--c-context-selector--Width: auto;
11107
- --pf-c-masthead--c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
11108
- --pf-c-masthead--c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
11109
- --pf-c-masthead--c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
11110
- --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor: transparent;
11111
- --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor: transparent;
11112
- --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
11113
- --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
11114
- --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
11115
- --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor: transparent;
11116
- --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor: transparent;
11117
- --pf-c-masthead--c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
11118
- --pf-c-masthead--c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
11119
- --pf-c-masthead--c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
11120
- --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor: transparent;
11121
- --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor: transparent;
11122
- --pf-c-masthead--c-toolbar__content--PaddingRight: 0;
11123
- --pf-c-masthead--c-toolbar__content--PaddingLeft: 0;
11124
- --pf-c-masthead--c-toolbar__expandable-content--PaddingTop: var(--pf-global--spacer--md);
11125
- --pf-c-masthead--c-toolbar__expandable-content--PaddingRight: var(--pf-c-masthead--inset);
11126
- --pf-c-masthead--c-toolbar__expandable-content--PaddingBottom: var(--pf-global--spacer--md);
11127
- --pf-c-masthead--c-toolbar__expandable-content--PaddingLeft: var(--pf-c-masthead--inset);
11128
- --pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth: var(--pf-global--BorderWidth--sm);
11129
- --pf-c-masthead--c-toolbar__expandable-content--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
11130
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
11131
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
11132
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
11133
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
11134
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
11135
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
11136
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
11137
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
11138
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
11139
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
11140
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
11141
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
11142
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
11143
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
11144
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
11145
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
11146
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
11147
- color: var(--pf-global--Color--100);
11148
- position: relative;
11149
- display: grid;
11150
- grid-template-columns: var(--pf-c-masthead--GridTemplateColumns);
11151
- align-items: center;
11152
- min-width: 0;
11153
- padding-right: var(--pf-c-masthead--PaddingRight);
11154
- padding-left: var(--pf-c-masthead--PaddingLeft);
11155
- background-color: var(--pf-c-masthead--BackgroundColor);
11156
- }
11157
-
11158
- @media screen and (min-width: 768px) {
11159
- .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
11160
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
11161
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
11162
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
11163
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
11164
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
11165
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
11166
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
11167
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
11168
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
11169
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
11170
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
11171
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
11172
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
11173
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
11174
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
11175
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
11176
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
11041
+ .pf-c-login {
11042
+ --pf-c-login--PaddingTop: var(--pf-global--spacer--lg);
11043
+ --pf-c-login--PaddingBottom: var(--pf-global--spacer--lg);
11044
+ --pf-c-login--xl--BackgroundImage: none;
11045
+ --pf-c-login__container--xl--GridColumnGap: var(--pf-global--spacer--3xl);
11046
+ --pf-c-login__container--MaxWidth: 31.25rem;
11047
+ --pf-c-login__container--xl--MaxWidth: none;
11048
+ --pf-c-login__container--PaddingLeft: 6.125rem;
11049
+ --pf-c-login__container--PaddingRight: 6.125rem;
11050
+ --pf-c-login__container--xl--GridTemplateColumns: 34rem minmax(auto, 34rem);
11051
+ --pf-c-login__header--MarginBottom: var(--pf-global--spacer--md);
11052
+ --pf-c-login__header--PaddingLeft: var(--pf-global--spacer--md);
11053
+ --pf-c-login__header--PaddingRight: var(--pf-global--spacer--md);
11054
+ --pf-c-login__header--xl--MarginBottom: var(--pf-global--spacer--2xl);
11055
+ --pf-c-login__header--xl--MarginTop: var(--pf-global--spacer--3xl);
11056
+ --pf-c-login__header--c-brand--MarginBottom: var(--pf-global--spacer--lg);
11057
+ --pf-c-login__header--c-brand--xl--MarginBottom: var(--pf-global--spacer--2xl);
11058
+ --pf-c-login__main--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
11059
+ --pf-c-login__main--MarginBottom: var(--pf-global--spacer--lg);
11060
+ --pf-c-login__main-header--PaddingTop: var(--pf-global--spacer--2xl);
11061
+ --pf-c-login__main-header--PaddingRight: var(--pf-global--spacer--xl);
11062
+ --pf-c-login__main-header--PaddingBottom: var(--pf-global--spacer--md);
11063
+ --pf-c-login__main-header--PaddingLeft: var(--pf-global--spacer--xl);
11064
+ --pf-c-login__main-header--md--PaddingRight: var(--pf-global--spacer--2xl);
11065
+ --pf-c-login__main-header--md--PaddingLeft: var(--pf-global--spacer--2xl);
11066
+ --pf-c-login__main-header--ColumnGap: var(--pf-global--spacer--md);
11067
+ --pf-c-login__main-header--RowGap: var(--pf-global--spacer--md);
11068
+ --pf-c-login__main-header-desc--MarginBottom: var(--pf-global--spacer--sm);
11069
+ --pf-c-login__main-header-desc--md--MarginBottom: 0;
11070
+ --pf-c-login__main-header-desc--FontSize: var(--pf-global--FontSize--sm);
11071
+ --pf-c-login__main-body--PaddingRight: var(--pf-global--spacer--xl);
11072
+ --pf-c-login__main-body--PaddingBottom: var(--pf-global--spacer--xl);
11073
+ --pf-c-login__main-body--PaddingLeft: var(--pf-global--spacer--xl);
11074
+ --pf-c-login__main-body--md--PaddingRight: var(--pf-global--spacer--2xl);
11075
+ --pf-c-login__main-body--md--PaddingLeft: var(--pf-global--spacer--2xl);
11076
+ --pf-c-login__main-footer--PaddingBottom: var(--pf-global--spacer--3xl);
11077
+ --pf-c-login__main-footer--c-title--MarginBottom: var(--pf-global--spacer--md);
11078
+ --pf-c-login__main-footer-links--PaddingTop: var(--pf-global--spacer--sm);
11079
+ --pf-c-login__main-footer-links--PaddingRight: var(--pf-global--spacer--3xl);
11080
+ --pf-c-login__main-footer-links--PaddingBottom: var(--pf-global--spacer--xl);
11081
+ --pf-c-login__main-footer-links--PaddingLeft: var(--pf-global--spacer--3xl);
11082
+ --pf-c-login__main-footer-links-item--PaddingRight: var(--pf-global--spacer--md);
11083
+ --pf-c-login__main-footer-links-item--PaddingLeft: var(--pf-global--spacer--md);
11084
+ --pf-c-login__main-footer-links-item--MarginBottom: var(--pf-global--spacer--sm);
11085
+ --pf-c-login__main-footer-links-item-link-svg--Fill: var(--pf-global--icon--Color--light);
11086
+ --pf-c-login__main-footer-links-item-link-svg--Width: var(--pf-global--icon--FontSize--lg);
11087
+ --pf-c-login__main-footer-links-item-link-svg--Height: var(--pf-global--icon--FontSize--lg);
11088
+ --pf-c-login__main-footer-links-item-link-svg--hover--Fill: var(--pf-global--icon--Color--dark);
11089
+ --pf-c-login__main-footer-band--PaddingTop: var(--pf-global--spacer--lg);
11090
+ --pf-c-login__main-footer-band--PaddingRight: var(--pf-global--spacer--md);
11091
+ --pf-c-login__main-footer-band--PaddingBottom: var(--pf-global--spacer--lg);
11092
+ --pf-c-login__main-footer-band--PaddingLeft: var(--pf-global--spacer--md);
11093
+ --pf-c-login__main-footer-band--BackgroundColor: var(--pf-global--BackgroundColor--200);
11094
+ --pf-c-login__main-footer-band-item--PaddingTop: var(--pf-global--spacer--md);
11095
+ --pf-c-login__footer--PaddingLeft: var(--pf-global--spacer--md);
11096
+ --pf-c-login__footer--PaddingRight: var(--pf-global--spacer--md);
11097
+ --pf-c-login__footer--c-list--PaddingTop: var(--pf-global--spacer--md);
11098
+ --pf-c-login__footer--c-list--xl--PaddingTop: var(--pf-global--spacer--2xl);
11099
+ display: flex;
11100
+ justify-content: center;
11101
+ min-height: 100vh;
11102
+ padding-top: var(--pf-c-login--PaddingTop);
11103
+ padding-bottom: var(--pf-c-login--PaddingBottom);
11104
+ }
11105
+
11106
+ @media (min-width: 1200px) {
11107
+ .pf-c-login {
11108
+ --pf-c-login__container--MaxWidth: var(--pf-c-login__container--xl--MaxWidth);
11177
11109
  }
11178
11110
  }
11179
- @media screen and (min-width: 1200px) {
11180
- .pf-c-masthead {
11181
- --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
11111
+ @media (min-width: 576px) {
11112
+ .pf-c-login {
11113
+ --pf-c-login__header--PaddingRight: 0;
11114
+ --pf-c-login__header--PaddingLeft: 0;
11182
11115
  }
11183
11116
  }
11184
- .pf-c-masthead.pf-m-light {
11185
- color: var(--pf-global--Color--100);
11186
- --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light--BackgroundColor);
11187
- --pf-c-masthead__main--BorderBottomColor: var(--pf-c-masthead--m-light__main--BorderBottomColor);
11117
+ @media (min-width: 1200px) {
11118
+ .pf-c-login {
11119
+ --pf-c-login__header--MarginBottom: var(--pf-c-login__header--xl--MarginBottom);
11120
+ --pf-c-login__header--c-brand--MarginBottom: var(--pf-c-login__header--c-brand--xl--MarginBottom);
11121
+ }
11188
11122
  }
11189
-
11190
- .pf-c-masthead.pf-m-light-200 {
11191
- color: var(--pf-global--Color--100);
11192
- --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light-200--BackgroundColor);
11193
- --pf-c-masthead__main--BorderBottomColor: var(--pf-c-masthead--m-light-200__main--BorderBottomColor);
11123
+ @media (min-width: 1200px) {
11124
+ .pf-c-login {
11125
+ --pf-c-login__main--MarginBottom: 0;
11126
+ }
11194
11127
  }
11195
-
11196
- .pf-c-masthead .pf-c-toolbar {
11197
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-masthead--c-toolbar__content--PaddingRight);
11198
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-masthead--c-toolbar__content--PaddingLeft);
11199
- --pf-c-toolbar__expandable-content--PaddingTop: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingTop);
11200
- --pf-c-toolbar__expandable-content--PaddingRight: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingRight);
11201
- --pf-c-toolbar__expandable-content--PaddingBottom: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingBottom);
11202
- --pf-c-toolbar__expandable-content--PaddingLeft: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingLeft);
11128
+ @media (min-width: 768px) {
11129
+ .pf-c-login {
11130
+ --pf-c-login__main-header--PaddingRight: var(--pf-c-login__main-header--md--PaddingRight);
11131
+ --pf-c-login__main-header--PaddingLeft: var(--pf-c-login__main-header--md--PaddingLeft);
11132
+ --pf-c-login__main-header-desc--MarginBottom: var(--pf-c-login__main-header-desc--md--MarginBottom);
11133
+ }
11134
+ }
11135
+ @media (min-width: 768px) {
11136
+ .pf-c-login {
11137
+ --pf-c-login__main-body--PaddingRight: var(--pf-c-login__main-body--md--PaddingRight);
11138
+ --pf-c-login__main-body--PaddingLeft: var(--pf-c-login__main-body--md--PaddingLeft);
11139
+ }
11140
+ }
11141
+ @media (min-width: 576px) {
11142
+ .pf-c-login {
11143
+ --pf-c-login__footer--PaddingRight: 0;
11144
+ --pf-c-login__footer--PaddingLeft: 0;
11145
+ }
11146
+ }
11147
+ @media (min-width: 1200px) {
11148
+ .pf-c-login {
11149
+ --pf-c-login__footer--c-list--PaddingTop: var(--pf-c-login__footer--c-list--xl--PaddingTop);
11150
+ }
11151
+ }
11152
+ @media (min-width: 1200px) {
11153
+ .pf-c-login {
11154
+ background-image: var(--pf-c-login--xl--BackgroundImage);
11155
+ }
11156
+ }
11157
+ @media (min-width: 576px) {
11158
+ .pf-c-login {
11159
+ align-items: center;
11160
+ }
11161
+ }
11162
+ .pf-c-login__container {
11203
11163
  width: 100%;
11164
+ max-width: var(--pf-c-login__container--MaxWidth);
11204
11165
  }
11205
11166
 
11206
- .pf-c-masthead .pf-c-toolbar__content-section {
11207
- flex-wrap: nowrap;
11167
+ @media (min-width: 1200px) {
11168
+ .pf-c-login__container {
11169
+ display: grid;
11170
+ justify-content: center;
11171
+ grid-column-gap: var(--pf-c-login__container--xl--GridColumnGap);
11172
+ grid-template-columns: var(--pf-c-login__container--xl--GridTemplateColumns);
11173
+ grid-template-areas: "main header" "main footer" "main .";
11174
+ padding-right: var(--pf-c-login__container--PaddingRight);
11175
+ padding-left: var(--pf-c-login__container--PaddingLeft);
11176
+ }
11177
+ }
11178
+ .pf-c-login__header {
11179
+ color: var(--pf-global--Color--100);
11180
+ grid-area: header;
11181
+ padding-right: var(--pf-c-login__header--PaddingRight);
11182
+ padding-left: var(--pf-c-login__header--PaddingLeft);
11208
11183
  }
11209
11184
 
11210
- .pf-c-masthead .pf-c-toolbar__expandable-content {
11211
- border-top: var(--pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth) solid var(--pf-c-masthead--c-toolbar__expandable-content--BorderTopColor);
11185
+ @media (min-width: 1200px) {
11186
+ .pf-c-login__header {
11187
+ margin-top: var(--pf-c-login__header--xl--MarginTop);
11188
+ }
11189
+ }
11190
+ .pf-c-login__header .pf-c-brand {
11191
+ margin-bottom: var(--pf-c-login__header--c-brand--MarginBottom);
11212
11192
  }
11213
11193
 
11214
- .pf-c-masthead .pf-c-menu-toggle {
11215
- --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--before--BorderTopColor);
11216
- --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--before--BorderRightColor);
11217
- --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--before--BorderLeftColor);
11194
+ .pf-c-login__main {
11195
+ align-self: start;
11196
+ margin-bottom: var(--pf-c-login__main--MarginBottom);
11197
+ background-color: var(--pf-c-login__main--BackgroundColor);
11198
+ grid-area: main;
11218
11199
  }
11219
11200
 
11220
- .pf-c-masthead .pf-c-menu-toggle.pf-m-full-height {
11221
- --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor);
11222
- --pf-c-menu-toggle--before--BorderBottomColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor);
11201
+ .pf-c-login__main > :first-child:not(.pf-c-login__main-header) {
11202
+ padding-top: var(--pf-c-login__main-header--PaddingTop);
11223
11203
  }
11224
11204
 
11225
- .pf-c-masthead .pf-c-context-selector {
11226
- --pf-c-context-selector--Width: var(--pf-c-masthead--c-context-selector--Width);
11227
- --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector__toggle--BorderTopColor);
11228
- --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector__toggle--BorderRightColor);
11229
- --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector__toggle--BorderLeftColor);
11205
+ .pf-c-login__main > :last-child:not(.pf-c-login__main-footer) {
11206
+ padding-bottom: var(--pf-c-login__main-footer--PaddingBottom);
11230
11207
  }
11231
11208
 
11232
- .pf-c-masthead .pf-c-context-selector.pf-m-full-height {
11233
- --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor);
11234
- --pf-c-context-selector__toggle--BorderBottomColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor);
11209
+ .pf-c-login__main-header {
11210
+ display: grid;
11211
+ grid-template-columns: 100%;
11212
+ column-gap: var(--pf-c-login__main-header--ColumnGap);
11213
+ row-gap: var(--pf-c-login__main-header--RowGap);
11214
+ align-items: center;
11215
+ padding: var(--pf-c-login__main-header--PaddingTop) var(--pf-c-login__main-header--PaddingRight) var(--pf-c-login__main-header--PaddingBottom) var(--pf-c-login__main-header--PaddingLeft);
11235
11216
  }
11236
11217
 
11237
- .pf-c-masthead .pf-c-dropdown {
11238
- --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderTopColor);
11239
- --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderRightColor);
11240
- --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor);
11218
+ @media (min-width: 768px) {
11219
+ .pf-c-login__main-header {
11220
+ grid-template-columns: 1fr auto;
11221
+ }
11222
+ }
11223
+ .pf-c-login__main-header-utilities,
11224
+ .pf-c-login__main-header .pf-c-dropdown {
11225
+ grid-column: auto;
11226
+ grid-row: auto;
11241
11227
  }
11242
11228
 
11243
- .pf-c-masthead .pf-c-dropdown.pf-m-full-height {
11244
- --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor);
11245
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor);
11229
+ @media (min-width: 768px) {
11230
+ .pf-c-login__main-header-utilities,
11231
+ .pf-c-login__main-header .pf-c-dropdown {
11232
+ grid-column: 2/3;
11233
+ grid-row: 1;
11234
+ }
11235
+ }
11236
+ .pf-c-login__main-header-utilities .pf-c-dropdown {
11237
+ grid-column: auto;
11238
+ grid-row: auto;
11246
11239
  }
11247
11240
 
11248
- .pf-c-masthead .pf-c-nav {
11249
- align-self: stretch;
11241
+ .pf-c-login__main-header-desc {
11242
+ margin-bottom: var(--pf-c-login__main-header-desc--MarginBottom);
11243
+ font-size: var(--pf-c-login__main-header-desc--FontSize);
11244
+ grid-column: 1/-1;
11250
11245
  }
11251
11246
 
11252
- .pf-c-masthead .pf-c-button.pf-m-plain {
11253
- color: var(--pf-c-button--m-plain--Color);
11247
+ .pf-c-login__main-body {
11248
+ padding-right: var(--pf-c-login__main-body--PaddingRight);
11249
+ padding-bottom: var(--pf-c-login__main-body--PaddingBottom);
11250
+ padding-left: var(--pf-c-login__main-body--PaddingLeft);
11254
11251
  }
11255
11252
 
11256
- .pf-c-masthead__main {
11257
- position: relative;
11253
+ .pf-c-login__main-footer {
11258
11254
  display: flex;
11259
- flex-basis: var(--pf-c-masthead__main--FlexBasis);
11260
- align-items: center;
11261
- align-self: stretch;
11262
- order: var(--pf-c-masthead__main--Order);
11263
- min-height: var(--pf-c-masthead__main--MinHeight);
11264
- padding-top: var(--pf-c-masthead__main--PaddingTop);
11265
- padding-bottom: var(--pf-c-masthead__main--PaddingBottom);
11266
- margin-right: var(--pf-c-masthead__main--MarginRight);
11267
- grid-column: var(--pf-c-masthead__main--GridColumn);
11255
+ flex-wrap: wrap;
11268
11256
  }
11269
11257
 
11270
- .pf-c-masthead__main::before {
11271
- position: absolute;
11272
- right: var(--pf-c-masthead__main--before--Right);
11273
- bottom: 0;
11274
- left: var(--pf-c-masthead__main--before--Left);
11275
- content: "";
11276
- border-bottom: var(--pf-c-masthead__main--before--BorderBottom);
11258
+ .pf-c-login__main-footer .pf-c-title {
11259
+ margin-bottom: var(--pf-c-login__main-footer--c-title--MarginBottom);
11260
+ text-align: center;
11277
11261
  }
11278
11262
 
11279
- .pf-c-masthead__main:last-child {
11280
- --pf-c-masthead__main--MarginRight: 0;
11263
+ .pf-c-login__main-footer > * {
11264
+ flex-basis: 100%;
11281
11265
  }
11282
11266
 
11283
- .pf-c-masthead__content {
11267
+ .pf-c-login__main-footer-links {
11284
11268
  display: flex;
11285
- flex-grow: 1;
11286
- align-items: center;
11287
- align-self: stretch;
11288
- order: var(--pf-c-masthead__content--Order);
11289
- min-height: var(--pf-c-masthead__content--MinHeight);
11290
- padding-top: var(--pf-c-masthead__content--PaddingTop);
11291
- padding-bottom: var(--pf-c-masthead__content--PaddingBottom);
11292
- margin-left: var(--pf-c-masthead__content--MarginLeft);
11293
- grid-column: var(--pf-c-masthead__content--GridColumn);
11294
- grid-column-end: -1;
11295
- flex-shrink: 1;
11269
+ flex-wrap: wrap;
11270
+ justify-content: center;
11271
+ padding: var(--pf-c-login__main-footer-links--PaddingTop) var(--pf-c-login__main-footer-links--PaddingRight) var(--pf-c-login__main-footer-links--PaddingBottom) var(--pf-c-login__main-footer-links--PaddingLeft);
11296
11272
  }
11297
11273
 
11298
- .pf-c-masthead__content:only-child {
11299
- --pf-c-masthead__content--MarginLeft: 0;
11274
+ .pf-c-login__main-footer-links-item {
11275
+ padding-right: var(--pf-c-login__main-footer-links-item--PaddingRight);
11276
+ padding-left: var(--pf-c-login__main-footer-links-item--PaddingLeft);
11277
+ margin-bottom: var(--pf-c-login__main-footer-links-item--MarginBottom);
11300
11278
  }
11301
11279
 
11302
- .pf-c-masthead__content .pf-c-nav.pf-m-horizontal {
11303
- margin-right: var(--pf-c-masthead__content--c-nav--m-horizontal--MarginRight);
11304
- margin-left: var(--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft);
11280
+ .pf-c-login__main-footer-links-item-link svg {
11281
+ fill: var(--pf-c-login__main-footer-links-item-link-svg--Fill);
11282
+ width: 100%;
11283
+ max-width: var(--pf-c-login__main-footer-links-item-link-svg--Width);
11284
+ height: 100%;
11285
+ max-height: var(--pf-c-login__main-footer-links-item-link-svg--Height);
11305
11286
  }
11306
11287
 
11307
- .pf-c-masthead__toggle ~ .pf-c-masthead__content {
11308
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-c-masthead__content--MarginLeft) * -1);
11288
+ .pf-c-login__main-footer-links-item-link:hover svg {
11289
+ fill: var(--pf-c-login__main-footer-links-item-link-svg--hover--Fill);
11309
11290
  }
11310
11291
 
11311
- .pf-c-masthead__main,
11312
- .pf-c-masthead__brand,
11313
- .pf-c-masthead__content {
11314
- min-width: 0;
11292
+ .pf-c-login__main-footer-band {
11293
+ padding: var(--pf-c-login__main-footer-band--PaddingTop) var(--pf-c-login__main-footer-band--PaddingRight) var(--pf-c-login__main-footer-band--PaddingBottom) var(--pf-c-login__main-footer-band--PaddingLeft);
11294
+ text-align: center;
11295
+ background-color: var(--pf-c-login__main-footer-band--BackgroundColor);
11315
11296
  }
11316
11297
 
11317
- .pf-c-masthead__brand {
11318
- display: inline-flex;
11319
- align-self: center;
11298
+ .pf-c-login__main-footer-band > * + * {
11299
+ padding-top: var(--pf-c-login__main-footer-band-item--PaddingTop);
11320
11300
  }
11321
11301
 
11322
- .pf-c-masthead__toggle {
11323
- grid-column: var(--pf-c-masthead__toggle--GridColumn);
11324
- align-self: center;
11325
- margin-right: var(--pf-c-masthead__toggle--MarginRight);
11326
- margin-left: var(--pf-c-masthead__toggle--MarginLeft);
11302
+ .pf-c-login__footer {
11303
+ color: var(--pf-global--Color--100);
11304
+ grid-area: footer;
11305
+ padding-right: var(--pf-c-login__footer--PaddingRight);
11306
+ padding-left: var(--pf-c-login__footer--PaddingLeft);
11327
11307
  }
11328
11308
 
11329
- .pf-c-masthead__toggle .pf-c-button {
11330
- --pf-c-button--FontSize: var(--pf-c-masthead__toggle--c-button--FontSize);
11309
+ .pf-c-login__footer .pf-c-list a {
11310
+ color: unset;
11331
11311
  }
11332
11312
 
11333
- .pf-c-masthead.pf-m-display-stack {
11313
+ .pf-c-login__footer .pf-c-list:not(:only-child) {
11314
+ padding-top: var(--pf-c-login__footer--c-list--PaddingTop);
11315
+ }
11316
+
11317
+ :where(.pf-theme-dark) .pf-c-login__header,
11318
+ :where(.pf-theme-dark) .pf-c-login__footer {
11319
+ --pf-global--Color--100: #e0e0e0;
11320
+ --pf-global--Color--200: #aaabac;
11321
+ --pf-global--BorderColor--100: #444548;
11322
+ --pf-global--primary-color--100: #1fa7f8;
11323
+ --pf-global--link--Color: #1fa7f8;
11324
+ --pf-global--link--Color--hover: #73bcf7;
11325
+ --pf-global--BackgroundColor--100: #1b1d21;
11326
+ }
11327
+
11328
+ :where(.pf-theme-dark) .pf-c-login__header .pf-c-card,
11329
+ :where(.pf-theme-dark) .pf-c-login__footer .pf-c-card {
11330
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
11331
+ }
11332
+
11333
+ :where(.pf-theme-dark) .pf-c-login__header .pf-c-button,
11334
+ :where(.pf-theme-dark) .pf-c-login__footer .pf-c-button {
11335
+ --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
11336
+ --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
11337
+ --pf-c-button--m-primary--focus--Color: var(--pf-global--Color--light-100);
11338
+ --pf-c-button--m-primary--active--Color: var(--pf-global--Color--light-100);
11339
+ --pf-c-button--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
11340
+ --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--primary-color--200);
11341
+ --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--primary-color--200);
11342
+ --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
11343
+ --pf-c-button--m-secondary--Color: var(--pf-global--primary-color--100);
11344
+ --pf-c-button--m-secondary--hover--Color: var(--pf-global--primary-color--100);
11345
+ --pf-c-button--m-secondary--focus--Color: var(--pf-global--primary-color--100);
11346
+ --pf-c-button--m-secondary--active--Color: var(--pf-global--primary-color--100);
11347
+ }
11348
+
11349
+ :where(.pf-theme-dark) .pf-c-login__header,
11350
+ :where(.pf-theme-dark) .pf-c-login__footer {
11351
+ color: var(--pf-global--Color--100);
11352
+ }
11353
+
11354
+ .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light {
11355
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
11356
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
11357
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
11358
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
11359
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
11360
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
11361
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
11362
+ }
11363
+
11364
+ .pf-c-masthead .pf-c-button.pf-m-plain, .pf-c-masthead {
11365
+ --pf-global--Color--100: var(--pf-global--Color--light-100);
11366
+ --pf-global--Color--200: var(--pf-global--Color--light-200);
11367
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
11368
+ --pf-global--primary-color--100: var(--pf-global--primary-color--light-100);
11369
+ --pf-global--link--Color: var(--pf-global--link--Color--light);
11370
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
11371
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
11372
+ }
11373
+
11374
+ .pf-c-masthead .pf-c-button.pf-m-plain .pf-c-card, .pf-c-masthead .pf-c-card {
11375
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
11376
+ }
11377
+
11378
+ .pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button, .pf-c-masthead .pf-c-button {
11379
+ --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
11380
+ --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
11381
+ --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
11382
+ --pf-c-button--m-primary--active--Color: var(--pf-global--primary-color--dark-100);
11383
+ --pf-c-button--m-primary--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
11384
+ --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
11385
+ --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
11386
+ --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
11387
+ --pf-c-button--m-secondary--Color: var(--pf-global--Color--light-100);
11388
+ --pf-c-button--m-secondary--hover--Color: var(--pf-global--Color--light-100);
11389
+ --pf-c-button--m-secondary--focus--Color: var(--pf-global--Color--light-100);
11390
+ --pf-c-button--m-secondary--active--Color: var(--pf-global--Color--light-100);
11391
+ --pf-c-button--m-secondary--BorderColor: var(--pf-global--Color--light-100);
11392
+ --pf-c-button--m-secondary--hover--BorderColor: var(--pf-global--Color--light-100);
11393
+ --pf-c-button--m-secondary--focus--BorderColor: var(--pf-global--Color--light-100);
11394
+ --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
11395
+ }
11396
+
11397
+ .pf-c-masthead {
11398
+ --pf-c-masthead--PaddingLeft: var(--pf-c-masthead--inset);
11399
+ --pf-c-masthead--PaddingRight: var(--pf-c-masthead--inset);
11400
+ --pf-c-masthead--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
11401
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
11402
+ --pf-c-masthead--xl--inset: var(--pf-global--spacer--lg);
11403
+ --pf-c-masthead--m-display-stack--GridTemplateColumns: max-content 1fr;
11404
+ --pf-c-masthead--m-display-stack__main--GridColumn: -1 / 1;
11405
+ --pf-c-masthead--m-display-stack__main--MinHeight: 4.375rem;
11406
+ --pf-c-masthead--m-display-stack__main--Order: -1;
11407
+ --pf-c-masthead--m-display-stack__main--FlexBasis: 100%;
11408
+ --pf-c-masthead--m-display-stack__main--PaddingTop: var(--pf-global--spacer--sm);
11409
+ --pf-c-masthead--m-display-stack__main--PaddingBottom: var(--pf-global--spacer--sm);
11410
+ --pf-c-masthead--m-display-stack__main--MarginRight: 0;
11411
+ --pf-c-masthead--m-display-stack__main--before--BorderBottom: var(--pf-c-masthead__main--before--BorderBottomWidth) solid var(--pf-c-masthead__main--before--BorderBottomColor);
11412
+ --pf-c-masthead--m-display-stack__toggle--GridColumn: 1;
11413
+ --pf-c-masthead--m-display-stack__content--GridColumn: 2;
11414
+ --pf-c-masthead--m-display-stack__content--MinHeight: auto;
11415
+ --pf-c-masthead--m-display-stack__content--Order: 1;
11416
+ --pf-c-masthead--m-display-stack__content--PaddingTop: 0;
11417
+ --pf-c-masthead--m-display-stack__content--PaddingBottom: 0;
11418
+ --pf-c-masthead--m-display-stack__content--MarginLeft: 0;
11419
+ --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight: calc(var(--pf-c-masthead--inset) * -1);
11420
+ --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-c-masthead--inset) * -1);
11421
+ --pf-c-masthead--m-display-inline--GridTemplateColumns: max-content max-content 1fr;
11422
+ --pf-c-masthead--m-display-inline__main--GridColumn: 2;
11423
+ --pf-c-masthead--m-display-inline__main--MinHeight: 4.375rem;
11424
+ --pf-c-masthead--m-display-inline__main--Order: 0;
11425
+ --pf-c-masthead--m-display-inline__main--FlexBasis: auto;
11426
+ --pf-c-masthead--m-display-inline__main--PaddingTop: 0;
11427
+ --pf-c-masthead--m-display-inline__main--PaddingBottom: 0;
11428
+ --pf-c-masthead--m-display-inline__main--MarginRight: calc(var(--pf-global--spacer--lg) / 2);
11429
+ --pf-c-masthead--m-display-inline__main--BorderBottom: 0;
11430
+ --pf-c-masthead--m-display-inline__toggle--GridColumn: 1;
11431
+ --pf-c-masthead--m-display-inline__content--GridColumn: 3;
11432
+ --pf-c-masthead--m-display-inline__content--MinHeight: 4.375rem;
11433
+ --pf-c-masthead--m-display-inline__content--Order: 0;
11434
+ --pf-c-masthead--m-display-inline__content--PaddingTop: 0;
11435
+ --pf-c-masthead--m-display-inline__content--PaddingBottom: 0;
11436
+ --pf-c-masthead--m-display-inline__content--MarginLeft: calc(var(--pf-global--spacer--lg) / 2);
11437
+ --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight: 0;
11438
+ --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft: 0;
11439
+ --pf-c-masthead__main--before--Right: calc(var(--pf-c-masthead--inset) * -1);
11440
+ --pf-c-masthead__main--before--Left: calc(var(--pf-c-masthead--inset) * -1);
11441
+ --pf-c-masthead__main--before--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
11442
+ --pf-c-masthead__main--before--BorderBottomColor: var(--pf-global--palette--black-600);
11443
+ --pf-c-masthead__toggle--MarginRight: var(--pf-global--spacer--sm);
11444
+ --pf-c-masthead__toggle--MarginLeft: calc(var(--pf-global--spacer--md) * -1);
11445
+ --pf-c-masthead__toggle--c-button--FontSize: var(--pf-global--FontSize--2xl);
11446
+ --pf-c-masthead--m-light--BackgroundColor: var(--pf-global--BackgroundColor--100);
11447
+ --pf-c-masthead--m-light__main--BorderBottomColor: var(--pf-global--BorderColor--300);
11448
+ --pf-c-masthead--m-light-200--BackgroundColor: var(--pf-global--BackgroundColor--200);
11449
+ --pf-c-masthead--m-light-200__main--BorderBottomColor: var(--pf-global--BorderColor--100);
11450
+ --pf-c-masthead--c-toolbar__item--Display: flex;
11451
+ --pf-c-masthead--item-border-color--base: var(--pf-global--palette--black-800);
11452
+ --pf-c-masthead--c-context-selector--Width: auto;
11453
+ --pf-c-masthead--c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
11454
+ --pf-c-masthead--c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
11455
+ --pf-c-masthead--c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
11456
+ --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor: transparent;
11457
+ --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor: transparent;
11458
+ --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
11459
+ --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
11460
+ --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
11461
+ --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor: transparent;
11462
+ --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor: transparent;
11463
+ --pf-c-masthead--c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
11464
+ --pf-c-masthead--c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
11465
+ --pf-c-masthead--c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
11466
+ --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor: transparent;
11467
+ --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor: transparent;
11468
+ --pf-c-masthead--c-toolbar__content--PaddingRight: 0;
11469
+ --pf-c-masthead--c-toolbar__content--PaddingLeft: 0;
11470
+ --pf-c-masthead--c-toolbar__expandable-content--PaddingTop: var(--pf-global--spacer--md);
11471
+ --pf-c-masthead--c-toolbar__expandable-content--PaddingRight: var(--pf-c-masthead--inset);
11472
+ --pf-c-masthead--c-toolbar__expandable-content--PaddingBottom: var(--pf-global--spacer--md);
11473
+ --pf-c-masthead--c-toolbar__expandable-content--PaddingLeft: var(--pf-c-masthead--inset);
11474
+ --pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth: var(--pf-global--BorderWidth--sm);
11475
+ --pf-c-masthead--c-toolbar__expandable-content--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
11334
11476
  --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
11335
11477
  --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
11336
11478
  --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
@@ -11348,17 +11490,221 @@ ul.pf-c-list {
11348
11490
  --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
11349
11491
  --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
11350
11492
  --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
11493
+ color: var(--pf-global--Color--100);
11494
+ position: relative;
11495
+ display: grid;
11496
+ grid-template-columns: var(--pf-c-masthead--GridTemplateColumns);
11497
+ align-items: center;
11498
+ min-width: 0;
11499
+ padding-right: var(--pf-c-masthead--PaddingRight);
11500
+ padding-left: var(--pf-c-masthead--PaddingLeft);
11501
+ background-color: var(--pf-c-masthead--BackgroundColor);
11351
11502
  }
11352
11503
 
11353
- .pf-c-masthead.pf-m-display-inline {
11354
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
11355
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
11356
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
11357
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
11358
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
11359
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
11360
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
11361
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
11504
+ @media screen and (min-width: 768px) {
11505
+ .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
11506
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
11507
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
11508
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
11509
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
11510
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
11511
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
11512
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
11513
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
11514
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
11515
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
11516
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
11517
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
11518
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
11519
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
11520
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
11521
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
11522
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
11523
+ }
11524
+ }
11525
+ @media screen and (min-width: 1200px) {
11526
+ .pf-c-masthead {
11527
+ --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
11528
+ }
11529
+ }
11530
+ .pf-c-masthead.pf-m-light {
11531
+ color: var(--pf-global--Color--100);
11532
+ --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light--BackgroundColor);
11533
+ --pf-c-masthead__main--BorderBottomColor: var(--pf-c-masthead--m-light__main--BorderBottomColor);
11534
+ }
11535
+
11536
+ .pf-c-masthead.pf-m-light-200 {
11537
+ color: var(--pf-global--Color--100);
11538
+ --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light-200--BackgroundColor);
11539
+ --pf-c-masthead__main--BorderBottomColor: var(--pf-c-masthead--m-light-200__main--BorderBottomColor);
11540
+ }
11541
+
11542
+ .pf-c-masthead .pf-c-toolbar {
11543
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-masthead--c-toolbar__content--PaddingRight);
11544
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-masthead--c-toolbar__content--PaddingLeft);
11545
+ --pf-c-toolbar__expandable-content--PaddingTop: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingTop);
11546
+ --pf-c-toolbar__expandable-content--PaddingRight: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingRight);
11547
+ --pf-c-toolbar__expandable-content--PaddingBottom: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingBottom);
11548
+ --pf-c-toolbar__expandable-content--PaddingLeft: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingLeft);
11549
+ width: 100%;
11550
+ }
11551
+
11552
+ .pf-c-masthead .pf-c-toolbar__content-section {
11553
+ flex-wrap: nowrap;
11554
+ }
11555
+
11556
+ .pf-c-masthead .pf-c-toolbar__expandable-content {
11557
+ border-top: var(--pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth) solid var(--pf-c-masthead--c-toolbar__expandable-content--BorderTopColor);
11558
+ }
11559
+
11560
+ .pf-c-masthead .pf-c-menu-toggle {
11561
+ --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--before--BorderTopColor);
11562
+ --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--before--BorderRightColor);
11563
+ --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--before--BorderLeftColor);
11564
+ }
11565
+
11566
+ .pf-c-masthead .pf-c-menu-toggle.pf-m-full-height {
11567
+ --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor);
11568
+ --pf-c-menu-toggle--before--BorderBottomColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor);
11569
+ }
11570
+
11571
+ .pf-c-masthead .pf-c-context-selector {
11572
+ --pf-c-context-selector--Width: var(--pf-c-masthead--c-context-selector--Width);
11573
+ --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector__toggle--BorderTopColor);
11574
+ --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector__toggle--BorderRightColor);
11575
+ --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector__toggle--BorderLeftColor);
11576
+ }
11577
+
11578
+ .pf-c-masthead .pf-c-context-selector.pf-m-full-height {
11579
+ --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor);
11580
+ --pf-c-context-selector__toggle--BorderBottomColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor);
11581
+ }
11582
+
11583
+ .pf-c-masthead .pf-c-dropdown {
11584
+ --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderTopColor);
11585
+ --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderRightColor);
11586
+ --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor);
11587
+ }
11588
+
11589
+ .pf-c-masthead .pf-c-dropdown.pf-m-full-height {
11590
+ --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor);
11591
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor);
11592
+ }
11593
+
11594
+ .pf-c-masthead .pf-c-nav {
11595
+ align-self: stretch;
11596
+ }
11597
+
11598
+ .pf-c-masthead .pf-c-button.pf-m-plain {
11599
+ color: var(--pf-c-button--m-plain--Color);
11600
+ }
11601
+
11602
+ .pf-c-masthead__main {
11603
+ position: relative;
11604
+ display: flex;
11605
+ flex-basis: var(--pf-c-masthead__main--FlexBasis);
11606
+ align-items: center;
11607
+ align-self: stretch;
11608
+ order: var(--pf-c-masthead__main--Order);
11609
+ min-height: var(--pf-c-masthead__main--MinHeight);
11610
+ padding-top: var(--pf-c-masthead__main--PaddingTop);
11611
+ padding-bottom: var(--pf-c-masthead__main--PaddingBottom);
11612
+ margin-right: var(--pf-c-masthead__main--MarginRight);
11613
+ grid-column: var(--pf-c-masthead__main--GridColumn);
11614
+ }
11615
+
11616
+ .pf-c-masthead__main::before {
11617
+ position: absolute;
11618
+ right: var(--pf-c-masthead__main--before--Right);
11619
+ bottom: 0;
11620
+ left: var(--pf-c-masthead__main--before--Left);
11621
+ content: "";
11622
+ border-bottom: var(--pf-c-masthead__main--before--BorderBottom);
11623
+ }
11624
+
11625
+ .pf-c-masthead__main:last-child {
11626
+ --pf-c-masthead__main--MarginRight: 0;
11627
+ }
11628
+
11629
+ .pf-c-masthead__content {
11630
+ display: flex;
11631
+ flex-grow: 1;
11632
+ align-items: center;
11633
+ align-self: stretch;
11634
+ order: var(--pf-c-masthead__content--Order);
11635
+ min-height: var(--pf-c-masthead__content--MinHeight);
11636
+ padding-top: var(--pf-c-masthead__content--PaddingTop);
11637
+ padding-bottom: var(--pf-c-masthead__content--PaddingBottom);
11638
+ margin-left: var(--pf-c-masthead__content--MarginLeft);
11639
+ grid-column: var(--pf-c-masthead__content--GridColumn);
11640
+ grid-column-end: -1;
11641
+ flex-shrink: 1;
11642
+ }
11643
+
11644
+ .pf-c-masthead__content:only-child {
11645
+ --pf-c-masthead__content--MarginLeft: 0;
11646
+ }
11647
+
11648
+ .pf-c-masthead__content .pf-c-nav.pf-m-horizontal {
11649
+ margin-right: var(--pf-c-masthead__content--c-nav--m-horizontal--MarginRight);
11650
+ margin-left: var(--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft);
11651
+ }
11652
+
11653
+ .pf-c-masthead__toggle ~ .pf-c-masthead__content {
11654
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-c-masthead__content--MarginLeft) * -1);
11655
+ }
11656
+
11657
+ .pf-c-masthead__main,
11658
+ .pf-c-masthead__brand,
11659
+ .pf-c-masthead__content {
11660
+ min-width: 0;
11661
+ }
11662
+
11663
+ .pf-c-masthead__brand {
11664
+ display: inline-flex;
11665
+ align-self: center;
11666
+ }
11667
+
11668
+ .pf-c-masthead__toggle {
11669
+ grid-column: var(--pf-c-masthead__toggle--GridColumn);
11670
+ align-self: center;
11671
+ margin-right: var(--pf-c-masthead__toggle--MarginRight);
11672
+ margin-left: var(--pf-c-masthead__toggle--MarginLeft);
11673
+ }
11674
+
11675
+ .pf-c-masthead__toggle .pf-c-button {
11676
+ --pf-c-button--FontSize: var(--pf-c-masthead__toggle--c-button--FontSize);
11677
+ }
11678
+
11679
+ .pf-c-masthead.pf-m-display-stack {
11680
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
11681
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
11682
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
11683
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
11684
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
11685
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
11686
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
11687
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
11688
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
11689
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
11690
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
11691
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
11692
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
11693
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
11694
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
11695
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
11696
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
11697
+ }
11698
+
11699
+ .pf-c-masthead.pf-m-display-inline {
11700
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
11701
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
11702
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
11703
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
11704
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
11705
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
11706
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
11707
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
11362
11708
  --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
11363
11709
  --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
11364
11710
  --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
@@ -11610,469 +11956,121 @@ ul.pf-c-list {
11610
11956
  --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
11611
11957
  --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
11612
11958
  --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
11613
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
11614
- }
11615
-
11616
- .pf-c-masthead.pf-m-display-inline-on-xl {
11617
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
11618
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
11619
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
11620
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
11621
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
11622
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
11623
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
11624
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
11625
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
11626
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
11627
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
11628
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
11629
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
11630
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
11631
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
11632
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
11633
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
11634
- }
11635
- }
11636
- @media (min-width: 1200px) {
11637
- .pf-c-masthead.pf-m-inset-none-on-xl {
11638
- --pf-c-masthead--inset: 0;
11639
- }
11640
-
11641
- .pf-c-masthead.pf-m-inset-sm-on-xl {
11642
- --pf-c-masthead--inset: var(--pf-global--spacer--sm);
11643
- }
11644
-
11645
- .pf-c-masthead.pf-m-inset-md-on-xl {
11646
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
11647
- }
11648
-
11649
- .pf-c-masthead.pf-m-inset-lg-on-xl {
11650
- --pf-c-masthead--inset: var(--pf-global--spacer--lg);
11651
- }
11652
-
11653
- .pf-c-masthead.pf-m-inset-xl-on-xl {
11654
- --pf-c-masthead--inset: var(--pf-global--spacer--xl);
11655
- }
11656
-
11657
- .pf-c-masthead.pf-m-inset-2xl-on-xl {
11658
- --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
11659
- }
11660
- }
11661
- @media (min-width: 1450px) {
11662
- .pf-c-masthead.pf-m-display-stack-on-2xl {
11663
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
11664
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
11665
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
11666
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
11667
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
11668
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
11669
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
11670
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
11671
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
11672
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
11673
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
11674
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
11675
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
11676
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
11677
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
11678
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
11679
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
11680
- }
11681
-
11682
- .pf-c-masthead.pf-m-display-inline-on-2xl {
11683
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
11684
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
11685
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
11686
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
11687
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
11688
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
11689
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
11690
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
11691
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
11692
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
11693
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
11694
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
11695
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
11696
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
11697
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
11698
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
11699
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
11700
- }
11701
- }
11702
- @media (min-width: 1450px) {
11703
- .pf-c-masthead.pf-m-inset-none-on-2xl {
11704
- --pf-c-masthead--inset: 0;
11705
- }
11706
-
11707
- .pf-c-masthead.pf-m-inset-sm-on-2xl {
11708
- --pf-c-masthead--inset: var(--pf-global--spacer--sm);
11709
- }
11710
-
11711
- .pf-c-masthead.pf-m-inset-md-on-2xl {
11712
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
11713
- }
11714
-
11715
- .pf-c-masthead.pf-m-inset-lg-on-2xl {
11716
- --pf-c-masthead--inset: var(--pf-global--spacer--lg);
11717
- }
11718
-
11719
- .pf-c-masthead.pf-m-inset-xl-on-2xl {
11720
- --pf-c-masthead--inset: var(--pf-global--spacer--xl);
11721
- }
11722
-
11723
- .pf-c-masthead.pf-m-inset-2xl-on-2xl {
11724
- --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
11725
- }
11726
- }
11727
- :where(.pf-theme-dark) .pf-c-masthead {
11728
- --pf-global--Color--100: #e0e0e0;
11729
- --pf-global--Color--200: #aaabac;
11730
- --pf-global--BorderColor--100: #444548;
11731
- --pf-global--primary-color--100: #1fa7f8;
11732
- --pf-global--link--Color: #1fa7f8;
11733
- --pf-global--link--Color--hover: #73bcf7;
11734
- --pf-global--BackgroundColor--100: #1b1d21;
11735
- }
11736
-
11737
- :where(.pf-theme-dark) .pf-c-masthead .pf-c-card {
11738
- --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
11739
- }
11740
-
11741
- :where(.pf-theme-dark) .pf-c-masthead .pf-c-button {
11742
- --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
11743
- --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
11744
- --pf-c-button--m-primary--focus--Color: var(--pf-global--Color--light-100);
11745
- --pf-c-button--m-primary--active--Color: var(--pf-global--Color--light-100);
11746
- --pf-c-button--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
11747
- --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--primary-color--200);
11748
- --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--primary-color--200);
11749
- --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
11750
- --pf-c-button--m-secondary--Color: var(--pf-global--primary-color--100);
11751
- --pf-c-button--m-secondary--hover--Color: var(--pf-global--primary-color--100);
11752
- --pf-c-button--m-secondary--focus--Color: var(--pf-global--primary-color--100);
11753
- --pf-c-button--m-secondary--active--Color: var(--pf-global--primary-color--100);
11754
- }
11755
-
11756
- :where(.pf-theme-dark) .pf-c-masthead {
11757
- --pf-c-masthead--BackgroundColor: var(--pf-global--palette--black-1000);
11758
- color: var(--pf-global--Color--100);
11759
- }
11760
-
11761
- :where(.pf-theme-dark) .pf-c-masthead .pf-c-toolbar {
11762
- --pf-c-toolbar--BackgroundColor: var(--pf-global--palette--black-1000);
11763
- }
11764
-
11765
- .pf-c-login__footer, .pf-c-login__header {
11766
- --pf-global--Color--100: var(--pf-global--Color--light-100);
11767
- --pf-global--Color--200: var(--pf-global--Color--light-200);
11768
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
11769
- --pf-global--primary-color--100: var(--pf-global--primary-color--light-100);
11770
- --pf-global--link--Color: var(--pf-global--link--Color--light);
11771
- --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
11772
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
11773
- }
11774
-
11775
- .pf-c-login__footer .pf-c-card, .pf-c-login__header .pf-c-card {
11776
- --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
11777
- }
11778
-
11779
- .pf-c-login__footer .pf-c-button, .pf-c-login__header .pf-c-button {
11780
- --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
11781
- --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
11782
- --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
11783
- --pf-c-button--m-primary--active--Color: var(--pf-global--primary-color--dark-100);
11784
- --pf-c-button--m-primary--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
11785
- --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
11786
- --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
11787
- --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
11788
- --pf-c-button--m-secondary--Color: var(--pf-global--Color--light-100);
11789
- --pf-c-button--m-secondary--hover--Color: var(--pf-global--Color--light-100);
11790
- --pf-c-button--m-secondary--focus--Color: var(--pf-global--Color--light-100);
11791
- --pf-c-button--m-secondary--active--Color: var(--pf-global--Color--light-100);
11792
- --pf-c-button--m-secondary--BorderColor: var(--pf-global--Color--light-100);
11793
- --pf-c-button--m-secondary--hover--BorderColor: var(--pf-global--Color--light-100);
11794
- --pf-c-button--m-secondary--focus--BorderColor: var(--pf-global--Color--light-100);
11795
- --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
11796
- }
11797
-
11798
- .pf-c-login {
11799
- --pf-c-login--PaddingTop: var(--pf-global--spacer--lg);
11800
- --pf-c-login--PaddingBottom: var(--pf-global--spacer--lg);
11801
- --pf-c-login--xl--BackgroundImage: none;
11802
- --pf-c-login__container--xl--GridColumnGap: var(--pf-global--spacer--3xl);
11803
- --pf-c-login__container--MaxWidth: 31.25rem;
11804
- --pf-c-login__container--xl--MaxWidth: none;
11805
- --pf-c-login__container--PaddingLeft: 6.125rem;
11806
- --pf-c-login__container--PaddingRight: 6.125rem;
11807
- --pf-c-login__container--xl--GridTemplateColumns: 34rem minmax(auto, 34rem);
11808
- --pf-c-login__header--MarginBottom: var(--pf-global--spacer--md);
11809
- --pf-c-login__header--PaddingLeft: var(--pf-global--spacer--md);
11810
- --pf-c-login__header--PaddingRight: var(--pf-global--spacer--md);
11811
- --pf-c-login__header--xl--MarginBottom: var(--pf-global--spacer--2xl);
11812
- --pf-c-login__header--xl--MarginTop: var(--pf-global--spacer--3xl);
11813
- --pf-c-login__header--c-brand--MarginBottom: var(--pf-global--spacer--lg);
11814
- --pf-c-login__header--c-brand--xl--MarginBottom: var(--pf-global--spacer--2xl);
11815
- --pf-c-login__main--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
11816
- --pf-c-login__main--MarginBottom: var(--pf-global--spacer--lg);
11817
- --pf-c-login__main-header--PaddingTop: var(--pf-global--spacer--2xl);
11818
- --pf-c-login__main-header--PaddingRight: var(--pf-global--spacer--xl);
11819
- --pf-c-login__main-header--PaddingBottom: var(--pf-global--spacer--md);
11820
- --pf-c-login__main-header--PaddingLeft: var(--pf-global--spacer--xl);
11821
- --pf-c-login__main-header--md--PaddingRight: var(--pf-global--spacer--2xl);
11822
- --pf-c-login__main-header--md--PaddingLeft: var(--pf-global--spacer--2xl);
11823
- --pf-c-login__main-header--ColumnGap: var(--pf-global--spacer--md);
11824
- --pf-c-login__main-header--RowGap: var(--pf-global--spacer--md);
11825
- --pf-c-login__main-header-desc--MarginBottom: var(--pf-global--spacer--sm);
11826
- --pf-c-login__main-header-desc--md--MarginBottom: 0;
11827
- --pf-c-login__main-header-desc--FontSize: var(--pf-global--FontSize--sm);
11828
- --pf-c-login__main-body--PaddingRight: var(--pf-global--spacer--xl);
11829
- --pf-c-login__main-body--PaddingBottom: var(--pf-global--spacer--xl);
11830
- --pf-c-login__main-body--PaddingLeft: var(--pf-global--spacer--xl);
11831
- --pf-c-login__main-body--md--PaddingRight: var(--pf-global--spacer--2xl);
11832
- --pf-c-login__main-body--md--PaddingLeft: var(--pf-global--spacer--2xl);
11833
- --pf-c-login__main-footer--PaddingBottom: var(--pf-global--spacer--3xl);
11834
- --pf-c-login__main-footer--c-title--MarginBottom: var(--pf-global--spacer--md);
11835
- --pf-c-login__main-footer-links--PaddingTop: var(--pf-global--spacer--sm);
11836
- --pf-c-login__main-footer-links--PaddingRight: var(--pf-global--spacer--3xl);
11837
- --pf-c-login__main-footer-links--PaddingBottom: var(--pf-global--spacer--xl);
11838
- --pf-c-login__main-footer-links--PaddingLeft: var(--pf-global--spacer--3xl);
11839
- --pf-c-login__main-footer-links-item--PaddingRight: var(--pf-global--spacer--md);
11840
- --pf-c-login__main-footer-links-item--PaddingLeft: var(--pf-global--spacer--md);
11841
- --pf-c-login__main-footer-links-item--MarginBottom: var(--pf-global--spacer--sm);
11842
- --pf-c-login__main-footer-links-item-link-svg--Fill: var(--pf-global--icon--Color--light);
11843
- --pf-c-login__main-footer-links-item-link-svg--Width: var(--pf-global--icon--FontSize--lg);
11844
- --pf-c-login__main-footer-links-item-link-svg--Height: var(--pf-global--icon--FontSize--lg);
11845
- --pf-c-login__main-footer-links-item-link-svg--hover--Fill: var(--pf-global--icon--Color--dark);
11846
- --pf-c-login__main-footer-band--PaddingTop: var(--pf-global--spacer--lg);
11847
- --pf-c-login__main-footer-band--PaddingRight: var(--pf-global--spacer--md);
11848
- --pf-c-login__main-footer-band--PaddingBottom: var(--pf-global--spacer--lg);
11849
- --pf-c-login__main-footer-band--PaddingLeft: var(--pf-global--spacer--md);
11850
- --pf-c-login__main-footer-band--BackgroundColor: var(--pf-global--BackgroundColor--200);
11851
- --pf-c-login__main-footer-band-item--PaddingTop: var(--pf-global--spacer--md);
11852
- --pf-c-login__footer--PaddingLeft: var(--pf-global--spacer--md);
11853
- --pf-c-login__footer--PaddingRight: var(--pf-global--spacer--md);
11854
- --pf-c-login__footer--c-list--PaddingTop: var(--pf-global--spacer--md);
11855
- --pf-c-login__footer--c-list--xl--PaddingTop: var(--pf-global--spacer--2xl);
11856
- display: flex;
11857
- justify-content: center;
11858
- min-height: 100vh;
11859
- padding-top: var(--pf-c-login--PaddingTop);
11860
- padding-bottom: var(--pf-c-login--PaddingBottom);
11861
- }
11862
-
11863
- @media (min-width: 1200px) {
11864
- .pf-c-login {
11865
- --pf-c-login__container--MaxWidth: var(--pf-c-login__container--xl--MaxWidth);
11866
- }
11867
- }
11868
- @media (min-width: 576px) {
11869
- .pf-c-login {
11870
- --pf-c-login__header--PaddingRight: 0;
11871
- --pf-c-login__header--PaddingLeft: 0;
11872
- }
11873
- }
11874
- @media (min-width: 1200px) {
11875
- .pf-c-login {
11876
- --pf-c-login__header--MarginBottom: var(--pf-c-login__header--xl--MarginBottom);
11877
- --pf-c-login__header--c-brand--MarginBottom: var(--pf-c-login__header--c-brand--xl--MarginBottom);
11878
- }
11879
- }
11880
- @media (min-width: 1200px) {
11881
- .pf-c-login {
11882
- --pf-c-login__main--MarginBottom: 0;
11883
- }
11884
- }
11885
- @media (min-width: 768px) {
11886
- .pf-c-login {
11887
- --pf-c-login__main-header--PaddingRight: var(--pf-c-login__main-header--md--PaddingRight);
11888
- --pf-c-login__main-header--PaddingLeft: var(--pf-c-login__main-header--md--PaddingLeft);
11889
- --pf-c-login__main-header-desc--MarginBottom: var(--pf-c-login__main-header-desc--md--MarginBottom);
11890
- }
11891
- }
11892
- @media (min-width: 768px) {
11893
- .pf-c-login {
11894
- --pf-c-login__main-body--PaddingRight: var(--pf-c-login__main-body--md--PaddingRight);
11895
- --pf-c-login__main-body--PaddingLeft: var(--pf-c-login__main-body--md--PaddingLeft);
11896
- }
11897
- }
11898
- @media (min-width: 576px) {
11899
- .pf-c-login {
11900
- --pf-c-login__footer--PaddingRight: 0;
11901
- --pf-c-login__footer--PaddingLeft: 0;
11902
- }
11903
- }
11904
- @media (min-width: 1200px) {
11905
- .pf-c-login {
11906
- --pf-c-login__footer--c-list--PaddingTop: var(--pf-c-login__footer--c-list--xl--PaddingTop);
11907
- }
11908
- }
11909
- @media (min-width: 1200px) {
11910
- .pf-c-login {
11911
- background-image: var(--pf-c-login--xl--BackgroundImage);
11912
- }
11913
- }
11914
- @media (min-width: 576px) {
11915
- .pf-c-login {
11916
- align-items: center;
11917
- }
11918
- }
11919
- .pf-c-login__container {
11920
- width: 100%;
11921
- max-width: var(--pf-c-login__container--MaxWidth);
11922
- }
11923
-
11924
- @media (min-width: 1200px) {
11925
- .pf-c-login__container {
11926
- display: grid;
11927
- justify-content: center;
11928
- grid-column-gap: var(--pf-c-login__container--xl--GridColumnGap);
11929
- grid-template-columns: var(--pf-c-login__container--xl--GridTemplateColumns);
11930
- grid-template-areas: "main header" "main footer" "main .";
11931
- padding-right: var(--pf-c-login__container--PaddingRight);
11932
- padding-left: var(--pf-c-login__container--PaddingLeft);
11933
- }
11934
- }
11935
- .pf-c-login__header {
11936
- color: var(--pf-global--Color--100);
11937
- grid-area: header;
11938
- padding-right: var(--pf-c-login__header--PaddingRight);
11939
- padding-left: var(--pf-c-login__header--PaddingLeft);
11940
- }
11941
-
11942
- @media (min-width: 1200px) {
11943
- .pf-c-login__header {
11944
- margin-top: var(--pf-c-login__header--xl--MarginTop);
11945
- }
11946
- }
11947
- .pf-c-login__header .pf-c-brand {
11948
- margin-bottom: var(--pf-c-login__header--c-brand--MarginBottom);
11949
- }
11950
-
11951
- .pf-c-login__main {
11952
- align-self: start;
11953
- margin-bottom: var(--pf-c-login__main--MarginBottom);
11954
- background-color: var(--pf-c-login__main--BackgroundColor);
11955
- grid-area: main;
11956
- }
11957
-
11958
- .pf-c-login__main > :first-child:not(.pf-c-login__main-header) {
11959
- padding-top: var(--pf-c-login__main-header--PaddingTop);
11960
- }
11961
-
11962
- .pf-c-login__main > :last-child:not(.pf-c-login__main-footer) {
11963
- padding-bottom: var(--pf-c-login__main-footer--PaddingBottom);
11964
- }
11965
-
11966
- .pf-c-login__main-header {
11967
- display: grid;
11968
- grid-template-columns: 100%;
11969
- column-gap: var(--pf-c-login__main-header--ColumnGap);
11970
- row-gap: var(--pf-c-login__main-header--RowGap);
11971
- align-items: center;
11972
- padding: var(--pf-c-login__main-header--PaddingTop) var(--pf-c-login__main-header--PaddingRight) var(--pf-c-login__main-header--PaddingBottom) var(--pf-c-login__main-header--PaddingLeft);
11973
- }
11974
-
11975
- @media (min-width: 768px) {
11976
- .pf-c-login__main-header {
11977
- grid-template-columns: 1fr auto;
11978
- }
11979
- }
11980
- .pf-c-login__main-header-utilities,
11981
- .pf-c-login__main-header .pf-c-dropdown {
11982
- grid-column: auto;
11983
- grid-row: auto;
11984
- }
11985
-
11986
- @media (min-width: 768px) {
11987
- .pf-c-login__main-header-utilities,
11988
- .pf-c-login__main-header .pf-c-dropdown {
11989
- grid-column: 2/3;
11990
- grid-row: 1;
11991
- }
11992
- }
11993
- .pf-c-login__main-header-utilities .pf-c-dropdown {
11994
- grid-column: auto;
11995
- grid-row: auto;
11996
- }
11997
-
11998
- .pf-c-login__main-header-desc {
11999
- margin-bottom: var(--pf-c-login__main-header-desc--MarginBottom);
12000
- font-size: var(--pf-c-login__main-header-desc--FontSize);
12001
- grid-column: 1/-1;
12002
- }
12003
-
12004
- .pf-c-login__main-body {
12005
- padding-right: var(--pf-c-login__main-body--PaddingRight);
12006
- padding-bottom: var(--pf-c-login__main-body--PaddingBottom);
12007
- padding-left: var(--pf-c-login__main-body--PaddingLeft);
12008
- }
11959
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
11960
+ }
12009
11961
 
12010
- .pf-c-login__main-footer {
12011
- display: flex;
12012
- flex-wrap: wrap;
11962
+ .pf-c-masthead.pf-m-display-inline-on-xl {
11963
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
11964
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
11965
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
11966
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
11967
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
11968
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
11969
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
11970
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
11971
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
11972
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
11973
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
11974
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
11975
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
11976
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
11977
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
11978
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
11979
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
11980
+ }
12013
11981
  }
11982
+ @media (min-width: 1200px) {
11983
+ .pf-c-masthead.pf-m-inset-none-on-xl {
11984
+ --pf-c-masthead--inset: 0;
11985
+ }
12014
11986
 
12015
- .pf-c-login__main-footer .pf-c-title {
12016
- margin-bottom: var(--pf-c-login__main-footer--c-title--MarginBottom);
12017
- text-align: center;
12018
- }
11987
+ .pf-c-masthead.pf-m-inset-sm-on-xl {
11988
+ --pf-c-masthead--inset: var(--pf-global--spacer--sm);
11989
+ }
12019
11990
 
12020
- .pf-c-login__main-footer > * {
12021
- flex-basis: 100%;
12022
- }
11991
+ .pf-c-masthead.pf-m-inset-md-on-xl {
11992
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
11993
+ }
12023
11994
 
12024
- .pf-c-login__main-footer-links {
12025
- display: flex;
12026
- flex-wrap: wrap;
12027
- justify-content: center;
12028
- padding: var(--pf-c-login__main-footer-links--PaddingTop) var(--pf-c-login__main-footer-links--PaddingRight) var(--pf-c-login__main-footer-links--PaddingBottom) var(--pf-c-login__main-footer-links--PaddingLeft);
12029
- }
11995
+ .pf-c-masthead.pf-m-inset-lg-on-xl {
11996
+ --pf-c-masthead--inset: var(--pf-global--spacer--lg);
11997
+ }
12030
11998
 
12031
- .pf-c-login__main-footer-links-item {
12032
- padding-right: var(--pf-c-login__main-footer-links-item--PaddingRight);
12033
- padding-left: var(--pf-c-login__main-footer-links-item--PaddingLeft);
12034
- margin-bottom: var(--pf-c-login__main-footer-links-item--MarginBottom);
12035
- }
11999
+ .pf-c-masthead.pf-m-inset-xl-on-xl {
12000
+ --pf-c-masthead--inset: var(--pf-global--spacer--xl);
12001
+ }
12036
12002
 
12037
- .pf-c-login__main-footer-links-item-link svg {
12038
- fill: var(--pf-c-login__main-footer-links-item-link-svg--Fill);
12039
- width: 100%;
12040
- max-width: var(--pf-c-login__main-footer-links-item-link-svg--Width);
12041
- height: 100%;
12042
- max-height: var(--pf-c-login__main-footer-links-item-link-svg--Height);
12003
+ .pf-c-masthead.pf-m-inset-2xl-on-xl {
12004
+ --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
12005
+ }
12043
12006
  }
12007
+ @media (min-width: 1450px) {
12008
+ .pf-c-masthead.pf-m-display-stack-on-2xl {
12009
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
12010
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
12011
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
12012
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
12013
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
12014
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
12015
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
12016
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
12017
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
12018
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
12019
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
12020
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
12021
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
12022
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
12023
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
12024
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
12025
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
12026
+ }
12044
12027
 
12045
- .pf-c-login__main-footer-links-item-link:hover svg {
12046
- fill: var(--pf-c-login__main-footer-links-item-link-svg--hover--Fill);
12028
+ .pf-c-masthead.pf-m-display-inline-on-2xl {
12029
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
12030
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
12031
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
12032
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
12033
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
12034
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
12035
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
12036
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
12037
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
12038
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
12039
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
12040
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
12041
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
12042
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
12043
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
12044
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
12045
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
12046
+ }
12047
12047
  }
12048
+ @media (min-width: 1450px) {
12049
+ .pf-c-masthead.pf-m-inset-none-on-2xl {
12050
+ --pf-c-masthead--inset: 0;
12051
+ }
12048
12052
 
12049
- .pf-c-login__main-footer-band {
12050
- padding: var(--pf-c-login__main-footer-band--PaddingTop) var(--pf-c-login__main-footer-band--PaddingRight) var(--pf-c-login__main-footer-band--PaddingBottom) var(--pf-c-login__main-footer-band--PaddingLeft);
12051
- text-align: center;
12052
- background-color: var(--pf-c-login__main-footer-band--BackgroundColor);
12053
- }
12053
+ .pf-c-masthead.pf-m-inset-sm-on-2xl {
12054
+ --pf-c-masthead--inset: var(--pf-global--spacer--sm);
12055
+ }
12054
12056
 
12055
- .pf-c-login__main-footer-band > * + * {
12056
- padding-top: var(--pf-c-login__main-footer-band-item--PaddingTop);
12057
- }
12057
+ .pf-c-masthead.pf-m-inset-md-on-2xl {
12058
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
12059
+ }
12058
12060
 
12059
- .pf-c-login__footer {
12060
- color: var(--pf-global--Color--100);
12061
- grid-area: footer;
12062
- padding-right: var(--pf-c-login__footer--PaddingRight);
12063
- padding-left: var(--pf-c-login__footer--PaddingLeft);
12064
- }
12061
+ .pf-c-masthead.pf-m-inset-lg-on-2xl {
12062
+ --pf-c-masthead--inset: var(--pf-global--spacer--lg);
12063
+ }
12065
12064
 
12066
- .pf-c-login__footer .pf-c-list a {
12067
- color: unset;
12068
- }
12065
+ .pf-c-masthead.pf-m-inset-xl-on-2xl {
12066
+ --pf-c-masthead--inset: var(--pf-global--spacer--xl);
12067
+ }
12069
12068
 
12070
- .pf-c-login__footer .pf-c-list:not(:only-child) {
12071
- padding-top: var(--pf-c-login__footer--c-list--PaddingTop);
12069
+ .pf-c-masthead.pf-m-inset-2xl-on-2xl {
12070
+ --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
12071
+ }
12072
12072
  }
12073
-
12074
- :where(.pf-theme-dark) .pf-c-login__header,
12075
- :where(.pf-theme-dark) .pf-c-login__footer {
12073
+ :where(.pf-theme-dark) .pf-c-masthead {
12076
12074
  --pf-global--Color--100: #e0e0e0;
12077
12075
  --pf-global--Color--200: #aaabac;
12078
12076
  --pf-global--BorderColor--100: #444548;
@@ -12082,13 +12080,11 @@ ul.pf-c-list {
12082
12080
  --pf-global--BackgroundColor--100: #1b1d21;
12083
12081
  }
12084
12082
 
12085
- :where(.pf-theme-dark) .pf-c-login__header .pf-c-card,
12086
- :where(.pf-theme-dark) .pf-c-login__footer .pf-c-card {
12083
+ :where(.pf-theme-dark) .pf-c-masthead .pf-c-card {
12087
12084
  --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
12088
12085
  }
12089
12086
 
12090
- :where(.pf-theme-dark) .pf-c-login__header .pf-c-button,
12091
- :where(.pf-theme-dark) .pf-c-login__footer .pf-c-button {
12087
+ :where(.pf-theme-dark) .pf-c-masthead .pf-c-button {
12092
12088
  --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
12093
12089
  --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
12094
12090
  --pf-c-button--m-primary--focus--Color: var(--pf-global--Color--light-100);
@@ -12103,11 +12099,15 @@ ul.pf-c-list {
12103
12099
  --pf-c-button--m-secondary--active--Color: var(--pf-global--primary-color--100);
12104
12100
  }
12105
12101
 
12106
- :where(.pf-theme-dark) .pf-c-login__header,
12107
- :where(.pf-theme-dark) .pf-c-login__footer {
12102
+ :where(.pf-theme-dark) .pf-c-masthead {
12103
+ --pf-c-masthead--BackgroundColor: var(--pf-global--palette--black-1000);
12108
12104
  color: var(--pf-global--Color--100);
12109
12105
  }
12110
12106
 
12107
+ :where(.pf-theme-dark) .pf-c-masthead .pf-c-toolbar {
12108
+ --pf-c-toolbar--BackgroundColor: var(--pf-global--palette--black-1000);
12109
+ }
12110
+
12111
12111
  .pf-c-menu {
12112
12112
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
12113
12113
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
@@ -22792,6 +22792,52 @@ svg.pf-c-spinner.pf-m-xl {
22792
22792
  --pf-c-tooltip__arrow--Height: 0.9375rem;
22793
22793
  }
22794
22794
 
22795
+ .pf-c-number-input .pf-c-form-control {
22796
+ appearance: textfield;
22797
+ }
22798
+
22799
+ .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
22800
+ appearance: none;
22801
+ margin: 0;
22802
+ }
22803
+
22804
+ .pf-c-number-input {
22805
+ --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
22806
+ --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
22807
+ --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
22808
+ --pf-c-number-input--c-form-control--width-icon: 0px;
22809
+ --pf-c-number-input--m-status--c-form-control--width-icon: var(--pf-global--spacer--xl);
22810
+ --pf-c-number-input--c-form-control--width-chars: 4;
22811
+ --pf-c-number-input--c-form-control--Width:
22812
+ calc(
22813
+ calc(
22814
+ var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch
22815
+ ) + var(--pf-c-number-input--c-form-control--width-icon)
22816
+ );
22817
+ display: inline-flex;
22818
+ align-items: center;
22819
+ }
22820
+
22821
+ .pf-c-number-input.pf-m-status {
22822
+ --pf-c-number-input--c-form-control--width-icon: var(--pf-c-number-input--m-status--c-form-control--width-icon);
22823
+ }
22824
+
22825
+ .pf-c-number-input .pf-c-form-control {
22826
+ display: inline-flex;
22827
+ width: var(--pf-c-number-input--c-form-control--Width);
22828
+ text-align: right;
22829
+ }
22830
+
22831
+ .pf-c-input-group + .pf-c-number-input__unit,
22832
+ .pf-c-number-input__unit + .pf-c-input-group {
22833
+ margin-left: var(--pf-c-number-input__unit--c-input-group--MarginLeft);
22834
+ }
22835
+
22836
+ .pf-c-number-input__icon {
22837
+ display: flex;
22838
+ font-size: var(--pf-c-number-input__icon--FontSize);
22839
+ }
22840
+
22795
22841
  .pf-c-tree-view {
22796
22842
  --pf-c-tree-view--PaddingTop: var(--pf-global--spacer--sm);
22797
22843
  --pf-c-tree-view--PaddingBottom: var(--pf-global--spacer--sm);
@@ -23882,52 +23928,6 @@ label.pf-c-tree-view__node-text {
23882
23928
  color: var(--pf-global--Color--100);
23883
23929
  }
23884
23930
 
23885
- .pf-c-number-input .pf-c-form-control {
23886
- appearance: textfield;
23887
- }
23888
-
23889
- .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
23890
- appearance: none;
23891
- margin: 0;
23892
- }
23893
-
23894
- .pf-c-number-input {
23895
- --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
23896
- --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
23897
- --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
23898
- --pf-c-number-input--c-form-control--width-icon: 0px;
23899
- --pf-c-number-input--m-status--c-form-control--width-icon: var(--pf-global--spacer--xl);
23900
- --pf-c-number-input--c-form-control--width-chars: 4;
23901
- --pf-c-number-input--c-form-control--Width:
23902
- calc(
23903
- calc(
23904
- var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch
23905
- ) + var(--pf-c-number-input--c-form-control--width-icon)
23906
- );
23907
- display: inline-flex;
23908
- align-items: center;
23909
- }
23910
-
23911
- .pf-c-number-input.pf-m-status {
23912
- --pf-c-number-input--c-form-control--width-icon: var(--pf-c-number-input--m-status--c-form-control--width-icon);
23913
- }
23914
-
23915
- .pf-c-number-input .pf-c-form-control {
23916
- display: inline-flex;
23917
- width: var(--pf-c-number-input--c-form-control--Width);
23918
- text-align: right;
23919
- }
23920
-
23921
- .pf-c-input-group + .pf-c-number-input__unit,
23922
- .pf-c-number-input__unit + .pf-c-input-group {
23923
- margin-left: var(--pf-c-number-input__unit--c-input-group--MarginLeft);
23924
- }
23925
-
23926
- .pf-c-number-input__icon {
23927
- display: flex;
23928
- font-size: var(--pf-c-number-input__icon--FontSize);
23929
- }
23930
-
23931
23931
  .pf-c-draggable {
23932
23932
  --pf-c-draggable--Cursor: auto;
23933
23933
  --pf-c-draggable--m-dragging--Cursor: grabbing;