@patternfly/react-table 4.40.0 → 4.43.1

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 (74) hide show
  1. package/CHANGELOG.md +41 -0
  2. package/dist/esm/components/Table/base/provider.d.ts +5 -5
  3. package/dist/esm/components/Table/base/types.d.ts +5 -5
  4. package/dist/esm/components/TableComposable/InnerScrollContainer.d.ts +9 -0
  5. package/dist/esm/components/TableComposable/InnerScrollContainer.d.ts.map +1 -0
  6. package/dist/esm/components/TableComposable/InnerScrollContainer.js +10 -0
  7. package/dist/esm/components/TableComposable/InnerScrollContainer.js.map +1 -0
  8. package/dist/esm/components/TableComposable/OuterScrollContainer.d.ts +9 -0
  9. package/dist/esm/components/TableComposable/OuterScrollContainer.d.ts.map +1 -0
  10. package/dist/esm/components/TableComposable/OuterScrollContainer.js +10 -0
  11. package/dist/esm/components/TableComposable/OuterScrollContainer.js.map +1 -0
  12. package/dist/esm/components/TableComposable/TableComposable.d.ts +3 -1
  13. package/dist/esm/components/TableComposable/TableComposable.d.ts.map +1 -1
  14. package/dist/esm/components/TableComposable/TableComposable.js +12 -2
  15. package/dist/esm/components/TableComposable/TableComposable.js.map +1 -1
  16. package/dist/esm/components/TableComposable/Th.d.ts +11 -1
  17. package/dist/esm/components/TableComposable/Th.d.ts.map +1 -1
  18. package/dist/esm/components/TableComposable/Th.js +5 -2
  19. package/dist/esm/components/TableComposable/Th.js.map +1 -1
  20. package/dist/esm/components/TableComposable/Thead.d.ts +3 -1
  21. package/dist/esm/components/TableComposable/Thead.d.ts.map +1 -1
  22. package/dist/esm/components/TableComposable/Thead.js +2 -2
  23. package/dist/esm/components/TableComposable/Thead.js.map +1 -1
  24. package/dist/esm/components/TableComposable/Tr.d.ts +3 -1
  25. package/dist/esm/components/TableComposable/Tr.d.ts.map +1 -1
  26. package/dist/esm/components/TableComposable/Tr.js +2 -2
  27. package/dist/esm/components/TableComposable/Tr.js.map +1 -1
  28. package/dist/esm/components/TableComposable/index.d.ts +2 -0
  29. package/dist/esm/components/TableComposable/index.d.ts.map +1 -1
  30. package/dist/esm/components/TableComposable/index.js +2 -0
  31. package/dist/esm/components/TableComposable/index.js.map +1 -1
  32. package/dist/js/components/Table/base/provider.d.ts +5 -5
  33. package/dist/js/components/Table/base/types.d.ts +5 -5
  34. package/dist/js/components/TableComposable/InnerScrollContainer.d.ts +9 -0
  35. package/dist/js/components/TableComposable/InnerScrollContainer.d.ts.map +1 -0
  36. package/dist/js/components/TableComposable/InnerScrollContainer.js +14 -0
  37. package/dist/js/components/TableComposable/InnerScrollContainer.js.map +1 -0
  38. package/dist/js/components/TableComposable/OuterScrollContainer.d.ts +9 -0
  39. package/dist/js/components/TableComposable/OuterScrollContainer.d.ts.map +1 -0
  40. package/dist/js/components/TableComposable/OuterScrollContainer.js +14 -0
  41. package/dist/js/components/TableComposable/OuterScrollContainer.js.map +1 -0
  42. package/dist/js/components/TableComposable/TableComposable.d.ts +3 -1
  43. package/dist/js/components/TableComposable/TableComposable.d.ts.map +1 -1
  44. package/dist/js/components/TableComposable/TableComposable.js +12 -2
  45. package/dist/js/components/TableComposable/TableComposable.js.map +1 -1
  46. package/dist/js/components/TableComposable/Th.d.ts +11 -1
  47. package/dist/js/components/TableComposable/Th.d.ts.map +1 -1
  48. package/dist/js/components/TableComposable/Th.js +5 -2
  49. package/dist/js/components/TableComposable/Th.js.map +1 -1
  50. package/dist/js/components/TableComposable/Thead.d.ts +3 -1
  51. package/dist/js/components/TableComposable/Thead.d.ts.map +1 -1
  52. package/dist/js/components/TableComposable/Thead.js +2 -2
  53. package/dist/js/components/TableComposable/Thead.js.map +1 -1
  54. package/dist/js/components/TableComposable/Tr.d.ts +3 -1
  55. package/dist/js/components/TableComposable/Tr.d.ts.map +1 -1
  56. package/dist/js/components/TableComposable/Tr.js +2 -2
  57. package/dist/js/components/TableComposable/Tr.js.map +1 -1
  58. package/dist/js/components/TableComposable/index.d.ts +2 -0
  59. package/dist/js/components/TableComposable/index.d.ts.map +1 -1
  60. package/dist/js/components/TableComposable/index.js +2 -0
  61. package/dist/js/components/TableComposable/index.js.map +1 -1
  62. package/dist/umd/react-table.css +400 -87
  63. package/dist/umd/react-table.js +247 -208
  64. package/dist/umd/react-table.min.css +1277 -964
  65. package/dist/umd/react-table.min.js +3 -3
  66. package/package.json +6 -6
  67. package/src/components/TableComposable/InnerScrollContainer.tsx +22 -0
  68. package/src/components/TableComposable/OuterScrollContainer.tsx +22 -0
  69. package/src/components/TableComposable/TableComposable.tsx +11 -0
  70. package/src/components/TableComposable/Th.tsx +26 -0
  71. package/src/components/TableComposable/Thead.tsx +12 -1
  72. package/src/components/TableComposable/Tr.tsx +5 -1
  73. package/src/components/TableComposable/examples/ComposableTable.md +1106 -0
  74. package/src/components/TableComposable/index.ts +2 -0
package/dist/umd/react-table.min.css CHANGED
@@ -4158,6 +4158,63 @@
4158
4158
  --pf-c-table--cell--Width: auto;
4159
4159
  }
4160
4160
  }
4161
+ .pf-c-table {
4162
+ --pf-c-table__sticky-column--cell-min-width--base: 12.5rem;
4163
+ --pf-c-table__sticky-column--MinWidth: var(--pf-c-table__sticky-column--cell-min-width--base);
4164
+ --pf-c-table__sticky-column--Left: 0;
4165
+ --pf-c-table__sticky-column--ZIndex: var(--pf-global--ZIndex--md);
4166
+ --pf-c-table__sticky-column--Top: 0;
4167
+ --pf-c-table__sticky-column--BackgroundColor: var(--pf-global--BackgroundColor--100);
4168
+ --pf-c-table__sticky-column--m-border-right--before--BorderRightWidth: var(--pf-global--BorderWidth--sm);
4169
+ --pf-c-table__sticky-column--m-border-right--before--BorderRightColor: var(--pf-global--BorderColor--100);
4170
+ --pf-c-table--m-sticky-header--thead__sticky-column--ZIndex: calc(var(--pf-c-table__sticky-column--ZIndex) + 1);
4171
+ }
4172
+
4173
+ .pf-c-table .pf-c-table__sticky-column {
4174
+ position: sticky;
4175
+ left: var(--pf-c-table__sticky-column--Left);
4176
+ z-index: var(--pf-c-table__sticky-column--ZIndex);
4177
+ min-width: var(--pf-c-table__sticky-column--MinWidth);
4178
+ background-color: var(--pf-c-table__sticky-column--BackgroundColor);
4179
+ background-clip: padding-box;
4180
+ }
4181
+
4182
+ .pf-c-table .pf-c-table__sticky-column.pf-m-border-right::before {
4183
+ --pf-c-table--cell--m-border-right--before--BorderRightWidth: var(--pf-c-table__sticky-column--m-border-right--before--BorderRightWidth);
4184
+ --pf-c-table--cell--m-border-right--before--BorderRightColor: var(--pf-c-table__sticky-column--m-border-right--before--BorderRightColor);
4185
+ }
4186
+
4187
+ .pf-c-table .pf-c-table__sticky-column.pf-m-border-left::before {
4188
+ --pf-c-table--cell--m-border-left--before--BorderLeftWidth: var(--pf-c-table__sticky-column--m-border-left--before--BorderLeftWidth);
4189
+ --pf-c-table--cell--m-border-left--before--BorderLeftColor: var(--pf-c-table__sticky-column--m-border-left--before--BorderLeftColor);
4190
+ }
4191
+
4192
+ .pf-c-table.pf-m-sticky-header {
4193
+ --pf-c-table--cell--Overflow: visible;
4194
+ }
4195
+
4196
+ .pf-c-table.pf-m-sticky-header thead .pf-c-table__sticky-column {
4197
+ z-index: var(--pf-c-table--m-sticky-header--thead__sticky-column--ZIndex);
4198
+ }
4199
+
4200
+ .pf-c-scroll-outer-wrapper {
4201
+ --pf-c-scroll-outer-wrapper--MinHeight: 25rem;
4202
+ display: flex;
4203
+ flex-direction: column;
4204
+ max-width: 100%;
4205
+ min-height: var(--pf-c-scroll-outer-wrapper--MinHeight);
4206
+ max-height: 100%;
4207
+ overflow: hidden;
4208
+ }
4209
+
4210
+ .pf-c-scroll-inner-wrapper {
4211
+ display: flex;
4212
+ flex-direction: column;
4213
+ max-width: 100%;
4214
+ max-height: 100%;
4215
+ overflow: auto;
4216
+ }
4217
+
4161
4218
  .pf-c-form {
4162
4219
  --pf-c-form--GridGap: var(--pf-global--gutter--md);
4163
4220
  --pf-c-form__group--m-action--MarginTop: var(--pf-global--spacer--xl);
@@ -5280,10 +5337,10 @@ label.pf-c-check, .pf-c-check__label,
5280
5337
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--200);
5281
5338
  --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-global--BorderColor--300);
5282
5339
  --pf-c-dropdown__toggle--hover--before--BorderBottomColor: var(--pf-global--active-color--100);
5283
- --pf-c-dropdown__toggle--active--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
5284
- --pf-c-dropdown__toggle--active--before--BorderBottomColor: var(--pf-global--active-color--100);
5285
5340
  --pf-c-dropdown__toggle--focus--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
5286
5341
  --pf-c-dropdown__toggle--focus--before--BorderBottomColor: var(--pf-global--active-color--100);
5342
+ --pf-c-dropdown__toggle--active--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
5343
+ --pf-c-dropdown__toggle--active--before--BorderBottomColor: var(--pf-global--active-color--100);
5287
5344
  --pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
5288
5345
  --pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor: var(--pf-global--active-color--100);
5289
5346
  --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
@@ -5297,9 +5354,22 @@ label.pf-c-check, .pf-c-check__label,
5297
5354
  --pf-c-dropdown__toggle--m-primary--BorderRadius: var(--pf-global--BorderRadius--sm);
5298
5355
  --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--100);
5299
5356
  --pf-c-dropdown__toggle--m-primary--hover--BackgroundColor: var(--pf-global--primary-color--200);
5300
- --pf-c-dropdown__toggle--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
5301
5357
  --pf-c-dropdown__toggle--m-primary--focus--BackgroundColor: var(--pf-global--primary-color--200);
5358
+ --pf-c-dropdown__toggle--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
5302
5359
  --pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--200);
5360
+ --pf-c-dropdown__toggle--m-secondary--Color: var(--pf-global--primary-color--100);
5361
+ --pf-c-dropdown__toggle--m-secondary--BorderRadius: var(--pf-global--BorderRadius--sm);
5362
+ --pf-c-dropdown__toggle--m-secondary--BackgroundColor: transparent;
5363
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--sm);
5364
+ --pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth: var(--pf-global--BorderWidth--md);
5365
+ --pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth: var(--pf-global--BorderWidth--md);
5366
+ --pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth: var(--pf-global--BorderWidth--md);
5367
+ --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
5368
+ --pf-c-dropdown__toggle--m-secondary--hover--before--BorderColor: var(--pf-global--primary-color--100);
5369
+ --pf-c-dropdown__toggle--m-secondary--focus--before--BorderColor: var(--pf-global--primary-color--100);
5370
+ --pf-c-dropdown__toggle--m-secondary--active--before--BorderColor: var(--pf-global--primary-color--100);
5371
+ --pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--md);
5372
+ --pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
5303
5373
  --pf-c-dropdown__toggle-button--Color: var(--pf-global--Color--100);
5304
5374
  --pf-c-dropdown__toggle--m-split-button--child--PaddingTop: var(--pf-global--spacer--form-element);
5305
5375
  --pf-c-dropdown__toggle--m-split-button--child--PaddingRight: var(--pf-global--spacer--xs);
@@ -5313,6 +5383,14 @@ label.pf-c-check, .pf-c-check__label,
5313
5383
  --pf-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: calc(-1 * var(--pf-global--BorderWidth--sm));
5314
5384
  --pf-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY: -0.0625rem;
5315
5385
  --pf-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft: var(--pf-global--spacer--sm);
5386
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius: var(--pf-global--BorderRadius--sm);
5387
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-global--primary-color--100);
5388
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-global--primary-color--200);
5389
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor: var(--pf-global--primary-color--200);
5390
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--active--BackgroundColor: var(--pf-global--primary-color--200);
5391
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--m-expanded--BackgroundColor: var(--pf-global--primary-color--200);
5392
+ --pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftColor: var(--pf-global--primary-color--200);
5393
+ --pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
5316
5394
  --pf-c-dropdown__toggle-icon--LineHeight: var(--pf-global--LineHeight--md);
5317
5395
  --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-global--spacer--sm);
5318
5396
  --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-global--spacer--md);
@@ -5413,6 +5491,10 @@ label.pf-c-check, .pf-c-check__label,
5413
5491
  border-bottom-width: var(--pf-c-dropdown--m-full-height__toggle--hover--before--BorderBottomWidth);
5414
5492
  }
5415
5493
 
5494
+ .pf-c-dropdown.pf-m-expanded {
5495
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--m-expanded--BackgroundColor);
5496
+ }
5497
+
5416
5498
  .pf-c-dropdown__toggle {
5417
5499
  position: relative;
5418
5500
  display: flex;
@@ -5490,6 +5572,10 @@ label.pf-c-check, .pf-c-check__label,
5490
5572
  --pf-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: 0;
5491
5573
  }
5492
5574
 
5575
+ .pf-c-dropdown__toggle.pf-m-split-button.pf-m-action.pf-m-primary > :not(:first-child) {
5576
+ border-left: var(--pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftWidth) solid var(--pf-c-dropdown__toggle--m-split-button--m-primary--m-action--child--BorderLeftColor);
5577
+ }
5578
+
5493
5579
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check {
5494
5580
  display: flex;
5495
5581
  align-items: center;
@@ -5511,21 +5597,53 @@ label.pf-c-check, .pf-c-check__label,
5511
5597
  margin-left: var(--pf-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft);
5512
5598
  }
5513
5599
 
5514
- .pf-c-dropdown__toggle:not(.pf-m-action):hover::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:hover::before {
5600
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) {
5601
+ --pf-c-dropdown__toggle--before--BorderWidth: 0;
5602
+ --pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth: 0;
5603
+ }
5604
+
5605
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > * {
5606
+ background-color: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor);
5607
+ border: 0;
5608
+ }
5609
+
5610
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
5611
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--hover--BackgroundColor);
5612
+ }
5613
+
5614
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
5615
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
5616
+ }
5617
+
5618
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *.pf-m-active {
5619
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
5620
+ }
5621
+
5622
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :first-child {
5623
+ border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
5624
+ border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
5625
+ }
5626
+
5627
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :last-child {
5628
+ border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
5629
+ border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
5630
+ }
5631
+
5632
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):hover::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:hover::before {
5515
5633
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--hover--before--BorderBottomColor);
5516
5634
  }
5517
5635
 
5518
- .pf-c-dropdown__toggle:not(.pf-m-action):active::before, .pf-c-dropdown__toggle:not(.pf-m-action).pf-m-active::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:active::before {
5636
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):active::before, .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary).pf-m-active::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:active::before {
5519
5637
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--active--before--BorderBottomColor);
5520
5638
  border-bottom-width: var(--pf-c-dropdown__toggle--active--before--BorderBottomWidth);
5521
5639
  }
5522
5640
 
5523
- .pf-c-dropdown__toggle:not(.pf-m-action):focus::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:focus::before {
5641
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):focus::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:focus::before {
5524
5642
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--focus--before--BorderBottomColor);
5525
5643
  border-bottom-width: var(--pf-c-dropdown__toggle--focus--before--BorderBottomWidth);
5526
5644
  }
5527
5645
 
5528
- .pf-m-expanded > .pf-c-dropdown__toggle:not(.pf-m-action)::before, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
5646
+ .pf-m-expanded > .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary)::before, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
5529
5647
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
5530
5648
  border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
5531
5649
  }
@@ -5545,7 +5663,7 @@ label.pf-c-check, .pf-c-check__label,
5545
5663
  border: 0;
5546
5664
  }
5547
5665
 
5548
- .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
5666
+ .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
5549
5667
  --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
5550
5668
  }
5551
5669
 
@@ -5554,11 +5672,15 @@ label.pf-c-check, .pf-c-check__label,
5554
5672
  }
5555
5673
 
5556
5674
  .pf-c-dropdown__toggle.pf-m-primary {
5557
- --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
5558
5675
  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--BackgroundColor);
5676
+ --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
5559
5677
  border-radius: var(--pf-c-dropdown__toggle--m-primary--BorderRadius);
5560
5678
  }
5561
5679
 
5680
+ .pf-c-dropdown__toggle.pf-m-primary:not(.pf-m-disabled) {
5681
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
5682
+ }
5683
+
5562
5684
  .pf-c-dropdown__toggle.pf-m-primary::before {
5563
5685
  border: 0;
5564
5686
  }
@@ -5567,18 +5689,46 @@ label.pf-c-check, .pf-c-check__label,
5567
5689
  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--hover--BackgroundColor);
5568
5690
  }
5569
5691
 
5570
- .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
5571
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
5572
- }
5573
-
5574
5692
  .pf-c-dropdown__toggle.pf-m-primary:focus {
5575
5693
  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--focus--BackgroundColor);
5576
5694
  }
5577
5695
 
5696
+ .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
5697
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
5698
+ }
5699
+
5578
5700
  .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-primary {
5579
5701
  --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor);
5580
5702
  }
5581
5703
 
5704
+ .pf-c-dropdown__toggle.pf-m-secondary {
5705
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-secondary--Color);
5706
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-secondary--BackgroundColor);
5707
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
5708
+ }
5709
+
5710
+ .pf-c-dropdown__toggle.pf-m-secondary::before {
5711
+ border: var(--pf-c-dropdown__toggle--m-secondary--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--before--BorderColor);
5712
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
5713
+ }
5714
+
5715
+ .pf-c-dropdown__toggle.pf-m-secondary:hover {
5716
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth);
5717
+ }
5718
+
5719
+ .pf-c-dropdown__toggle.pf-m-secondary:focus {
5720
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth);
5721
+ }
5722
+
5723
+ .pf-c-dropdown__toggle.pf-m-secondary:active, .pf-c-dropdown__toggle.pf-m-secondary.pf-m-active {
5724
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth);
5725
+ }
5726
+
5727
+ .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-secondary {
5728
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth);
5729
+ --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor);
5730
+ }
5731
+
5582
5732
  .pf-c-dropdown__toggle > .pf-c-badge {
5583
5733
  --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft);
5584
5734
  --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginRight);
@@ -5893,7 +6043,8 @@ label.pf-c-check, .pf-c-check__label,
5893
6043
  --pf-c-form-control--m-icon--m-warning--BackgroundSize: var(--pf-c-form-control--m-warning--BackgroundSize), var(--pf-c-form-control--m-icon--BackgroundSizeX) var(--pf-c-form-control--m-icon--BackgroundSizeY);
5894
6044
  --pf-c-form-control--m-calendar--BackgroundUrl: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%236a6e73' d='M0 464c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V192H0v272zm320-196c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zM192 268c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zM64 268c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H76c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H76c-6.6 0-12-5.4-12-12v-40zM400 64h-48V16c0-8.8-7.2-16-16-16h-32c-8.8 0-16 7.2-16 16v48H160V16c0-8.8-7.2-16-16-16h-32c-8.8 0-16 7.2-16 16v48H48C21.5 64 0 85.5 0 112v48h448v-48c0-26.5-21.5-48-48-48z'/%3E%3C/svg%3E");
5895
6045
  --pf-c-form-control--m-clock--BackgroundUrl: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%236a6e73' d='M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm0 448c-110.5 0-200-89.5-200-200S145.5 56 256 56s200 89.5 200 200-89.5 200-200 200zm61.8-104.4l-84.9-61.7c-3.1-2.3-4.9-5.9-4.9-9.7V116c0-6.6 5.4-12 12-12h32c6.6 0 12 5.4 12 12v141.7l66.8 48.6c5.4 3.9 6.5 11.4 2.6 16.8L334.6 349c-3.9 5.3-11.4 6.5-16.8 2.6z'/%3E%3C/svg%3E");
5896
- --pf-c-form-control__select--PaddingRight: var(--pf-global--spacer--lg);
6046
+ --pf-c-form-control__select--PaddingRight: calc(var(--pf-global--spacer--lg) + var(--pf-c-form-control--BorderWidth) + var(--pf-c-form-control--BorderWidth));
6047
+ --pf-c-form-control__select--PaddingLeft: calc(var(--pf-global--spacer--sm) - var(--pf-c-form-control--BorderWidth));
5897
6048
  --pf-c-form-control__select--BackgroundUrl: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23urrentColor' d='M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z'/%3E%3C/svg%3E");
5898
6049
  --pf-c-form-control__select--BackgroundSize: .625em;
5899
6050
  --pf-c-form-control__select--BackgroundPositionX: calc(100% - var(--pf-global--spacer--md) + 1px);
@@ -6045,11 +6196,18 @@ label.pf-c-check, .pf-c-check__label,
6045
6196
 
6046
6197
  select.pf-c-form-control {
6047
6198
  --pf-c-form-control--PaddingRight: var(--pf-c-form-control__select--PaddingRight);
6199
+ --pf-c-form-control--PaddingLeft: var(--pf-c-form-control__select--PaddingLeft);
6048
6200
  background-image: var(--pf-c-form-control__select--BackgroundUrl);
6049
6201
  background-position: var(--pf-c-form-control__select--BackgroundPosition);
6050
6202
  background-size: var(--pf-c-form-control__select--BackgroundSize);
6051
6203
  }
6052
6204
 
6205
+ @-moz-document url-prefix() {
6206
+ select.pf-c-form-control {
6207
+ --pf-c-form-control--PaddingRight: calc(var(--pf-c-form-control__select--PaddingRight) - 1px);
6208
+ --pf-c-form-control--PaddingLeft: calc(var(--pf-c-form-control__select--PaddingLeft) - 4px);
6209
+ }
6210
+ }
6053
6211
  select.pf-c-form-control[aria-invalid=true] {
6054
6212
  --pf-c-form-control--PaddingRight: var(--pf-c-form-control__select--invalid--PaddingRight);
6055
6213
  --pf-c-form-control--invalid--BackgroundPosition: var(--pf-c-form-control__select--invalid--BackgroundPosition);
@@ -11951,6 +12109,10 @@ button.pf-c-breadcrumb__link {
11951
12109
  overflow-anchor: none;
11952
12110
  }
11953
12111
 
12112
+ .pf-c-dual-list-selector__list-item:focus {
12113
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
12114
+ }
12115
+
11954
12116
  .pf-c-dual-list-selector__list-item.pf-m-expandable {
11955
12117
  --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__item--m-expandable--PaddingLeft);
11956
12118
  }
@@ -11975,10 +12137,6 @@ button.pf-c-breadcrumb__link {
11975
12137
  --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--hover--BackgroundColor);
11976
12138
  }
11977
12139
 
11978
- .pf-c-dual-list-selector__list-item-row:focus-within {
11979
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
11980
- }
11981
-
11982
12140
  .pf-c-dual-list-selector__list-item-row.pf-m-selected {
11983
12141
  --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
11984
12142
  }
@@ -12028,9 +12186,7 @@ button.pf-c-breadcrumb__link {
12028
12186
  position: relative;
12029
12187
  width: 100%;
12030
12188
  padding: var(--pf-c-dual-list-selector__item--PaddingTop) var(--pf-c-dual-list-selector__item--PaddingRight) var(--pf-c-dual-list-selector__item--PaddingBottom) var(--pf-c-dual-list-selector__item--PaddingLeft);
12031
- text-align: left;
12032
12189
  cursor: pointer;
12033
- border: 0;
12034
12190
  }
12035
12191
 
12036
12192
  .pf-c-dual-list-selector__item-count {
@@ -13867,17 +14023,7 @@ ul.pf-c-list {
13867
14023
  --pf-c-list--m-bordered--li--BorderBottomWidth: 0;
13868
14024
  }
13869
14025
 
13870
- .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light {
13871
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
13872
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
13873
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
13874
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
13875
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
13876
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
13877
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
13878
- }
13879
-
13880
- .pf-c-masthead {
14026
+ .pf-c-login__footer, .pf-c-login__header {
13881
14027
  --pf-global--Color--100: var(--pf-global--Color--light-100);
13882
14028
  --pf-global--Color--200: var(--pf-global--Color--light-200);
13883
14029
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
@@ -13887,11 +14033,11 @@ ul.pf-c-list {
13887
14033
  --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
13888
14034
  }
13889
14035
 
13890
- .pf-c-masthead .pf-c-card {
14036
+ .pf-c-login__footer .pf-c-card, .pf-c-login__header .pf-c-card {
13891
14037
  --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
13892
14038
  }
13893
14039
 
13894
- .pf-c-masthead .pf-c-button {
14040
+ .pf-c-login__footer .pf-c-button, .pf-c-login__header .pf-c-button {
13895
14041
  --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
13896
14042
  --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
13897
14043
  --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
@@ -13910,504 +14056,434 @@ ul.pf-c-list {
13910
14056
  --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
13911
14057
  }
13912
14058
 
13913
- .pf-c-masthead {
13914
- --pf-c-masthead--PaddingLeft: var(--pf-c-masthead--inset);
13915
- --pf-c-masthead--PaddingRight: var(--pf-c-masthead--inset);
13916
- --pf-c-masthead--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
13917
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
13918
- --pf-c-masthead--xl--inset: var(--pf-global--spacer--lg);
13919
- --pf-c-masthead--m-display-stack--GridTemplateColumns: max-content 1fr;
13920
- --pf-c-masthead--m-display-stack__main--GridColumn: -1 / 1;
13921
- --pf-c-masthead--m-display-stack__main--MinHeight: 4.375rem;
13922
- --pf-c-masthead--m-display-stack__main--Order: -1;
13923
- --pf-c-masthead--m-display-stack__main--FlexBasis: 100%;
13924
- --pf-c-masthead--m-display-stack__main--PaddingTop: var(--pf-global--spacer--sm);
13925
- --pf-c-masthead--m-display-stack__main--PaddingBottom: var(--pf-global--spacer--sm);
13926
- --pf-c-masthead--m-display-stack__main--MarginRight: 0;
13927
- --pf-c-masthead--m-display-stack__main--before--BorderBottom: var(--pf-c-masthead__main--before--BorderBottomWidth) solid var(--pf-c-masthead__main--before--BorderBottomColor);
13928
- --pf-c-masthead--m-display-stack__toggle--GridColumn: 1;
13929
- --pf-c-masthead--m-display-stack__content--GridColumn: 2;
13930
- --pf-c-masthead--m-display-stack__content--MinHeight: 4.375rem;
13931
- --pf-c-masthead--m-display-stack__content--Order: 1;
13932
- --pf-c-masthead--m-display-stack__content--PaddingTop: 0;
13933
- --pf-c-masthead--m-display-stack__content--PaddingBottom: 0;
13934
- --pf-c-masthead--m-display-stack__content--MarginLeft: 0;
13935
- --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight: calc(var(--pf-c-masthead--inset) * -1);
13936
- --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-c-masthead--inset) * -1);
13937
- --pf-c-masthead--m-display-inline--GridTemplateColumns: max-content max-content 1fr;
13938
- --pf-c-masthead--m-display-inline__main--GridColumn: 2;
13939
- --pf-c-masthead--m-display-inline__main--MinHeight: 4.375rem;
13940
- --pf-c-masthead--m-display-inline__main--Order: 0;
13941
- --pf-c-masthead--m-display-inline__main--FlexBasis: auto;
13942
- --pf-c-masthead--m-display-inline__main--PaddingTop: 0;
13943
- --pf-c-masthead--m-display-inline__main--PaddingBottom: 0;
13944
- --pf-c-masthead--m-display-inline__main--MarginRight: calc(var(--pf-global--spacer--lg) / 2);
13945
- --pf-c-masthead--m-display-inline__main--BorderBottom: 0;
13946
- --pf-c-masthead--m-display-inline__toggle--GridColumn: 1;
13947
- --pf-c-masthead--m-display-inline__content--GridColumn: 3;
13948
- --pf-c-masthead--m-display-inline__content--MinHeight: 4.375rem;
13949
- --pf-c-masthead--m-display-inline__content--Order: 0;
13950
- --pf-c-masthead--m-display-inline__content--PaddingTop: 0;
13951
- --pf-c-masthead--m-display-inline__content--PaddingBottom: 0;
13952
- --pf-c-masthead--m-display-inline__content--MarginLeft: calc(var(--pf-global--spacer--lg) / 2);
13953
- --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight: 0;
13954
- --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft: 0;
13955
- --pf-c-masthead__main--before--Right: calc(var(--pf-c-masthead--inset) * -1);
13956
- --pf-c-masthead__main--before--Left: calc(var(--pf-c-masthead--inset) * -1);
13957
- --pf-c-masthead__main--before--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
13958
- --pf-c-masthead__main--before--BorderBottomColor: var(--pf-global--palette--black-600);
13959
- --pf-c-masthead__toggle--MarginRight: var(--pf-global--spacer--sm);
13960
- --pf-c-masthead__toggle--MarginLeft: calc(var(--pf-global--spacer--md) * -1);
13961
- --pf-c-masthead__toggle--c-button--FontSize: var(--pf-global--FontSize--2xl);
13962
- --pf-c-masthead--m-light--BackgroundColor: var(--pf-global--BackgroundColor--100);
13963
- --pf-c-masthead--m-light__main--BorderBottomColor: var(--pf-global--BorderColor--300);
13964
- --pf-c-masthead--m-light-200--BackgroundColor: var(--pf-global--BackgroundColor--200);
13965
- --pf-c-masthead--m-light-200__main--BorderBottomColor: var(--pf-global--BorderColor--100);
13966
- --pf-c-masthead--c-toolbar__item--Display: flex;
13967
- --pf-c-masthead--item-border-color--base: var(--pf-global--palette--black-800);
13968
- --pf-c-masthead--c-context-selector--Width: auto;
13969
- --pf-c-masthead--c-context-selector__toggle--BorderTopColor: transparent;
13970
- --pf-c-masthead--c-context-selector__toggle--BorderRightColor: transparent;
13971
- --pf-c-masthead--c-context-selector__toggle--BorderBottomColor: transparent;
13972
- --pf-c-masthead--c-context-selector__toggle--BorderLeftColor: transparent;
13973
- --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
13974
- --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
13975
- --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor: transparent;
13976
- --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor: transparent;
13977
- --pf-c-masthead--c-dropdown__toggle--before--BorderBottomColor: transparent;
13978
- --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor: transparent;
13979
- --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
13980
- --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
13981
- --pf-c-masthead--c-menu-toggle--before--BorderTopColor: transparent;
13982
- --pf-c-masthead--c-menu-toggle--before--BorderRightColor: transparent;
13983
- --pf-c-masthead--c-menu-toggle--before--BorderBottomColor: transparent;
13984
- --pf-c-masthead--c-menu-toggle--before--BorderLeftColor: transparent;
13985
- --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
13986
- --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
13987
- --pf-c-masthead--c-toolbar__content--PaddingRight: 0;
13988
- --pf-c-masthead--c-toolbar__content--PaddingLeft: 0;
13989
- --pf-c-masthead--c-toolbar__expandable-content--PaddingTop: var(--pf-global--spacer--md);
13990
- --pf-c-masthead--c-toolbar__expandable-content--PaddingRight: var(--pf-c-masthead--inset);
13991
- --pf-c-masthead--c-toolbar__expandable-content--PaddingBottom: var(--pf-global--spacer--md);
13992
- --pf-c-masthead--c-toolbar__expandable-content--PaddingLeft: var(--pf-c-masthead--inset);
13993
- --pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth: var(--pf-global--BorderWidth--sm);
13994
- --pf-c-masthead--c-toolbar__expandable-content--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
13995
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
13996
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
13997
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
13998
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
13999
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14000
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14001
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14002
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14003
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14004
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14005
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14006
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14007
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14008
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14009
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14010
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14011
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14012
- color: var(--pf-global--Color--100);
14013
- position: relative;
14014
- display: grid;
14015
- grid-template-columns: var(--pf-c-masthead--GridTemplateColumns);
14016
- align-items: center;
14017
- min-width: 0;
14018
- padding-right: var(--pf-c-masthead--PaddingRight);
14019
- padding-left: var(--pf-c-masthead--PaddingLeft);
14020
- background-color: var(--pf-c-masthead--BackgroundColor);
14021
- }
14022
-
14023
- @media screen and (min-width: 1200px) {
14024
- .pf-c-masthead {
14025
- --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
14026
- }
14027
- }
14028
- @media screen and (min-width: 768px) {
14029
- .pf-c-masthead {
14030
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14031
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14032
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14033
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14034
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14035
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14036
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14037
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14038
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14039
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14040
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14041
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14042
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14043
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14044
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14045
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14046
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14047
- }
14048
- }
14049
- .pf-c-masthead.pf-m-light {
14050
- color: var(--pf-global--Color--100);
14051
- --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light--BackgroundColor);
14052
- --pf-c-masthead__main--BorderBottomColor: var(--pf-c-masthead--m-light__main--BorderBottomColor);
14053
- }
14054
-
14055
- .pf-c-masthead.pf-m-light-200 {
14056
- color: var(--pf-global--Color--100);
14057
- --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light-200--BackgroundColor);
14058
- --pf-c-masthead__main--BorderBottomColor: var(--pf-c-masthead--m-light-200__main--BorderBottomColor);
14059
- }
14060
-
14061
- .pf-c-masthead .pf-c-toolbar {
14062
- --pf-c-toolbar__content--PaddingRight: var(--pf-c-masthead--c-toolbar__content--PaddingRight);
14063
- --pf-c-toolbar__content--PaddingLeft: var(--pf-c-masthead--c-toolbar__content--PaddingLeft);
14064
- --pf-c-toolbar__expandable-content--PaddingTop: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingTop);
14065
- --pf-c-toolbar__expandable-content--PaddingRight: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingRight);
14066
- --pf-c-toolbar__expandable-content--PaddingBottom: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingBottom);
14067
- --pf-c-toolbar__expandable-content--PaddingLeft: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingLeft);
14068
- width: 100%;
14059
+ .pf-c-login {
14060
+ --pf-c-login--PaddingTop: var(--pf-global--spacer--lg);
14061
+ --pf-c-login--PaddingBottom: var(--pf-global--spacer--lg);
14062
+ --pf-c-login--xl--BackgroundImage: none;
14063
+ --pf-c-login__container--xl--GridColumnGap: var(--pf-global--spacer--3xl);
14064
+ --pf-c-login__container--MaxWidth: 31.25rem;
14065
+ --pf-c-login__container--xl--MaxWidth: none;
14066
+ --pf-c-login__container--PaddingLeft: 6.125rem;
14067
+ --pf-c-login__container--PaddingRight: 6.125rem;
14068
+ --pf-c-login__container--xl--GridTemplateColumns: 34rem minmax(auto, 34rem);
14069
+ --pf-c-login__header--MarginBottom: var(--pf-global--spacer--md);
14070
+ --pf-c-login__header--PaddingLeft: var(--pf-global--spacer--md);
14071
+ --pf-c-login__header--PaddingRight: var(--pf-global--spacer--md);
14072
+ --pf-c-login__header--xl--MarginBottom: var(--pf-global--spacer--2xl);
14073
+ --pf-c-login__header--xl--MarginTop: var(--pf-global--spacer--3xl);
14074
+ --pf-c-login__header--c-brand--MarginBottom: var(--pf-global--spacer--lg);
14075
+ --pf-c-login__header--c-brand--xl--MarginBottom: var(--pf-global--spacer--2xl);
14076
+ --pf-c-login__main--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
14077
+ --pf-c-login__main--MarginBottom: var(--pf-global--spacer--lg);
14078
+ --pf-c-login__main-header--PaddingTop: var(--pf-global--spacer--2xl);
14079
+ --pf-c-login__main-header--PaddingRight: var(--pf-global--spacer--xl);
14080
+ --pf-c-login__main-header--PaddingBottom: var(--pf-global--spacer--md);
14081
+ --pf-c-login__main-header--PaddingLeft: var(--pf-global--spacer--xl);
14082
+ --pf-c-login__main-header--md--PaddingRight: var(--pf-global--spacer--2xl);
14083
+ --pf-c-login__main-header--md--PaddingLeft: var(--pf-global--spacer--2xl);
14084
+ --pf-c-login__main-header--ColumnGap: var(--pf-global--spacer--md);
14085
+ --pf-c-login__main-header--RowGap: var(--pf-global--spacer--md);
14086
+ --pf-c-login__main-header-desc--MarginBottom: var(--pf-global--spacer--sm);
14087
+ --pf-c-login__main-header-desc--md--MarginBottom: 0;
14088
+ --pf-c-login__main-header-desc--FontSize: var(--pf-global--FontSize--sm);
14089
+ --pf-c-login__main-body--PaddingRight: var(--pf-global--spacer--xl);
14090
+ --pf-c-login__main-body--PaddingBottom: var(--pf-global--spacer--xl);
14091
+ --pf-c-login__main-body--PaddingLeft: var(--pf-global--spacer--xl);
14092
+ --pf-c-login__main-body--md--PaddingRight: var(--pf-global--spacer--2xl);
14093
+ --pf-c-login__main-body--md--PaddingLeft: var(--pf-global--spacer--2xl);
14094
+ --pf-c-login__main-footer--PaddingBottom: var(--pf-global--spacer--3xl);
14095
+ --pf-c-login__main-footer--c-title--MarginBottom: var(--pf-global--spacer--md);
14096
+ --pf-c-login__main-footer-links--PaddingTop: var(--pf-global--spacer--sm);
14097
+ --pf-c-login__main-footer-links--PaddingRight: var(--pf-global--spacer--3xl);
14098
+ --pf-c-login__main-footer-links--PaddingBottom: var(--pf-global--spacer--xl);
14099
+ --pf-c-login__main-footer-links--PaddingLeft: var(--pf-global--spacer--3xl);
14100
+ --pf-c-login__main-footer-links-item--PaddingRight: var(--pf-global--spacer--md);
14101
+ --pf-c-login__main-footer-links-item--PaddingLeft: var(--pf-global--spacer--md);
14102
+ --pf-c-login__main-footer-links-item--MarginBottom: var(--pf-global--spacer--sm);
14103
+ --pf-c-login__main-footer-links-item-link-svg--Fill: var(--pf-global--icon--Color--light);
14104
+ --pf-c-login__main-footer-links-item-link-svg--Width: var(--pf-global--icon--FontSize--lg);
14105
+ --pf-c-login__main-footer-links-item-link-svg--Height: var(--pf-global--icon--FontSize--lg);
14106
+ --pf-c-login__main-footer-links-item-link-svg--hover--Fill: var(--pf-global--icon--Color--dark);
14107
+ --pf-c-login__main-footer-band--PaddingTop: var(--pf-global--spacer--lg);
14108
+ --pf-c-login__main-footer-band--PaddingRight: var(--pf-global--spacer--md);
14109
+ --pf-c-login__main-footer-band--PaddingBottom: var(--pf-global--spacer--lg);
14110
+ --pf-c-login__main-footer-band--PaddingLeft: var(--pf-global--spacer--md);
14111
+ --pf-c-login__main-footer-band--BackgroundColor: var(--pf-global--BackgroundColor--200);
14112
+ --pf-c-login__main-footer-band-item--PaddingTop: var(--pf-global--spacer--md);
14113
+ --pf-c-login__footer--PaddingLeft: var(--pf-global--spacer--md);
14114
+ --pf-c-login__footer--PaddingRight: var(--pf-global--spacer--md);
14115
+ --pf-c-login__footer--c-list--PaddingTop: var(--pf-global--spacer--md);
14116
+ --pf-c-login__footer--c-list--xl--PaddingTop: var(--pf-global--spacer--2xl);
14117
+ display: flex;
14118
+ justify-content: center;
14119
+ min-height: 100vh;
14120
+ padding-top: var(--pf-c-login--PaddingTop);
14121
+ padding-bottom: var(--pf-c-login--PaddingBottom);
14069
14122
  }
14070
14123
 
14071
- .pf-c-masthead .pf-c-toolbar__content-section {
14072
- flex-wrap: nowrap;
14124
+ @media (min-width: 1200px) {
14125
+ .pf-c-login {
14126
+ --pf-c-login__container--MaxWidth: var(--pf-c-login__container--xl--MaxWidth);
14127
+ }
14073
14128
  }
14074
-
14075
- .pf-c-masthead .pf-c-toolbar__expandable-content {
14076
- border-top: var(--pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth) solid var(--pf-c-masthead--c-toolbar__expandable-content--BorderTopColor);
14129
+ @media (min-width: 576px) {
14130
+ .pf-c-login {
14131
+ --pf-c-login__header--PaddingRight: 0;
14132
+ --pf-c-login__header--PaddingLeft: 0;
14133
+ }
14077
14134
  }
14078
-
14079
- .pf-c-masthead .pf-c-menu-toggle {
14080
- --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--before--BorderTopColor);
14081
- --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--before--BorderRightColor);
14082
- --pf-c-menu-toggle--before--BorderBottomColor: var(--pf-c-masthead--c-menu-toggle--before--BorderBottomColor);
14083
- --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--before--BorderLeftColor);
14135
+ @media (min-width: 1200px) {
14136
+ .pf-c-login {
14137
+ --pf-c-login__header--MarginBottom: var(--pf-c-login__header--xl--MarginBottom);
14138
+ --pf-c-login__header--c-brand--MarginBottom: var(--pf-c-login__header--c-brand--xl--MarginBottom);
14139
+ }
14084
14140
  }
14085
-
14086
- .pf-c-masthead .pf-c-menu-toggle.pf-m-full-height {
14087
- --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderRightColor);
14088
- --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderLeftColor);
14141
+ @media (min-width: 1200px) {
14142
+ .pf-c-login {
14143
+ --pf-c-login__main--MarginBottom: 0;
14144
+ }
14089
14145
  }
14090
-
14091
- .pf-c-masthead .pf-c-context-selector {
14092
- --pf-c-context-selector--Width: var(--pf-c-masthead--c-context-selector--Width);
14093
- --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector__toggle--BorderTopColor);
14094
- --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector__toggle--BorderRightColor);
14095
- --pf-c-context-selector__toggle--BorderBottomColor: var(--pf-c-masthead--c-context-selector__toggle--BorderBottomColor);
14096
- --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector__toggle--BorderLeftColor);
14146
+ @media (min-width: 768px) {
14147
+ .pf-c-login {
14148
+ --pf-c-login__main-header--PaddingRight: var(--pf-c-login__main-header--md--PaddingRight);
14149
+ --pf-c-login__main-header--PaddingLeft: var(--pf-c-login__main-header--md--PaddingLeft);
14150
+ --pf-c-login__main-header-desc--MarginBottom: var(--pf-c-login__main-header-desc--md--MarginBottom);
14151
+ }
14097
14152
  }
14098
-
14099
- .pf-c-masthead .pf-c-context-selector.pf-m-full-height {
14100
- --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderRightColor);
14101
- --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderLeftColor);
14153
+ @media (min-width: 768px) {
14154
+ .pf-c-login {
14155
+ --pf-c-login__main-body--PaddingRight: var(--pf-c-login__main-body--md--PaddingRight);
14156
+ --pf-c-login__main-body--PaddingLeft: var(--pf-c-login__main-body--md--PaddingLeft);
14157
+ }
14102
14158
  }
14103
-
14104
- .pf-c-masthead .pf-c-dropdown {
14105
- --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderTopColor);
14106
- --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderRightColor);
14107
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderBottomColor);
14108
- --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor);
14159
+ @media (min-width: 576px) {
14160
+ .pf-c-login {
14161
+ --pf-c-login__footer--PaddingRight: 0;
14162
+ --pf-c-login__footer--PaddingLeft: 0;
14163
+ }
14109
14164
  }
14110
-
14111
- .pf-c-masthead .pf-c-dropdown.pf-m-full-height {
14112
- --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor);
14113
- --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor);
14165
+ @media (min-width: 1200px) {
14166
+ .pf-c-login {
14167
+ --pf-c-login__footer--c-list--PaddingTop: var(--pf-c-login__footer--c-list--xl--PaddingTop);
14168
+ }
14114
14169
  }
14115
-
14116
- .pf-c-masthead__main {
14117
- position: relative;
14118
- display: flex;
14119
- flex-basis: var(--pf-c-masthead__main--FlexBasis);
14120
- align-items: center;
14121
- align-self: stretch;
14122
- order: var(--pf-c-masthead__main--Order);
14123
- min-height: var(--pf-c-masthead__main--MinHeight);
14124
- padding-top: var(--pf-c-masthead__main--PaddingTop);
14125
- padding-bottom: var(--pf-c-masthead__main--PaddingBottom);
14126
- margin-right: var(--pf-c-masthead__main--MarginRight);
14127
- grid-column: var(--pf-c-masthead__main--GridColumn);
14170
+ @media (min-width: 1200px) {
14171
+ .pf-c-login {
14172
+ background-image: var(--pf-c-login--xl--BackgroundImage);
14173
+ }
14128
14174
  }
14129
-
14130
- .pf-c-masthead__main::before {
14131
- position: absolute;
14132
- right: var(--pf-c-masthead__main--before--Right);
14133
- bottom: 0;
14134
- left: var(--pf-c-masthead__main--before--Left);
14135
- content: "";
14136
- border-bottom: var(--pf-c-masthead__main--before--BorderBottom);
14175
+ @media (min-width: 576px) {
14176
+ .pf-c-login {
14177
+ align-items: center;
14178
+ }
14137
14179
  }
14138
-
14139
- .pf-c-masthead__main:last-child {
14140
- --pf-c-masthead__main--MarginRight: 0;
14180
+ .pf-c-login__container {
14181
+ width: 100%;
14182
+ max-width: var(--pf-c-login__container--MaxWidth);
14141
14183
  }
14142
14184
 
14143
- .pf-c-masthead__content {
14144
- display: flex;
14145
- flex-grow: 1;
14146
- align-items: center;
14147
- align-self: stretch;
14148
- order: var(--pf-c-masthead__content--Order);
14149
- min-height: var(--pf-c-masthead__content--MinHeight);
14150
- padding-top: var(--pf-c-masthead__content--PaddingTop);
14151
- padding-bottom: var(--pf-c-masthead__content--PaddingBottom);
14152
- margin-left: var(--pf-c-masthead__content--MarginLeft);
14153
- grid-column: var(--pf-c-masthead__content--GridColumn);
14154
- grid-column-end: -1;
14155
- flex-shrink: 1;
14185
+ @media (min-width: 1200px) {
14186
+ .pf-c-login__container {
14187
+ display: grid;
14188
+ justify-content: center;
14189
+ grid-column-gap: var(--pf-c-login__container--xl--GridColumnGap);
14190
+ grid-template-columns: var(--pf-c-login__container--xl--GridTemplateColumns);
14191
+ grid-template-areas: "main header" "main footer" "main .";
14192
+ padding-right: var(--pf-c-login__container--PaddingRight);
14193
+ padding-left: var(--pf-c-login__container--PaddingLeft);
14194
+ }
14156
14195
  }
14157
-
14158
- .pf-c-masthead__content:only-child {
14159
- --pf-c-masthead__content--MarginLeft: 0;
14196
+ .pf-c-login__header {
14197
+ color: var(--pf-global--Color--100);
14198
+ grid-area: header;
14199
+ padding-right: var(--pf-c-login__header--PaddingRight);
14200
+ padding-left: var(--pf-c-login__header--PaddingLeft);
14160
14201
  }
14161
14202
 
14162
- .pf-c-masthead__content .pf-c-nav.pf-m-horizontal {
14163
- margin-right: var(--pf-c-masthead__content--c-nav--m-horizontal--MarginRight);
14164
- margin-left: var(--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft);
14203
+ @media (min-width: 1200px) {
14204
+ .pf-c-login__header {
14205
+ margin-top: var(--pf-c-login__header--xl--MarginTop);
14206
+ }
14207
+ }
14208
+ .pf-c-login__header .pf-c-brand {
14209
+ margin-bottom: var(--pf-c-login__header--c-brand--MarginBottom);
14165
14210
  }
14166
14211
 
14167
- .pf-c-masthead__toggle ~ .pf-c-masthead__content {
14168
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-c-masthead__content--MarginLeft) * -1);
14212
+ .pf-c-login__main {
14213
+ margin-bottom: var(--pf-c-login__main--MarginBottom);
14214
+ background-color: var(--pf-c-login__main--BackgroundColor);
14215
+ grid-area: main;
14169
14216
  }
14170
14217
 
14171
- .pf-c-masthead__main,
14172
- .pf-c-masthead__brand,
14173
- .pf-c-masthead__content {
14174
- min-width: 0;
14218
+ .pf-c-login__main > :first-child:not(.pf-c-login__main-header) {
14219
+ padding-top: var(--pf-c-login__main-header--PaddingTop);
14175
14220
  }
14176
14221
 
14177
- .pf-c-masthead__brand {
14178
- display: inline-flex;
14179
- align-self: center;
14222
+ .pf-c-login__main > :last-child:not(.pf-c-login__main-footer) {
14223
+ padding-bottom: var(--pf-c-login__main-footer--PaddingBottom);
14180
14224
  }
14181
14225
 
14182
- .pf-c-masthead__toggle {
14183
- grid-column: var(--pf-c-masthead__toggle--GridColumn);
14184
- align-self: center;
14185
- margin-right: var(--pf-c-masthead__toggle--MarginRight);
14186
- margin-left: var(--pf-c-masthead__toggle--MarginLeft);
14226
+ .pf-c-login__main-header {
14227
+ display: grid;
14228
+ grid-template-columns: 100%;
14229
+ column-gap: var(--pf-c-login__main-header--ColumnGap);
14230
+ row-gap: var(--pf-c-login__main-header--RowGap);
14231
+ align-items: center;
14232
+ 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);
14187
14233
  }
14188
14234
 
14189
- .pf-c-masthead__toggle .pf-c-button {
14190
- --pf-c-button--FontSize: var(--pf-c-masthead__toggle--c-button--FontSize);
14235
+ @media (min-width: 768px) {
14236
+ .pf-c-login__main-header {
14237
+ grid-template-columns: 1fr auto;
14238
+ }
14239
+ }
14240
+ .pf-c-login__main-header .pf-c-dropdown {
14241
+ grid-column: auto;
14242
+ grid-row: auto;
14191
14243
  }
14192
14244
 
14193
- .pf-c-masthead.pf-m-display-stack {
14194
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14195
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14196
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14197
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14198
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14199
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14200
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14201
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14202
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14203
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14204
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14205
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14206
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14207
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14208
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14209
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14210
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14245
+ @media (min-width: 768px) {
14246
+ .pf-c-login__main-header .pf-c-dropdown {
14247
+ grid-column: 2/3;
14248
+ grid-row: 1;
14249
+ }
14211
14250
  }
14212
-
14213
- .pf-c-masthead.pf-m-display-inline {
14214
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14215
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14216
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14217
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14218
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14219
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14220
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14221
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14222
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14223
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14224
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14225
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14226
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14227
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14228
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14229
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14230
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14251
+ .pf-c-login__main-header-desc {
14252
+ margin-bottom: var(--pf-c-login__main-header-desc--MarginBottom);
14253
+ font-size: var(--pf-c-login__main-header-desc--FontSize);
14254
+ grid-column: 1/-1;
14231
14255
  }
14232
14256
 
14233
- .pf-c-masthead.pf-m-inset-none {
14234
- --pf-c-masthead--inset: 0;
14257
+ .pf-c-login__main-body {
14258
+ padding-right: var(--pf-c-login__main-body--PaddingRight);
14259
+ padding-bottom: var(--pf-c-login__main-body--PaddingBottom);
14260
+ padding-left: var(--pf-c-login__main-body--PaddingLeft);
14235
14261
  }
14236
14262
 
14237
- .pf-c-masthead.pf-m-inset-sm {
14238
- --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14263
+ .pf-c-login__main-footer {
14264
+ display: flex;
14265
+ flex-wrap: wrap;
14239
14266
  }
14240
14267
 
14241
- .pf-c-masthead.pf-m-inset-md {
14242
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
14268
+ .pf-c-login__main-footer .pf-c-title {
14269
+ margin-bottom: var(--pf-c-login__main-footer--c-title--MarginBottom);
14270
+ text-align: center;
14243
14271
  }
14244
14272
 
14245
- .pf-c-masthead.pf-m-inset-lg {
14246
- --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14273
+ .pf-c-login__main-footer > * {
14274
+ flex-basis: 100%;
14247
14275
  }
14248
14276
 
14249
- .pf-c-masthead.pf-m-inset-xl {
14250
- --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14277
+ .pf-c-login__main-footer-links {
14278
+ display: flex;
14279
+ flex-wrap: wrap;
14280
+ justify-content: center;
14281
+ 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);
14251
14282
  }
14252
14283
 
14253
- .pf-c-masthead.pf-m-inset-2xl {
14254
- --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14284
+ .pf-c-login__main-footer-links-item {
14285
+ padding-right: var(--pf-c-login__main-footer-links-item--PaddingRight);
14286
+ padding-left: var(--pf-c-login__main-footer-links-item--PaddingLeft);
14287
+ margin-bottom: var(--pf-c-login__main-footer-links-item--MarginBottom);
14255
14288
  }
14256
14289
 
14257
- @media (min-width: 576px) {
14258
- .pf-c-masthead.pf-m-display-stack-on-sm {
14259
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14260
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14261
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14262
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14263
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14264
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14265
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14266
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14267
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14268
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14269
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14270
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14271
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14272
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14273
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14274
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14275
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14276
- }
14290
+ .pf-c-login__main-footer-links-item-link svg {
14291
+ fill: var(--pf-c-login__main-footer-links-item-link-svg--Fill);
14292
+ width: 100%;
14293
+ max-width: var(--pf-c-login__main-footer-links-item-link-svg--Width);
14294
+ height: 100%;
14295
+ max-height: var(--pf-c-login__main-footer-links-item-link-svg--Height);
14296
+ }
14277
14297
 
14278
- .pf-c-masthead.pf-m-display-inline-on-sm {
14279
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14280
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14281
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14282
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14283
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14284
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14285
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14286
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14287
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14288
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14289
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14290
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14291
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14292
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14293
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14294
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14295
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14296
- }
14298
+ .pf-c-login__main-footer-links-item-link:hover svg {
14299
+ fill: var(--pf-c-login__main-footer-links-item-link-svg--hover--Fill);
14297
14300
  }
14298
- @media (min-width: 576px) {
14299
- .pf-c-masthead.pf-m-inset-none-on-sm {
14300
- --pf-c-masthead--inset: 0;
14301
- }
14302
14301
 
14303
- .pf-c-masthead.pf-m-inset-sm-on-sm {
14304
- --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14305
- }
14302
+ .pf-c-login__main-footer-band {
14303
+ 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);
14304
+ text-align: center;
14305
+ background-color: var(--pf-c-login__main-footer-band--BackgroundColor);
14306
+ }
14306
14307
 
14307
- .pf-c-masthead.pf-m-inset-md-on-sm {
14308
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
14309
- }
14308
+ .pf-c-login__main-footer-band > * + * {
14309
+ padding-top: var(--pf-c-login__main-footer-band-item--PaddingTop);
14310
+ }
14310
14311
 
14311
- .pf-c-masthead.pf-m-inset-lg-on-sm {
14312
- --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14313
- }
14312
+ .pf-c-login__footer {
14313
+ color: var(--pf-global--Color--100);
14314
+ grid-area: footer;
14315
+ padding-right: var(--pf-c-login__footer--PaddingRight);
14316
+ padding-left: var(--pf-c-login__footer--PaddingLeft);
14317
+ }
14314
14318
 
14315
- .pf-c-masthead.pf-m-inset-xl-on-sm {
14316
- --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14317
- }
14319
+ .pf-c-login__footer .pf-c-list a {
14320
+ color: unset;
14321
+ }
14318
14322
 
14319
- .pf-c-masthead.pf-m-inset-2xl-on-sm {
14320
- --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14321
- }
14323
+ .pf-c-login__footer .pf-c-list:not(:only-child) {
14324
+ padding-top: var(--pf-c-login__footer--c-list--PaddingTop);
14322
14325
  }
14323
- @media (min-width: 768px) {
14324
- .pf-c-masthead.pf-m-display-stack-on-md {
14325
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14326
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14327
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14328
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14329
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14330
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14331
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14332
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14333
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14334
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14335
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14336
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14337
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14338
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14339
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14340
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14341
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14342
- }
14343
14326
 
14344
- .pf-c-masthead.pf-m-display-inline-on-md {
14345
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14346
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14347
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14348
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14349
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14350
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14351
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14352
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14353
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14354
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14355
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14356
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14357
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14358
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14359
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14360
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14361
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14362
- }
14327
+ .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light {
14328
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
14329
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
14330
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
14331
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
14332
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
14333
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
14334
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
14363
14335
  }
14364
- @media (min-width: 768px) {
14365
- .pf-c-masthead.pf-m-inset-none-on-md {
14366
- --pf-c-masthead--inset: 0;
14367
- }
14368
14336
 
14369
- .pf-c-masthead.pf-m-inset-sm-on-md {
14370
- --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14371
- }
14337
+ .pf-c-masthead {
14338
+ --pf-global--Color--100: var(--pf-global--Color--light-100);
14339
+ --pf-global--Color--200: var(--pf-global--Color--light-200);
14340
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
14341
+ --pf-global--primary-color--100: var(--pf-global--primary-color--light-100);
14342
+ --pf-global--link--Color: var(--pf-global--link--Color--light);
14343
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
14344
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
14345
+ }
14372
14346
 
14373
- .pf-c-masthead.pf-m-inset-md-on-md {
14374
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
14375
- }
14347
+ .pf-c-masthead .pf-c-card {
14348
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
14349
+ }
14376
14350
 
14377
- .pf-c-masthead.pf-m-inset-lg-on-md {
14378
- --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14379
- }
14351
+ .pf-c-masthead .pf-c-button {
14352
+ --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
14353
+ --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
14354
+ --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
14355
+ --pf-c-button--m-primary--active--Color: var(--pf-global--primary-color--dark-100);
14356
+ --pf-c-button--m-primary--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
14357
+ --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
14358
+ --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
14359
+ --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
14360
+ --pf-c-button--m-secondary--Color: var(--pf-global--Color--light-100);
14361
+ --pf-c-button--m-secondary--hover--Color: var(--pf-global--Color--light-100);
14362
+ --pf-c-button--m-secondary--focus--Color: var(--pf-global--Color--light-100);
14363
+ --pf-c-button--m-secondary--active--Color: var(--pf-global--Color--light-100);
14364
+ --pf-c-button--m-secondary--BorderColor: var(--pf-global--Color--light-100);
14365
+ --pf-c-button--m-secondary--hover--BorderColor: var(--pf-global--Color--light-100);
14366
+ --pf-c-button--m-secondary--focus--BorderColor: var(--pf-global--Color--light-100);
14367
+ --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
14368
+ }
14380
14369
 
14381
- .pf-c-masthead.pf-m-inset-xl-on-md {
14382
- --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14383
- }
14370
+ .pf-c-masthead {
14371
+ --pf-c-masthead--PaddingLeft: var(--pf-c-masthead--inset);
14372
+ --pf-c-masthead--PaddingRight: var(--pf-c-masthead--inset);
14373
+ --pf-c-masthead--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
14374
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
14375
+ --pf-c-masthead--xl--inset: var(--pf-global--spacer--lg);
14376
+ --pf-c-masthead--m-display-stack--GridTemplateColumns: max-content 1fr;
14377
+ --pf-c-masthead--m-display-stack__main--GridColumn: -1 / 1;
14378
+ --pf-c-masthead--m-display-stack__main--MinHeight: 4.375rem;
14379
+ --pf-c-masthead--m-display-stack__main--Order: -1;
14380
+ --pf-c-masthead--m-display-stack__main--FlexBasis: 100%;
14381
+ --pf-c-masthead--m-display-stack__main--PaddingTop: var(--pf-global--spacer--sm);
14382
+ --pf-c-masthead--m-display-stack__main--PaddingBottom: var(--pf-global--spacer--sm);
14383
+ --pf-c-masthead--m-display-stack__main--MarginRight: 0;
14384
+ --pf-c-masthead--m-display-stack__main--before--BorderBottom: var(--pf-c-masthead__main--before--BorderBottomWidth) solid var(--pf-c-masthead__main--before--BorderBottomColor);
14385
+ --pf-c-masthead--m-display-stack__toggle--GridColumn: 1;
14386
+ --pf-c-masthead--m-display-stack__content--GridColumn: 2;
14387
+ --pf-c-masthead--m-display-stack__content--MinHeight: 4.375rem;
14388
+ --pf-c-masthead--m-display-stack__content--Order: 1;
14389
+ --pf-c-masthead--m-display-stack__content--PaddingTop: 0;
14390
+ --pf-c-masthead--m-display-stack__content--PaddingBottom: 0;
14391
+ --pf-c-masthead--m-display-stack__content--MarginLeft: 0;
14392
+ --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight: calc(var(--pf-c-masthead--inset) * -1);
14393
+ --pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-c-masthead--inset) * -1);
14394
+ --pf-c-masthead--m-display-inline--GridTemplateColumns: max-content max-content 1fr;
14395
+ --pf-c-masthead--m-display-inline__main--GridColumn: 2;
14396
+ --pf-c-masthead--m-display-inline__main--MinHeight: 4.375rem;
14397
+ --pf-c-masthead--m-display-inline__main--Order: 0;
14398
+ --pf-c-masthead--m-display-inline__main--FlexBasis: auto;
14399
+ --pf-c-masthead--m-display-inline__main--PaddingTop: 0;
14400
+ --pf-c-masthead--m-display-inline__main--PaddingBottom: 0;
14401
+ --pf-c-masthead--m-display-inline__main--MarginRight: calc(var(--pf-global--spacer--lg) / 2);
14402
+ --pf-c-masthead--m-display-inline__main--BorderBottom: 0;
14403
+ --pf-c-masthead--m-display-inline__toggle--GridColumn: 1;
14404
+ --pf-c-masthead--m-display-inline__content--GridColumn: 3;
14405
+ --pf-c-masthead--m-display-inline__content--MinHeight: 4.375rem;
14406
+ --pf-c-masthead--m-display-inline__content--Order: 0;
14407
+ --pf-c-masthead--m-display-inline__content--PaddingTop: 0;
14408
+ --pf-c-masthead--m-display-inline__content--PaddingBottom: 0;
14409
+ --pf-c-masthead--m-display-inline__content--MarginLeft: calc(var(--pf-global--spacer--lg) / 2);
14410
+ --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight: 0;
14411
+ --pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft: 0;
14412
+ --pf-c-masthead__main--before--Right: calc(var(--pf-c-masthead--inset) * -1);
14413
+ --pf-c-masthead__main--before--Left: calc(var(--pf-c-masthead--inset) * -1);
14414
+ --pf-c-masthead__main--before--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
14415
+ --pf-c-masthead__main--before--BorderBottomColor: var(--pf-global--palette--black-600);
14416
+ --pf-c-masthead__toggle--MarginRight: var(--pf-global--spacer--sm);
14417
+ --pf-c-masthead__toggle--MarginLeft: calc(var(--pf-global--spacer--md) * -1);
14418
+ --pf-c-masthead__toggle--c-button--FontSize: var(--pf-global--FontSize--2xl);
14419
+ --pf-c-masthead--m-light--BackgroundColor: var(--pf-global--BackgroundColor--100);
14420
+ --pf-c-masthead--m-light__main--BorderBottomColor: var(--pf-global--BorderColor--300);
14421
+ --pf-c-masthead--m-light-200--BackgroundColor: var(--pf-global--BackgroundColor--200);
14422
+ --pf-c-masthead--m-light-200__main--BorderBottomColor: var(--pf-global--BorderColor--100);
14423
+ --pf-c-masthead--c-toolbar__item--Display: flex;
14424
+ --pf-c-masthead--item-border-color--base: var(--pf-global--palette--black-800);
14425
+ --pf-c-masthead--c-context-selector--Width: auto;
14426
+ --pf-c-masthead--c-context-selector__toggle--BorderTopColor: transparent;
14427
+ --pf-c-masthead--c-context-selector__toggle--BorderRightColor: transparent;
14428
+ --pf-c-masthead--c-context-selector__toggle--BorderBottomColor: transparent;
14429
+ --pf-c-masthead--c-context-selector__toggle--BorderLeftColor: transparent;
14430
+ --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
14431
+ --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
14432
+ --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor: transparent;
14433
+ --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor: transparent;
14434
+ --pf-c-masthead--c-dropdown__toggle--before--BorderBottomColor: transparent;
14435
+ --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor: transparent;
14436
+ --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
14437
+ --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
14438
+ --pf-c-masthead--c-menu-toggle--before--BorderTopColor: transparent;
14439
+ --pf-c-masthead--c-menu-toggle--before--BorderRightColor: transparent;
14440
+ --pf-c-masthead--c-menu-toggle--before--BorderBottomColor: transparent;
14441
+ --pf-c-masthead--c-menu-toggle--before--BorderLeftColor: transparent;
14442
+ --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
14443
+ --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
14444
+ --pf-c-masthead--c-toolbar__content--PaddingRight: 0;
14445
+ --pf-c-masthead--c-toolbar__content--PaddingLeft: 0;
14446
+ --pf-c-masthead--c-toolbar__expandable-content--PaddingTop: var(--pf-global--spacer--md);
14447
+ --pf-c-masthead--c-toolbar__expandable-content--PaddingRight: var(--pf-c-masthead--inset);
14448
+ --pf-c-masthead--c-toolbar__expandable-content--PaddingBottom: var(--pf-global--spacer--md);
14449
+ --pf-c-masthead--c-toolbar__expandable-content--PaddingLeft: var(--pf-c-masthead--inset);
14450
+ --pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth: var(--pf-global--BorderWidth--sm);
14451
+ --pf-c-masthead--c-toolbar__expandable-content--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
14452
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14453
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14454
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14455
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14456
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14457
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14458
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14459
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14460
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14461
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14462
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14463
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14464
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14465
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14466
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14467
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14468
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14469
+ color: var(--pf-global--Color--100);
14470
+ position: relative;
14471
+ display: grid;
14472
+ grid-template-columns: var(--pf-c-masthead--GridTemplateColumns);
14473
+ align-items: center;
14474
+ min-width: 0;
14475
+ padding-right: var(--pf-c-masthead--PaddingRight);
14476
+ padding-left: var(--pf-c-masthead--PaddingLeft);
14477
+ background-color: var(--pf-c-masthead--BackgroundColor);
14478
+ }
14384
14479
 
14385
- .pf-c-masthead.pf-m-inset-2xl-on-md {
14386
- --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14480
+ @media screen and (min-width: 1200px) {
14481
+ .pf-c-masthead {
14482
+ --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
14387
14483
  }
14388
14484
  }
14389
- @media (min-width: 992px) {
14390
- .pf-c-masthead.pf-m-display-stack-on-lg {
14391
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14392
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14393
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14394
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14395
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14396
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14397
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14398
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14399
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14400
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14401
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14402
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14403
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14404
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14405
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14406
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14407
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14408
- }
14409
-
14410
- .pf-c-masthead.pf-m-display-inline-on-lg {
14485
+ @media screen and (min-width: 768px) {
14486
+ .pf-c-masthead {
14411
14487
  --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14412
14488
  --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14413
14489
  --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
@@ -14427,99 +14503,216 @@ ul.pf-c-list {
14427
14503
  --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14428
14504
  }
14429
14505
  }
14430
- @media (min-width: 992px) {
14431
- .pf-c-masthead.pf-m-inset-none-on-lg {
14432
- --pf-c-masthead--inset: 0;
14433
- }
14434
-
14435
- .pf-c-masthead.pf-m-inset-sm-on-lg {
14436
- --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14437
- }
14506
+ .pf-c-masthead.pf-m-light {
14507
+ color: var(--pf-global--Color--100);
14508
+ --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light--BackgroundColor);
14509
+ --pf-c-masthead__main--BorderBottomColor: var(--pf-c-masthead--m-light__main--BorderBottomColor);
14510
+ }
14438
14511
 
14439
- .pf-c-masthead.pf-m-inset-md-on-lg {
14440
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
14441
- }
14512
+ .pf-c-masthead.pf-m-light-200 {
14513
+ color: var(--pf-global--Color--100);
14514
+ --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light-200--BackgroundColor);
14515
+ --pf-c-masthead__main--BorderBottomColor: var(--pf-c-masthead--m-light-200__main--BorderBottomColor);
14516
+ }
14442
14517
 
14443
- .pf-c-masthead.pf-m-inset-lg-on-lg {
14444
- --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14445
- }
14518
+ .pf-c-masthead .pf-c-toolbar {
14519
+ --pf-c-toolbar__content--PaddingRight: var(--pf-c-masthead--c-toolbar__content--PaddingRight);
14520
+ --pf-c-toolbar__content--PaddingLeft: var(--pf-c-masthead--c-toolbar__content--PaddingLeft);
14521
+ --pf-c-toolbar__expandable-content--PaddingTop: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingTop);
14522
+ --pf-c-toolbar__expandable-content--PaddingRight: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingRight);
14523
+ --pf-c-toolbar__expandable-content--PaddingBottom: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingBottom);
14524
+ --pf-c-toolbar__expandable-content--PaddingLeft: var(--pf-c-masthead--c-toolbar__expandable-content--PaddingLeft);
14525
+ width: 100%;
14526
+ }
14446
14527
 
14447
- .pf-c-masthead.pf-m-inset-xl-on-lg {
14448
- --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14449
- }
14528
+ .pf-c-masthead .pf-c-toolbar__content-section {
14529
+ flex-wrap: nowrap;
14530
+ }
14450
14531
 
14451
- .pf-c-masthead.pf-m-inset-2xl-on-lg {
14452
- --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14453
- }
14532
+ .pf-c-masthead .pf-c-toolbar__expandable-content {
14533
+ border-top: var(--pf-c-masthead--c-toolbar__expandable-content--BorderTopWidth) solid var(--pf-c-masthead--c-toolbar__expandable-content--BorderTopColor);
14454
14534
  }
14455
- @media (min-width: 1200px) {
14456
- .pf-c-masthead.pf-m-display-stack-on-xl {
14457
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14458
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14459
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14460
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14461
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14462
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14463
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14464
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14465
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14466
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14467
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14468
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14469
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14470
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14471
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14472
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14473
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14474
- }
14475
14535
 
14476
- .pf-c-masthead.pf-m-display-inline-on-xl {
14477
- --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14478
- --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14479
- --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14480
- --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14481
- --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14482
- --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14483
- --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14484
- --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14485
- --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14486
- --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14487
- --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14488
- --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14489
- --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14490
- --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14491
- --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14492
- --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14493
- --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14494
- }
14536
+ .pf-c-masthead .pf-c-menu-toggle {
14537
+ --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--before--BorderTopColor);
14538
+ --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--before--BorderRightColor);
14539
+ --pf-c-menu-toggle--before--BorderBottomColor: var(--pf-c-masthead--c-menu-toggle--before--BorderBottomColor);
14540
+ --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--before--BorderLeftColor);
14495
14541
  }
14496
- @media (min-width: 1200px) {
14497
- .pf-c-masthead.pf-m-inset-none-on-xl {
14498
- --pf-c-masthead--inset: 0;
14499
- }
14500
14542
 
14501
- .pf-c-masthead.pf-m-inset-sm-on-xl {
14502
- --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14503
- }
14543
+ .pf-c-masthead .pf-c-menu-toggle.pf-m-full-height {
14544
+ --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderRightColor);
14545
+ --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderLeftColor);
14546
+ }
14504
14547
 
14505
- .pf-c-masthead.pf-m-inset-md-on-xl {
14506
- --pf-c-masthead--inset: var(--pf-global--spacer--md);
14507
- }
14548
+ .pf-c-masthead .pf-c-context-selector {
14549
+ --pf-c-context-selector--Width: var(--pf-c-masthead--c-context-selector--Width);
14550
+ --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector__toggle--BorderTopColor);
14551
+ --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector__toggle--BorderRightColor);
14552
+ --pf-c-context-selector__toggle--BorderBottomColor: var(--pf-c-masthead--c-context-selector__toggle--BorderBottomColor);
14553
+ --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector__toggle--BorderLeftColor);
14554
+ }
14508
14555
 
14509
- .pf-c-masthead.pf-m-inset-lg-on-xl {
14510
- --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14511
- }
14556
+ .pf-c-masthead .pf-c-context-selector.pf-m-full-height {
14557
+ --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderRightColor);
14558
+ --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderLeftColor);
14559
+ }
14512
14560
 
14513
- .pf-c-masthead.pf-m-inset-xl-on-xl {
14514
- --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14515
- }
14561
+ .pf-c-masthead .pf-c-dropdown {
14562
+ --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderTopColor);
14563
+ --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderRightColor);
14564
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderBottomColor);
14565
+ --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor);
14566
+ }
14516
14567
 
14517
- .pf-c-masthead.pf-m-inset-2xl-on-xl {
14518
- --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14519
- }
14568
+ .pf-c-masthead .pf-c-dropdown.pf-m-full-height {
14569
+ --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor);
14570
+ --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor);
14520
14571
  }
14521
- @media (min-width: 1450px) {
14522
- .pf-c-masthead.pf-m-display-stack-on-2xl {
14572
+
14573
+ .pf-c-masthead__main {
14574
+ position: relative;
14575
+ display: flex;
14576
+ flex-basis: var(--pf-c-masthead__main--FlexBasis);
14577
+ align-items: center;
14578
+ align-self: stretch;
14579
+ order: var(--pf-c-masthead__main--Order);
14580
+ min-height: var(--pf-c-masthead__main--MinHeight);
14581
+ padding-top: var(--pf-c-masthead__main--PaddingTop);
14582
+ padding-bottom: var(--pf-c-masthead__main--PaddingBottom);
14583
+ margin-right: var(--pf-c-masthead__main--MarginRight);
14584
+ grid-column: var(--pf-c-masthead__main--GridColumn);
14585
+ }
14586
+
14587
+ .pf-c-masthead__main::before {
14588
+ position: absolute;
14589
+ right: var(--pf-c-masthead__main--before--Right);
14590
+ bottom: 0;
14591
+ left: var(--pf-c-masthead__main--before--Left);
14592
+ content: "";
14593
+ border-bottom: var(--pf-c-masthead__main--before--BorderBottom);
14594
+ }
14595
+
14596
+ .pf-c-masthead__main:last-child {
14597
+ --pf-c-masthead__main--MarginRight: 0;
14598
+ }
14599
+
14600
+ .pf-c-masthead__content {
14601
+ display: flex;
14602
+ flex-grow: 1;
14603
+ align-items: center;
14604
+ align-self: stretch;
14605
+ order: var(--pf-c-masthead__content--Order);
14606
+ min-height: var(--pf-c-masthead__content--MinHeight);
14607
+ padding-top: var(--pf-c-masthead__content--PaddingTop);
14608
+ padding-bottom: var(--pf-c-masthead__content--PaddingBottom);
14609
+ margin-left: var(--pf-c-masthead__content--MarginLeft);
14610
+ grid-column: var(--pf-c-masthead__content--GridColumn);
14611
+ grid-column-end: -1;
14612
+ flex-shrink: 1;
14613
+ }
14614
+
14615
+ .pf-c-masthead__content:only-child {
14616
+ --pf-c-masthead__content--MarginLeft: 0;
14617
+ }
14618
+
14619
+ .pf-c-masthead__content .pf-c-nav.pf-m-horizontal {
14620
+ margin-right: var(--pf-c-masthead__content--c-nav--m-horizontal--MarginRight);
14621
+ margin-left: var(--pf-c-masthead__content--c-nav--m-horizontal--MarginLeft);
14622
+ }
14623
+
14624
+ .pf-c-masthead__toggle ~ .pf-c-masthead__content {
14625
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-c-masthead__content--MarginLeft) * -1);
14626
+ }
14627
+
14628
+ .pf-c-masthead__main,
14629
+ .pf-c-masthead__brand,
14630
+ .pf-c-masthead__content {
14631
+ min-width: 0;
14632
+ }
14633
+
14634
+ .pf-c-masthead__brand {
14635
+ display: inline-flex;
14636
+ align-self: center;
14637
+ }
14638
+
14639
+ .pf-c-masthead__toggle {
14640
+ grid-column: var(--pf-c-masthead__toggle--GridColumn);
14641
+ align-self: center;
14642
+ margin-right: var(--pf-c-masthead__toggle--MarginRight);
14643
+ margin-left: var(--pf-c-masthead__toggle--MarginLeft);
14644
+ }
14645
+
14646
+ .pf-c-masthead__toggle .pf-c-button {
14647
+ --pf-c-button--FontSize: var(--pf-c-masthead__toggle--c-button--FontSize);
14648
+ }
14649
+
14650
+ .pf-c-masthead.pf-m-display-stack {
14651
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14652
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14653
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14654
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14655
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14656
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14657
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14658
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14659
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14660
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14661
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14662
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14663
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14664
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14665
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14666
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14667
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14668
+ }
14669
+
14670
+ .pf-c-masthead.pf-m-display-inline {
14671
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14672
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14673
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14674
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14675
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14676
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14677
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14678
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14679
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14680
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14681
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14682
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14683
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14684
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14685
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14686
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14687
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14688
+ }
14689
+
14690
+ .pf-c-masthead.pf-m-inset-none {
14691
+ --pf-c-masthead--inset: 0;
14692
+ }
14693
+
14694
+ .pf-c-masthead.pf-m-inset-sm {
14695
+ --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14696
+ }
14697
+
14698
+ .pf-c-masthead.pf-m-inset-md {
14699
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
14700
+ }
14701
+
14702
+ .pf-c-masthead.pf-m-inset-lg {
14703
+ --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14704
+ }
14705
+
14706
+ .pf-c-masthead.pf-m-inset-xl {
14707
+ --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14708
+ }
14709
+
14710
+ .pf-c-masthead.pf-m-inset-2xl {
14711
+ --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14712
+ }
14713
+
14714
+ @media (min-width: 576px) {
14715
+ .pf-c-masthead.pf-m-display-stack-on-sm {
14523
14716
  --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14524
14717
  --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14525
14718
  --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
@@ -14539,7 +14732,7 @@ ul.pf-c-list {
14539
14732
  --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14540
14733
  }
14541
14734
 
14542
- .pf-c-masthead.pf-m-display-inline-on-2xl {
14735
+ .pf-c-masthead.pf-m-display-inline-on-sm {
14543
14736
  --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14544
14737
  --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14545
14738
  --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
@@ -14559,332 +14752,295 @@ ul.pf-c-list {
14559
14752
  --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14560
14753
  }
14561
14754
  }
14562
- @media (min-width: 1450px) {
14563
- .pf-c-masthead.pf-m-inset-none-on-2xl {
14755
+ @media (min-width: 576px) {
14756
+ .pf-c-masthead.pf-m-inset-none-on-sm {
14564
14757
  --pf-c-masthead--inset: 0;
14565
14758
  }
14566
14759
 
14567
- .pf-c-masthead.pf-m-inset-sm-on-2xl {
14760
+ .pf-c-masthead.pf-m-inset-sm-on-sm {
14568
14761
  --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14569
14762
  }
14570
14763
 
14571
- .pf-c-masthead.pf-m-inset-md-on-2xl {
14764
+ .pf-c-masthead.pf-m-inset-md-on-sm {
14572
14765
  --pf-c-masthead--inset: var(--pf-global--spacer--md);
14573
14766
  }
14574
14767
 
14575
- .pf-c-masthead.pf-m-inset-lg-on-2xl {
14768
+ .pf-c-masthead.pf-m-inset-lg-on-sm {
14576
14769
  --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14577
14770
  }
14578
14771
 
14579
- .pf-c-masthead.pf-m-inset-xl-on-2xl {
14772
+ .pf-c-masthead.pf-m-inset-xl-on-sm {
14580
14773
  --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14581
14774
  }
14582
14775
 
14583
- .pf-c-masthead.pf-m-inset-2xl-on-2xl {
14776
+ .pf-c-masthead.pf-m-inset-2xl-on-sm {
14584
14777
  --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14585
14778
  }
14586
14779
  }
14587
- .pf-c-login__footer, .pf-c-login__header {
14588
- --pf-global--Color--100: var(--pf-global--Color--light-100);
14589
- --pf-global--Color--200: var(--pf-global--Color--light-200);
14590
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
14591
- --pf-global--primary-color--100: var(--pf-global--primary-color--light-100);
14592
- --pf-global--link--Color: var(--pf-global--link--Color--light);
14593
- --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
14594
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
14595
- }
14780
+ @media (min-width: 768px) {
14781
+ .pf-c-masthead.pf-m-display-stack-on-md {
14782
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14783
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14784
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14785
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14786
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14787
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14788
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14789
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14790
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14791
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14792
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14793
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14794
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14795
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14796
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14797
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14798
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14799
+ }
14596
14800
 
14597
- .pf-c-login__footer .pf-c-card, .pf-c-login__header .pf-c-card {
14598
- --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
14801
+ .pf-c-masthead.pf-m-display-inline-on-md {
14802
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14803
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14804
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14805
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14806
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14807
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14808
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14809
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14810
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14811
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14812
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14813
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14814
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14815
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14816
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14817
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14818
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14819
+ }
14599
14820
  }
14821
+ @media (min-width: 768px) {
14822
+ .pf-c-masthead.pf-m-inset-none-on-md {
14823
+ --pf-c-masthead--inset: 0;
14824
+ }
14600
14825
 
14601
- .pf-c-login__footer .pf-c-button, .pf-c-login__header .pf-c-button {
14602
- --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
14603
- --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
14604
- --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
14605
- --pf-c-button--m-primary--active--Color: var(--pf-global--primary-color--dark-100);
14606
- --pf-c-button--m-primary--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
14607
- --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
14608
- --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
14609
- --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
14610
- --pf-c-button--m-secondary--Color: var(--pf-global--Color--light-100);
14611
- --pf-c-button--m-secondary--hover--Color: var(--pf-global--Color--light-100);
14612
- --pf-c-button--m-secondary--focus--Color: var(--pf-global--Color--light-100);
14613
- --pf-c-button--m-secondary--active--Color: var(--pf-global--Color--light-100);
14614
- --pf-c-button--m-secondary--BorderColor: var(--pf-global--Color--light-100);
14615
- --pf-c-button--m-secondary--hover--BorderColor: var(--pf-global--Color--light-100);
14616
- --pf-c-button--m-secondary--focus--BorderColor: var(--pf-global--Color--light-100);
14617
- --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
14618
- }
14826
+ .pf-c-masthead.pf-m-inset-sm-on-md {
14827
+ --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14828
+ }
14619
14829
 
14620
- .pf-c-login {
14621
- --pf-c-login--PaddingTop: var(--pf-global--spacer--lg);
14622
- --pf-c-login--PaddingBottom: var(--pf-global--spacer--lg);
14623
- --pf-c-login--xl--BackgroundImage: none;
14624
- --pf-c-login__container--xl--GridColumnGap: var(--pf-global--spacer--3xl);
14625
- --pf-c-login__container--MaxWidth: 31.25rem;
14626
- --pf-c-login__container--xl--MaxWidth: none;
14627
- --pf-c-login__container--PaddingLeft: 6.125rem;
14628
- --pf-c-login__container--PaddingRight: 6.125rem;
14629
- --pf-c-login__container--xl--GridTemplateColumns: 34rem minmax(auto, 34rem);
14630
- --pf-c-login__header--MarginBottom: var(--pf-global--spacer--md);
14631
- --pf-c-login__header--PaddingLeft: var(--pf-global--spacer--md);
14632
- --pf-c-login__header--PaddingRight: var(--pf-global--spacer--md);
14633
- --pf-c-login__header--xl--MarginBottom: var(--pf-global--spacer--2xl);
14634
- --pf-c-login__header--xl--MarginTop: var(--pf-global--spacer--3xl);
14635
- --pf-c-login__header--c-brand--MarginBottom: var(--pf-global--spacer--lg);
14636
- --pf-c-login__header--c-brand--xl--MarginBottom: var(--pf-global--spacer--2xl);
14637
- --pf-c-login__main--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
14638
- --pf-c-login__main--MarginBottom: var(--pf-global--spacer--lg);
14639
- --pf-c-login__main-header--PaddingTop: var(--pf-global--spacer--2xl);
14640
- --pf-c-login__main-header--PaddingRight: var(--pf-global--spacer--xl);
14641
- --pf-c-login__main-header--PaddingBottom: var(--pf-global--spacer--md);
14642
- --pf-c-login__main-header--PaddingLeft: var(--pf-global--spacer--xl);
14643
- --pf-c-login__main-header--md--PaddingRight: var(--pf-global--spacer--2xl);
14644
- --pf-c-login__main-header--md--PaddingLeft: var(--pf-global--spacer--2xl);
14645
- --pf-c-login__main-header--ColumnGap: var(--pf-global--spacer--md);
14646
- --pf-c-login__main-header--RowGap: var(--pf-global--spacer--md);
14647
- --pf-c-login__main-header-desc--MarginBottom: var(--pf-global--spacer--sm);
14648
- --pf-c-login__main-header-desc--md--MarginBottom: 0;
14649
- --pf-c-login__main-header-desc--FontSize: var(--pf-global--FontSize--sm);
14650
- --pf-c-login__main-body--PaddingRight: var(--pf-global--spacer--xl);
14651
- --pf-c-login__main-body--PaddingBottom: var(--pf-global--spacer--xl);
14652
- --pf-c-login__main-body--PaddingLeft: var(--pf-global--spacer--xl);
14653
- --pf-c-login__main-body--md--PaddingRight: var(--pf-global--spacer--2xl);
14654
- --pf-c-login__main-body--md--PaddingLeft: var(--pf-global--spacer--2xl);
14655
- --pf-c-login__main-footer--PaddingBottom: var(--pf-global--spacer--3xl);
14656
- --pf-c-login__main-footer--c-title--MarginBottom: var(--pf-global--spacer--md);
14657
- --pf-c-login__main-footer-links--PaddingTop: var(--pf-global--spacer--sm);
14658
- --pf-c-login__main-footer-links--PaddingRight: var(--pf-global--spacer--3xl);
14659
- --pf-c-login__main-footer-links--PaddingBottom: var(--pf-global--spacer--xl);
14660
- --pf-c-login__main-footer-links--PaddingLeft: var(--pf-global--spacer--3xl);
14661
- --pf-c-login__main-footer-links-item--PaddingRight: var(--pf-global--spacer--md);
14662
- --pf-c-login__main-footer-links-item--PaddingLeft: var(--pf-global--spacer--md);
14663
- --pf-c-login__main-footer-links-item--MarginBottom: var(--pf-global--spacer--sm);
14664
- --pf-c-login__main-footer-links-item-link-svg--Fill: var(--pf-global--icon--Color--light);
14665
- --pf-c-login__main-footer-links-item-link-svg--Width: var(--pf-global--icon--FontSize--lg);
14666
- --pf-c-login__main-footer-links-item-link-svg--Height: var(--pf-global--icon--FontSize--lg);
14667
- --pf-c-login__main-footer-links-item-link-svg--hover--Fill: var(--pf-global--icon--Color--dark);
14668
- --pf-c-login__main-footer-band--PaddingTop: var(--pf-global--spacer--lg);
14669
- --pf-c-login__main-footer-band--PaddingRight: var(--pf-global--spacer--md);
14670
- --pf-c-login__main-footer-band--PaddingBottom: var(--pf-global--spacer--lg);
14671
- --pf-c-login__main-footer-band--PaddingLeft: var(--pf-global--spacer--md);
14672
- --pf-c-login__main-footer-band--BackgroundColor: var(--pf-global--BackgroundColor--200);
14673
- --pf-c-login__main-footer-band-item--PaddingTop: var(--pf-global--spacer--md);
14674
- --pf-c-login__footer--PaddingLeft: var(--pf-global--spacer--md);
14675
- --pf-c-login__footer--PaddingRight: var(--pf-global--spacer--md);
14676
- --pf-c-login__footer--c-list--PaddingTop: var(--pf-global--spacer--md);
14677
- --pf-c-login__footer--c-list--xl--PaddingTop: var(--pf-global--spacer--2xl);
14678
- display: flex;
14679
- justify-content: center;
14680
- min-height: 100vh;
14681
- padding-top: var(--pf-c-login--PaddingTop);
14682
- padding-bottom: var(--pf-c-login--PaddingBottom);
14683
- }
14830
+ .pf-c-masthead.pf-m-inset-md-on-md {
14831
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
14832
+ }
14684
14833
 
14685
- @media (min-width: 1200px) {
14686
- .pf-c-login {
14687
- --pf-c-login__container--MaxWidth: var(--pf-c-login__container--xl--MaxWidth);
14834
+ .pf-c-masthead.pf-m-inset-lg-on-md {
14835
+ --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14688
14836
  }
14689
- }
14690
- @media (min-width: 576px) {
14691
- .pf-c-login {
14692
- --pf-c-login__header--PaddingRight: 0;
14693
- --pf-c-login__header--PaddingLeft: 0;
14837
+
14838
+ .pf-c-masthead.pf-m-inset-xl-on-md {
14839
+ --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14694
14840
  }
14695
- }
14696
- @media (min-width: 1200px) {
14697
- .pf-c-login {
14698
- --pf-c-login__header--MarginBottom: var(--pf-c-login__header--xl--MarginBottom);
14699
- --pf-c-login__header--c-brand--MarginBottom: var(--pf-c-login__header--c-brand--xl--MarginBottom);
14841
+
14842
+ .pf-c-masthead.pf-m-inset-2xl-on-md {
14843
+ --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14700
14844
  }
14701
14845
  }
14702
- @media (min-width: 1200px) {
14703
- .pf-c-login {
14704
- --pf-c-login__main--MarginBottom: 0;
14846
+ @media (min-width: 992px) {
14847
+ .pf-c-masthead.pf-m-display-stack-on-lg {
14848
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14849
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14850
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14851
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14852
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14853
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14854
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14855
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14856
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14857
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14858
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14859
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14860
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14861
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14862
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14863
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14864
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14705
14865
  }
14706
- }
14707
- @media (min-width: 768px) {
14708
- .pf-c-login {
14709
- --pf-c-login__main-header--PaddingRight: var(--pf-c-login__main-header--md--PaddingRight);
14710
- --pf-c-login__main-header--PaddingLeft: var(--pf-c-login__main-header--md--PaddingLeft);
14711
- --pf-c-login__main-header-desc--MarginBottom: var(--pf-c-login__main-header-desc--md--MarginBottom);
14866
+
14867
+ .pf-c-masthead.pf-m-display-inline-on-lg {
14868
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14869
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14870
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14871
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14872
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14873
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14874
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14875
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14876
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14877
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14878
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14879
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14880
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14881
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14882
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14883
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14884
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14712
14885
  }
14713
14886
  }
14714
- @media (min-width: 768px) {
14715
- .pf-c-login {
14716
- --pf-c-login__main-body--PaddingRight: var(--pf-c-login__main-body--md--PaddingRight);
14717
- --pf-c-login__main-body--PaddingLeft: var(--pf-c-login__main-body--md--PaddingLeft);
14887
+ @media (min-width: 992px) {
14888
+ .pf-c-masthead.pf-m-inset-none-on-lg {
14889
+ --pf-c-masthead--inset: 0;
14718
14890
  }
14719
- }
14720
- @media (min-width: 576px) {
14721
- .pf-c-login {
14722
- --pf-c-login__footer--PaddingRight: 0;
14723
- --pf-c-login__footer--PaddingLeft: 0;
14891
+
14892
+ .pf-c-masthead.pf-m-inset-sm-on-lg {
14893
+ --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14724
14894
  }
14725
- }
14726
- @media (min-width: 1200px) {
14727
- .pf-c-login {
14728
- --pf-c-login__footer--c-list--PaddingTop: var(--pf-c-login__footer--c-list--xl--PaddingTop);
14895
+
14896
+ .pf-c-masthead.pf-m-inset-md-on-lg {
14897
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
14729
14898
  }
14730
- }
14731
- @media (min-width: 1200px) {
14732
- .pf-c-login {
14733
- background-image: var(--pf-c-login--xl--BackgroundImage);
14899
+
14900
+ .pf-c-masthead.pf-m-inset-lg-on-lg {
14901
+ --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14734
14902
  }
14735
- }
14736
- @media (min-width: 576px) {
14737
- .pf-c-login {
14738
- align-items: center;
14903
+
14904
+ .pf-c-masthead.pf-m-inset-xl-on-lg {
14905
+ --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14739
14906
  }
14740
- }
14741
- .pf-c-login__container {
14742
- width: 100%;
14743
- max-width: var(--pf-c-login__container--MaxWidth);
14744
- }
14745
14907
 
14746
- @media (min-width: 1200px) {
14747
- .pf-c-login__container {
14748
- display: grid;
14749
- justify-content: center;
14750
- grid-column-gap: var(--pf-c-login__container--xl--GridColumnGap);
14751
- grid-template-columns: var(--pf-c-login__container--xl--GridTemplateColumns);
14752
- grid-template-areas: "main header" "main footer" "main .";
14753
- padding-right: var(--pf-c-login__container--PaddingRight);
14754
- padding-left: var(--pf-c-login__container--PaddingLeft);
14908
+ .pf-c-masthead.pf-m-inset-2xl-on-lg {
14909
+ --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14755
14910
  }
14756
14911
  }
14757
- .pf-c-login__header {
14758
- color: var(--pf-global--Color--100);
14759
- grid-area: header;
14760
- padding-right: var(--pf-c-login__header--PaddingRight);
14761
- padding-left: var(--pf-c-login__header--PaddingLeft);
14762
- }
14763
-
14764
14912
  @media (min-width: 1200px) {
14765
- .pf-c-login__header {
14766
- margin-top: var(--pf-c-login__header--xl--MarginTop);
14913
+ .pf-c-masthead.pf-m-display-stack-on-xl {
14914
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14915
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14916
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14917
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14918
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14919
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14920
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14921
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14922
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14923
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14924
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14925
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14926
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14927
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14928
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14929
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14930
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14767
14931
  }
14768
- }
14769
- .pf-c-login__header .pf-c-brand {
14770
- margin-bottom: var(--pf-c-login__header--c-brand--MarginBottom);
14771
- }
14772
-
14773
- .pf-c-login__main {
14774
- margin-bottom: var(--pf-c-login__main--MarginBottom);
14775
- background-color: var(--pf-c-login__main--BackgroundColor);
14776
- grid-area: main;
14777
- }
14778
-
14779
- .pf-c-login__main > :first-child:not(.pf-c-login__main-header) {
14780
- padding-top: var(--pf-c-login__main-header--PaddingTop);
14781
- }
14782
-
14783
- .pf-c-login__main > :last-child:not(.pf-c-login__main-footer) {
14784
- padding-bottom: var(--pf-c-login__main-footer--PaddingBottom);
14785
- }
14786
14932
 
14787
- .pf-c-login__main-header {
14788
- display: grid;
14789
- grid-template-columns: 100%;
14790
- column-gap: var(--pf-c-login__main-header--ColumnGap);
14791
- row-gap: var(--pf-c-login__main-header--RowGap);
14792
- align-items: center;
14793
- 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);
14794
- }
14795
-
14796
- @media (min-width: 768px) {
14797
- .pf-c-login__main-header {
14798
- grid-template-columns: 1fr auto;
14933
+ .pf-c-masthead.pf-m-display-inline-on-xl {
14934
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
14935
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
14936
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
14937
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
14938
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
14939
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
14940
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
14941
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
14942
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
14943
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
14944
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
14945
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
14946
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
14947
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
14948
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
14949
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
14950
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
14799
14951
  }
14800
14952
  }
14801
- .pf-c-login__main-header .pf-c-dropdown {
14802
- grid-column: auto;
14803
- grid-row: auto;
14804
- }
14805
-
14806
- @media (min-width: 768px) {
14807
- .pf-c-login__main-header .pf-c-dropdown {
14808
- grid-column: 2/3;
14809
- grid-row: 1;
14953
+ @media (min-width: 1200px) {
14954
+ .pf-c-masthead.pf-m-inset-none-on-xl {
14955
+ --pf-c-masthead--inset: 0;
14810
14956
  }
14811
- }
14812
- .pf-c-login__main-header-desc {
14813
- margin-bottom: var(--pf-c-login__main-header-desc--MarginBottom);
14814
- font-size: var(--pf-c-login__main-header-desc--FontSize);
14815
- grid-column: 1/-1;
14816
- }
14817
-
14818
- .pf-c-login__main-body {
14819
- padding-right: var(--pf-c-login__main-body--PaddingRight);
14820
- padding-bottom: var(--pf-c-login__main-body--PaddingBottom);
14821
- padding-left: var(--pf-c-login__main-body--PaddingLeft);
14822
- }
14823
14957
 
14824
- .pf-c-login__main-footer {
14825
- display: flex;
14826
- flex-wrap: wrap;
14827
- }
14828
-
14829
- .pf-c-login__main-footer .pf-c-title {
14830
- margin-bottom: var(--pf-c-login__main-footer--c-title--MarginBottom);
14831
- text-align: center;
14832
- }
14833
-
14834
- .pf-c-login__main-footer > * {
14835
- flex-basis: 100%;
14836
- }
14958
+ .pf-c-masthead.pf-m-inset-sm-on-xl {
14959
+ --pf-c-masthead--inset: var(--pf-global--spacer--sm);
14960
+ }
14837
14961
 
14838
- .pf-c-login__main-footer-links {
14839
- display: flex;
14840
- flex-wrap: wrap;
14841
- justify-content: center;
14842
- 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);
14843
- }
14962
+ .pf-c-masthead.pf-m-inset-md-on-xl {
14963
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
14964
+ }
14844
14965
 
14845
- .pf-c-login__main-footer-links-item {
14846
- padding-right: var(--pf-c-login__main-footer-links-item--PaddingRight);
14847
- padding-left: var(--pf-c-login__main-footer-links-item--PaddingLeft);
14848
- margin-bottom: var(--pf-c-login__main-footer-links-item--MarginBottom);
14849
- }
14966
+ .pf-c-masthead.pf-m-inset-lg-on-xl {
14967
+ --pf-c-masthead--inset: var(--pf-global--spacer--lg);
14968
+ }
14850
14969
 
14851
- .pf-c-login__main-footer-links-item-link svg {
14852
- fill: var(--pf-c-login__main-footer-links-item-link-svg--Fill);
14853
- width: 100%;
14854
- max-width: var(--pf-c-login__main-footer-links-item-link-svg--Width);
14855
- height: 100%;
14856
- max-height: var(--pf-c-login__main-footer-links-item-link-svg--Height);
14857
- }
14970
+ .pf-c-masthead.pf-m-inset-xl-on-xl {
14971
+ --pf-c-masthead--inset: var(--pf-global--spacer--xl);
14972
+ }
14858
14973
 
14859
- .pf-c-login__main-footer-links-item-link:hover svg {
14860
- fill: var(--pf-c-login__main-footer-links-item-link-svg--hover--Fill);
14974
+ .pf-c-masthead.pf-m-inset-2xl-on-xl {
14975
+ --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
14976
+ }
14861
14977
  }
14978
+ @media (min-width: 1450px) {
14979
+ .pf-c-masthead.pf-m-display-stack-on-2xl {
14980
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-stack--GridTemplateColumns);
14981
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-stack__main--GridColumn);
14982
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-stack__main--MinHeight);
14983
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-stack__main--Order);
14984
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-stack__main--FlexBasis);
14985
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-stack__main--PaddingTop);
14986
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-stack__main--PaddingBottom);
14987
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-stack__main--MarginRight);
14988
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-stack__main--before--BorderBottom);
14989
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-stack__content--GridColumn);
14990
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-stack__content--MinHeight);
14991
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-stack__content--Order);
14992
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-stack__content--PaddingTop);
14993
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-stack__content--PaddingBottom);
14994
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-stack__content--MarginLeft);
14995
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
14996
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
14997
+ }
14862
14998
 
14863
- .pf-c-login__main-footer-band {
14864
- 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);
14865
- text-align: center;
14866
- background-color: var(--pf-c-login__main-footer-band--BackgroundColor);
14999
+ .pf-c-masthead.pf-m-display-inline-on-2xl {
15000
+ --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
15001
+ --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
15002
+ --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
15003
+ --pf-c-masthead__main--Order: var(--pf-c-masthead--m-display-inline__main--Order);
15004
+ --pf-c-masthead__main--FlexBasis: var(--pf-c-masthead--m-display-inline__main--FlexBasis);
15005
+ --pf-c-masthead__main--PaddingTop: var(--pf-c-masthead--m-display-inline__main--PaddingTop);
15006
+ --pf-c-masthead__main--PaddingBottom: var(--pf-c-masthead--m-display-inline__main--PaddingBottom);
15007
+ --pf-c-masthead__main--MarginRight: var(--pf-c-masthead--m-display-inline__main--MarginRight);
15008
+ --pf-c-masthead__main--before--BorderBottom: var(--pf-c-masthead--m-display-inline__main--BorderBottom);
15009
+ --pf-c-masthead__content--GridColumn: var(--pf-c-masthead--m-display-inline__content--GridColumn);
15010
+ --pf-c-masthead__content--MinHeight: var(--pf-c-masthead--m-display-inline__content--MinHeight);
15011
+ --pf-c-masthead__content--Order: var(--pf-c-masthead--m-display-inline__content--Order);
15012
+ --pf-c-masthead__content--PaddingTop: var(--pf-c-masthead--m-display-inline__content--PaddingTop);
15013
+ --pf-c-masthead__content--PaddingBottom: var(--pf-c-masthead--m-display-inline__content--PaddingBottom);
15014
+ --pf-c-masthead__content--MarginLeft: var(--pf-c-masthead--m-display-inline__content--MarginLeft);
15015
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
15016
+ --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
15017
+ }
14867
15018
  }
15019
+ @media (min-width: 1450px) {
15020
+ .pf-c-masthead.pf-m-inset-none-on-2xl {
15021
+ --pf-c-masthead--inset: 0;
15022
+ }
14868
15023
 
14869
- .pf-c-login__main-footer-band > * + * {
14870
- padding-top: var(--pf-c-login__main-footer-band-item--PaddingTop);
14871
- }
15024
+ .pf-c-masthead.pf-m-inset-sm-on-2xl {
15025
+ --pf-c-masthead--inset: var(--pf-global--spacer--sm);
15026
+ }
14872
15027
 
14873
- .pf-c-login__footer {
14874
- color: var(--pf-global--Color--100);
14875
- grid-area: footer;
14876
- padding-right: var(--pf-c-login__footer--PaddingRight);
14877
- padding-left: var(--pf-c-login__footer--PaddingLeft);
14878
- }
15028
+ .pf-c-masthead.pf-m-inset-md-on-2xl {
15029
+ --pf-c-masthead--inset: var(--pf-global--spacer--md);
15030
+ }
14879
15031
 
14880
- .pf-c-login__footer .pf-c-list a {
14881
- color: unset;
14882
- }
15032
+ .pf-c-masthead.pf-m-inset-lg-on-2xl {
15033
+ --pf-c-masthead--inset: var(--pf-global--spacer--lg);
15034
+ }
14883
15035
 
14884
- .pf-c-login__footer .pf-c-list:not(:only-child) {
14885
- padding-top: var(--pf-c-login__footer--c-list--PaddingTop);
14886
- }
15036
+ .pf-c-masthead.pf-m-inset-xl-on-2xl {
15037
+ --pf-c-masthead--inset: var(--pf-global--spacer--xl);
15038
+ }
14887
15039
 
15040
+ .pf-c-masthead.pf-m-inset-2xl-on-2xl {
15041
+ --pf-c-masthead--inset: var(--pf-global--spacer--2xl);
15042
+ }
15043
+ }
14888
15044
  .pf-c-menu {
14889
15045
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
14890
15046
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
@@ -14973,6 +15129,8 @@ ul.pf-c-list {
14973
15129
  --pf-c-menu--Width: auto;
14974
15130
  --pf-c-menu--ZIndex: var(--pf-global--ZIndex--sm);
14975
15131
  --pf-c-menu--m-flyout__menu--Top: calc(var(--pf-c-menu__list--PaddingTop) * -1 + var(--pf-c-menu--m-flyout__menu--top-offset));
15132
+ --pf-c-menu--m-flyout__menu--Right: auto;
15133
+ --pf-c-menu--m-flyout__menu--Bottom: auto;
14976
15134
  --pf-c-menu--m-flyout__menu--Left: calc(100% + var(--pf-c-menu--m-flyout__menu--left-offset));
14977
15135
  --pf-c-menu--m-flyout__menu--m-top--Bottom: calc(var(--pf-c-menu__list--PaddingTop) * -1);
14978
15136
  --pf-c-menu--m-flyout__menu--m-left--Right: calc(100% + var(--pf-c-menu--m-flyout__menu--m-left--right-offset));
@@ -15093,10 +15251,6 @@ ul.pf-c-list {
15093
15251
  box-shadow: var(--pf-c-menu--BoxShadow);
15094
15252
  }
15095
15253
 
15096
- .pf-c-menu .pf-c-menu__content {
15097
- overflow-y: auto;
15098
- }
15099
-
15100
15254
  .pf-c-menu .pf-c-menu__content .pf-c-menu .pf-c-menu__content {
15101
15255
  overflow: visible;
15102
15256
  }
@@ -15106,33 +15260,26 @@ ul.pf-c-list {
15106
15260
  margin-bottom: var(--pf-c-menu--c-divider--MarginBottom);
15107
15261
  }
15108
15262
 
15109
- .pf-c-menu.pf-m-flyout {
15110
- overflow: visible;
15111
- }
15112
-
15113
- .pf-c-menu.pf-m-flyout .pf-c-menu {
15263
+ .pf-c-menu .pf-c-menu.pf-m-flyout, .pf-c-menu.pf-m-flyout .pf-c-menu {
15114
15264
  position: absolute;
15115
15265
  top: var(--pf-c-menu--m-flyout__menu--Top);
15116
- right: auto;
15266
+ right: var(--pf-c-menu--m-flyout__menu--Right);
15267
+ bottom: var(--pf-c-menu--m-flyout__menu--Bottom);
15117
15268
  left: var(--pf-c-menu--m-flyout__menu--Left);
15118
15269
  }
15119
15270
 
15120
- .pf-c-menu.pf-m-flyout .pf-c-menu.pf-m-top {
15121
- top: auto;
15122
- bottom: var(--pf-c-menu--m-flyout__menu--m-top--Bottom);
15123
- }
15124
-
15125
- .pf-c-menu.pf-m-flyout .pf-c-menu.pf-m-left {
15126
- right: var(--pf-c-menu--m-flyout__menu--m-left--Right);
15127
- left: auto;
15271
+ .pf-c-menu .pf-c-menu.pf-m-flyout .pf-c-menu__content, .pf-c-menu.pf-m-flyout .pf-c-menu .pf-c-menu__content {
15272
+ overflow-y: visible;
15128
15273
  }
15129
15274
 
15130
- .pf-c-menu.pf-m-flyout .pf-c-menu__content {
15131
- overflow-y: visible;
15275
+ .pf-c-menu.pf-m-top {
15276
+ --pf-c-menu--m-flyout__menu--Top: auto;
15277
+ --pf-c-menu--m-flyout__menu--Bottom: var(--pf-c-menu--m-flyout__menu--m-top--Bottom);
15132
15278
  }
15133
15279
 
15134
- .pf-c-menu.pf-m-flyout .pf-c-menu__list-item {
15135
- position: relative;
15280
+ .pf-c-menu.pf-m-left {
15281
+ --pf-c-menu--m-flyout__menu--Right: var(--pf-c-menu--m-flyout__menu--m-left--Right);
15282
+ --pf-c-menu--m-flyout__menu--Left: auto;
15136
15283
  }
15137
15284
 
15138
15285
  .pf-c-menu.pf-m-drilldown {
@@ -15174,6 +15321,11 @@ ul.pf-c-list {
15174
15321
  transition: var(--pf-c-menu--m-drilldown__list--Transition);
15175
15322
  }
15176
15323
 
15324
+ .pf-c-menu.pf-m-drilldown .pf-c-menu__list .pf-c-menu__list {
15325
+ --pf-c-menu__list--PaddingTop: 0;
15326
+ --pf-c-menu__list--PaddingBottom: 0;
15327
+ }
15328
+
15177
15329
  .pf-c-menu.pf-m-drilldown .pf-c-menu__list-item.pf-m-current-path .pf-c-menu {
15178
15330
  z-index: var(--pf-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex);
15179
15331
  }
@@ -15218,6 +15370,10 @@ ul.pf-c-list {
15218
15370
  --pf-c-menu__footer--after--BorderBottomWidth: var(--pf-c-menu--m-scrollable__footer--after--BorderBottomWidth);
15219
15371
  }
15220
15372
 
15373
+ .pf-c-menu.pf-m-scrollable .pf-c-menu__content {
15374
+ overflow-y: auto;
15375
+ }
15376
+
15221
15377
  .pf-c-menu__breadcrumb {
15222
15378
  display: flex;
15223
15379
  align-items: center;
@@ -15290,6 +15446,7 @@ ul.pf-c-list {
15290
15446
 
15291
15447
  .pf-c-menu__list-item {
15292
15448
  --pf-hidden-visible--visible--Display: var(--pf-c-menu__list-item--Display);
15449
+ position: relative;
15293
15450
  color: var(--pf-c-menu__list-item--Color);
15294
15451
  background-color: var(--pf-c-menu__list-item--BackgroundColor);
15295
15452
  }
@@ -15472,6 +15629,7 @@ ul.pf-c-list {
15472
15629
  }
15473
15630
 
15474
15631
  .pf-c-menu-toggle {
15632
+ --pf-c-menu-toggle--BorderRadius: 0;
15475
15633
  --pf-c-menu-toggle--PaddingTop: var(--pf-global--spacer--form-element);
15476
15634
  --pf-c-menu-toggle--PaddingRight: var(--pf-global--spacer--sm);
15477
15635
  --pf-c-menu-toggle--PaddingBottom: var(--pf-global--spacer--form-element);
@@ -15506,12 +15664,27 @@ ul.pf-c-list {
15506
15664
  --pf-c-menu-toggle--disabled--Color: var(--pf-global--disabled-color--100);
15507
15665
  --pf-c-menu-toggle--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
15508
15666
  --pf-c-menu-toggle--m-primary--Color: var(--pf-global--Color--light-100);
15667
+ --pf-c-menu-toggle--m-primary--BorderRadius: var(--pf-global--BorderRadius--sm);
15509
15668
  --pf-c-menu-toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--100);
15510
15669
  --pf-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-global--primary-color--200);
15511
15670
  --pf-c-menu-toggle--m-primary--focus--BackgroundColor: var(--pf-global--primary-color--200);
15512
15671
  --pf-c-menu-toggle--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
15513
15672
  --pf-c-menu-toggle--m-primary--m-expanded--BackgroundColor: var(--pf-global--primary-color--200);
15514
15673
  --pf-c-menu-toggle--m-primary--m-expanded--Color: var(--pf-global--Color--light-100);
15674
+ --pf-c-menu-toggle--m-secondary--Color: var(--pf-global--primary-color--100);
15675
+ --pf-c-menu-toggle--m-secondary--BorderRadius: var(--pf-global--BorderRadius--sm);
15676
+ --pf-c-menu-toggle--m-secondary--BackgroundColor: transparent;
15677
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--sm);
15678
+ --pf-c-menu-toggle--m-secondary--hover--before--BorderWidth: var(--pf-global--BorderWidth--md);
15679
+ --pf-c-menu-toggle--m-secondary--focus--before--BorderWidth: var(--pf-global--BorderWidth--md);
15680
+ --pf-c-menu-toggle--m-secondary--active--before--BorderWidth: var(--pf-global--BorderWidth--md);
15681
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
15682
+ --pf-c-menu-toggle--m-secondary--hover--before--BorderColor: var(--pf-global--primary-color--100);
15683
+ --pf-c-menu-toggle--m-secondary--focus--before--BorderColor: var(--pf-global--primary-color--100);
15684
+ --pf-c-menu-toggle--m-secondary--active--before--BorderColor: var(--pf-global--primary-color--100);
15685
+ --pf-c-menu-toggle--m-secondary--m-expanded--Color: var(--pf-global--primary-color--100);
15686
+ --pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
15687
+ --pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--md);
15515
15688
  --pf-c-menu-toggle--m-plain--Color: var(--pf-global--Color--200);
15516
15689
  --pf-c-menu-toggle--m-plain--PaddingRight: var(--pf-global--spacer--md);
15517
15690
  --pf-c-menu-toggle--m-plain--PaddingLeft: var(--pf-global--spacer--md);
@@ -15542,6 +15715,7 @@ ul.pf-c-list {
15542
15715
  color: var(--pf-c-menu-toggle--Color);
15543
15716
  background-color: var(--pf-c-menu-toggle--BackgroundColor);
15544
15717
  border: 0;
15718
+ border-radius: var(--pf-c-menu-toggle--BorderRadius);
15545
15719
  }
15546
15720
 
15547
15721
  .pf-c-menu-toggle::before, .pf-c-menu-toggle::after {
@@ -15565,6 +15739,7 @@ ul.pf-c-list {
15565
15739
  }
15566
15740
 
15567
15741
  .pf-c-menu-toggle.pf-m-primary {
15742
+ --pf-c-menu-toggle--BorderRadius: var(--pf-c-menu-toggle--m-primary--BorderRadius);
15568
15743
  --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-primary--Color);
15569
15744
  --pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--m-primary--BackgroundColor);
15570
15745
  --pf-c-menu-toggle--hover--BackgroundColor: var(--pf-c-menu-toggle--m-primary--hover--BackgroundColor);
@@ -15574,6 +15749,48 @@ ul.pf-c-list {
15574
15749
  --pf-c-menu-toggle--m-expanded--BackgroundColor: var(--pf-c-menu-toggle--m-primary--m-expanded--BackgroundColor);
15575
15750
  }
15576
15751
 
15752
+ .pf-c-menu-toggle.pf-m-primary, .pf-c-menu-toggle.pf-m-primary::before {
15753
+ border-radius: var(--pf-c-menu-toggle--m-primary--BorderRadius);
15754
+ }
15755
+
15756
+ .pf-c-menu-toggle.pf-m-secondary {
15757
+ --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-secondary--Color);
15758
+ --pf-c-menu-toggle--m-expanded--Color: var(--pf-c-menu-toggle--m-secondary--m-expanded--Color);
15759
+ }
15760
+
15761
+ .pf-c-menu-toggle.pf-m-secondary, .pf-c-menu-toggle.pf-m-secondary::before {
15762
+ border-radius: var(--pf-c-menu-toggle--m-secondary--BorderRadius);
15763
+ }
15764
+
15765
+ .pf-c-menu-toggle.pf-m-secondary::before {
15766
+ border-color: var(--pf-c-menu-toggle--m-secondary--before--BorderColor);
15767
+ border-width: var(--pf-c-menu-toggle--m-secondary--before--BorderWidth);
15768
+ }
15769
+
15770
+ .pf-c-menu-toggle.pf-m-secondary::after {
15771
+ border: 0;
15772
+ }
15773
+
15774
+ .pf-c-menu-toggle.pf-m-secondary:hover {
15775
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-secondary--hover--before--BorderColor);
15776
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-secondary--hover--before--BorderWidth);
15777
+ }
15778
+
15779
+ .pf-c-menu-toggle.pf-m-secondary:focus {
15780
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-secondary--focus--before--BorderColor);
15781
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-secondary--focus--before--BorderWidth);
15782
+ }
15783
+
15784
+ .pf-c-menu-toggle.pf-m-secondary:active {
15785
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-secondary--active--before--BorderColor);
15786
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-secondary--active--before--BorderWidth);
15787
+ }
15788
+
15789
+ .pf-c-menu-toggle.pf-m-secondary.pf-m-expanded {
15790
+ --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderColor);
15791
+ --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderWidth);
15792
+ }
15793
+
15577
15794
  .pf-c-menu-toggle.pf-m-plain:not(.pf-m-text) {
15578
15795
  --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-plain--Color);
15579
15796
  --pf-c-menu-toggle--hover--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
@@ -16098,7 +16315,6 @@ ul.pf-c-list {
16098
16315
  --pf-c-nav__item--m-flyout--focus__link--before--BorderWidth: 0;
16099
16316
  --pf-c-nav__item--m-flyout--active__link--before--BorderWidth: 0;
16100
16317
  --pf-c-nav__item--m-flyout__item--last-child__link--before--BorderBottomWidth: 0;
16101
- --pf-c-nav__item--m-flyout--c-menu--BoxShadow: var(--pf-global--BoxShadow--lg);
16102
16318
  --pf-c-nav__item--m-flyout--c-menu--Top: calc(0px + var(--pf-c-nav__item--m-flyout--c-menu--top-offset));
16103
16319
  --pf-c-nav__item--m-flyout--c-menu--c-menu--Top: calc(var(--pf-c-nav__item--m-flyout--c-menu--Top) - var(--pf-c-nav__item--before--BorderWidth));
16104
16320
  --pf-c-nav__item--m-flyout--c-menu__list-item--first-child--c-menu--Top: 0;
@@ -16107,11 +16323,10 @@ ul.pf-c-list {
16107
16323
  --pf-c-nav__item--m-flyout--c-menu--m-top--Bottom: calc(0 + var(--pf-c-nav__item--m-flyout--c-menu--m-top--bottom-offset));
16108
16324
  --pf-c-nav__item--m-flyout--c-menu--BackgroundColor: var(--pf-global--BackgroundColor--dark-300);
16109
16325
  --pf-c-nav__item--m-flyout--c-menu__item--Color: var(--pf-c-nav__link--Color);
16326
+ --pf-c-nav__item--m-flyout--c-menu__item--PaddingTop: var(--pf-global--spacer--sm);
16110
16327
  --pf-c-nav__item--m-flyout--c-menu__item--PaddingRight: var(--pf-global--spacer--lg);
16328
+ --pf-c-nav__item--m-flyout--c-menu__item--PaddingBottom: var(--pf-global--spacer--sm);
16111
16329
  --pf-c-nav__item--m-flyout--c-menu__item--PaddingLeft: var(--pf-global--spacer--lg);
16112
- --pf-c-nav__item--m-flyout--c-menu__list-item--hover--BackgroundColor: var(--pf-c-nav__link--hover--BackgroundColor);
16113
- --pf-c-nav__item--m-flyout--c-menu__list-item--focus-within--BackgroundColor: var(--pf-c-nav__link--focus--BackgroundColor);
16114
- --pf-c-nav__item--m-flyout--c-menu__list-item--active--BackgroundColor: var(--pf-c-nav__link--active--BackgroundColor);
16115
16330
  --pf-c-nav__item--m-flyout--c-menu__item-description--Color: var(--pf-global--Color--light-200);
16116
16331
  --pf-c-nav__item--m-flyout--c-menu__item--FontSize: var(--pf-global--FontSize--sm);
16117
16332
  --pf-c-nav__item--m-flyout--c-menu__item--OutlineOffset: var(--pf-c-nav__link--OutlineOffset);
@@ -16120,17 +16335,52 @@ ul.pf-c-list {
16120
16335
  --pf-c-nav__item--m-flyout--c-menu__item--hover--after--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
16121
16336
  --pf-c-nav__item--m-flyout--c-menu__item--hover--after--BorderLeftColor: var(--pf-global--BorderColor--200);
16122
16337
  --pf-c-nav__item--m-flyout--c-menu__item--hover--after--Top: calc(-1 * var(--pf-c-nav__item--m-flyout--c-menu__item--before--BorderBottomWidth));
16338
+ --pf-c-nav__item--m-flyout--c-menu__list-item--hover--BackgroundColor: var(--pf-c-nav__link--hover--BackgroundColor);
16339
+ --pf-c-nav__item--m-flyout--c-menu__list-item--focus-within--BackgroundColor: var(--pf-c-nav__link--focus--BackgroundColor);
16340
+ --pf-c-nav__item--m-flyout--c-menu__list-item--active--BackgroundColor: var(--pf-c-nav__link--active--BackgroundColor);
16123
16341
  --pf-c-nav__item--m-flyout--c-menu__list-item--first-child__item--hover--after--Top: 0;
16124
- --pf-c-nav__item--m-drilldown__subnav--PaddingTop: 0;
16125
- --pf-c-nav__item--m-drilldown__subnav--PaddingLeft: 0;
16126
- --pf-c-nav__item--m-drilldown__subnav--PaddingBottom: 0;
16127
- --pf-c-nav__item--m-drilldown__subnav--BackgroundColor: var(--pf-global--BackgroundColor--dark-300);
16128
- --pf-c-nav__item--m-drilldown__subnav--ZIndex: var(--pf-global--ZIndex--xs);
16129
- --pf-c-nav__item--m-drilldown__link--PaddingTop: var(--pf-global--spacer--md);
16130
- --pf-c-nav__item--m-drilldown__link--PaddingBottom: var(--pf-global--spacer--md);
16131
- --pf-c-nav__item--m-drilldown__link--FontSize: var(--pf-global--FontSize--md);
16132
- --pf-c-nav__item--m-drilldown--m-expanded__toggle-icon--Rotate: 0;
16133
- --pf-c-nav__item--m-drilldown--m-expanded__subnav--ZIndex: var(--pf-global--ZIndex--xs);
16342
+ --pf-c-nav__item--m-flyout--c-menu--BoxShadow: var(--pf-global--BoxShadow--lg);
16343
+ --pf-c-nav--c-menu--BackgroundColor: var(--pf-global--BackgroundColor--dark-300);
16344
+ --pf-c-nav--c-menu__list--PaddingTop: 0;
16345
+ --pf-c-nav--c-menu__list--PaddingBottom: 0;
16346
+ --pf-c-nav--c-menu__list-item--Color: var(--pf-global--Color--light-100);
16347
+ --pf-c-nav--c-menu__list-item--hover--Color: var(--pf-global--Color--light-100);
16348
+ --pf-c-nav--c-menu__list-item--active--Color: var(--pf-global--Color--light-100);
16349
+ --pf-c-nav--c-menu__list-item--focus-within--Color: var(--pf-global--Color--light-100);
16350
+ --pf-c-nav--c-menu__list-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--dark-200);
16351
+ --pf-c-nav--c-menu__list-item--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--dark-200);
16352
+ --pf-c-nav--c-menu__item--PaddingTop: var(--pf-global--spacer--md);
16353
+ --pf-c-nav--c-menu__item--PaddingRight: var(--pf-global--spacer--md);
16354
+ --pf-c-nav--c-menu__item--PaddingBottom: var(--pf-global--spacer--md);
16355
+ --pf-c-nav--c-menu__item--PaddingLeft: var(--pf-global--spacer--md);
16356
+ --pf-c-nav--c-menu__item--xl--PaddingRight: var(--pf-global--spacer--lg);
16357
+ --pf-c-nav--c-menu__item--xl--PaddingLeft: var(--pf-global--spacer--lg);
16358
+ --pf-c-nav--c-menu__item--FontSize: var(--pf-global--FontSize--sm);
16359
+ --pf-c-nav--c-menu__item--OutlineOffset: calc(var(--pf-global--spacer--xs) * -1);
16360
+ --pf-c-nav--c-menu__item--before--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
16361
+ --pf-c-nav--c-menu__item--before--BorderBottomColor: var(--pf-global--BackgroundColor--dark-200);
16362
+ --pf-c-nav--c-menu__item--after--BorderLeftWidth: 0;
16363
+ --pf-c-nav--c-menu__item--after--BorderLeftColor: transparent;
16364
+ --pf-c-nav--c-menu__item--m-current--BackgroundColor: var(--pf-global--BackgroundColor--dark-400);
16365
+ --pf-c-nav--c-menu__item--m-current--after--BorderLeftWidth: var(--pf-global--BorderWidth--xl);
16366
+ --pf-c-nav--c-menu__item--m-current--after--BorderColor: var(--pf-global--active-color--400);
16367
+ --pf-c-nav--c-menu__item-description--Color: var(--pf-global--Color--400);
16368
+ --pf-c-nav--c-menu--m-flyout--left-offset: 0.25rem;
16369
+ --pf-c-nav--c-menu--m-flyout--m-left--right-offset: 0.25rem;
16370
+ --pf-c-nav--c-menu--m-flyout--Top: 0;
16371
+ --pf-c-nav--c-menu--m-flyout--c-menu--Top: calc(var(--pf-c-nav--c-menu--m-flyout--Top) * -1);
16372
+ --pf-c-nav--c-menu--m-flyout--c-menu--Right: auto;
16373
+ --pf-c-nav--c-menu--m-flyout--c-menu--Bottom: auto;
16374
+ --pf-c-nav--c-menu--m-flyout--c-menu--Left: calc(100% - var(--pf-c-nav--c-menu--m-flyout--left-offset));
16375
+ --pf-c-nav--c-menu--m-flyout--m-left--Right: calc(100% - var(--pf-c-nav--c-menu--m-flyout--m-left--right-offset));
16376
+ --pf-c-nav--c-menu--m-flyout--m-top--Bottom: 0;
16377
+ --pf-c-nav--c-menu--m-flyout--BoxShadow: var(--pf-global--BoxShadow--lg);
16378
+ --pf-c-nav--c-menu--m-flyout__item--PaddingTop: var(--pf-global--spacer--sm);
16379
+ --pf-c-nav--c-menu--m-flyout__item--PaddingRight: var(--pf-global--spacer--lg);
16380
+ --pf-c-nav--c-menu--m-flyout__item--PaddingBottom: var(--pf-global--spacer--sm);
16381
+ --pf-c-nav--c-menu--m-flyout__item--PaddingLeft: var(--pf-global--spacer--lg);
16382
+ --pf-c-nav--c-menu--m-flyout__item--hover--after--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
16383
+ --pf-c-nav--c-menu--m-flyout__item--hover--after--BorderLeftColor: var(--pf-global--BorderColor--200);
16134
16384
  --pf-c-nav__toggle--m-start--MarginRight: var(--pf-global--spacer--sm);
16135
16385
  position: relative;
16136
16386
  }
@@ -16148,8 +16398,98 @@ ul.pf-c-list {
16148
16398
  --pf-c-nav__section-title--PaddingRight: var(--pf-c-nav__section-title--xl--PaddingRight);
16149
16399
  --pf-c-nav__section-title--PaddingLeft: var(--pf-c-nav__section-title--xl--PaddingLeft);
16150
16400
  --pf-c-nav__subnav--PaddingLeft: var(--pf-c-nav__subnav--xl--PaddingLeft);
16401
+ --pf-c-nav--c-menu__item--PaddingRight: var(--pf-c-nav--c-menu__item--xl--PaddingRight);
16402
+ --pf-c-nav--c-menu__item--PaddingLeft: var(--pf-c-nav--c-menu__item--xl--PaddingLeft);
16151
16403
  }
16152
16404
  }
16405
+ .pf-c-nav .pf-c-menu {
16406
+ --pf-c-menu--MinWidth: 100%;
16407
+ --pf-c-menu--BackgroundColor: var(--pf-c-nav--c-menu--BackgroundColor);
16408
+ --pf-c-menu__list--PaddingTop: var(--pf-c-nav--c-menu__list--PaddingTop);
16409
+ --pf-c-menu__list--PaddingBottom: var(--pf-c-nav--c-menu__list--PaddingBottom);
16410
+ --pf-c-menu__item--PaddingTop: var(--pf-c-nav--c-menu__item--PaddingTop);
16411
+ --pf-c-menu__item--PaddingRight: var(--pf-c-nav--c-menu__item--PaddingRight);
16412
+ --pf-c-menu__item--PaddingBottom: var(--pf-c-nav--c-menu__item--PaddingBottom);
16413
+ --pf-c-menu__item--PaddingLeft: var(--pf-c-nav--c-menu__item--PaddingLeft);
16414
+ --pf-c-menu__list-item--Color: var(--pf-c-nav--c-menu__list-item--Color);
16415
+ --pf-c-menu__list-item--hover--Color: var(--pf-c-nav--c-menu__list-item--hover--Color);
16416
+ --pf-c-menu__list-item--active--Color: var(--pf-c-nav--c-menu__list-item--active--Color);
16417
+ --pf-c-menu__list-item--focus-within--Color: var(--pf-c-nav--c-menu__list-item--focus-within--Color);
16418
+ --pf-c-menu__list-item--hover--BackgroundColor: var(--pf-c-nav--c-menu__list-item--hover--BackgroundColor);
16419
+ --pf-c-menu__list-item--focus-within--BackgroundColor: var(--pf-c-nav--c-menu__list-item--focus-within--BackgroundColor);
16420
+ --pf-c-menu__item-description--Color: var(--pf-c-nav--c-menu__item-description--Color);
16421
+ }
16422
+
16423
+ .pf-c-nav .pf-c-menu:first-child > .pf-c-menu__content {
16424
+ border-bottom: var(--pf-c-nav--c-menu__item--before--BorderBottomWidth) solid var(--pf-c-nav--c-menu__item--before--BorderBottomColor);
16425
+ }
16426
+
16427
+ .pf-c-nav .pf-c-menu.pf-m-flyout, .pf-c-nav .pf-c-menu.pf-m-flyout .pf-c-menu {
16428
+ --pf-c-menu--BoxShadow: var(--pf-c-nav--c-menu--m-flyout--BoxShadow);
16429
+ --pf-c-menu__list--PaddingTop: 0;
16430
+ --pf-c-menu__list--PaddingBottom: 0;
16431
+ --pf-c-menu__item--FontSize: var(--pf-c-nav--c-menu__item--FontSize);
16432
+ --pf-c-menu__item--Color: var(--pf-c-nav--c-menu__item--Color);
16433
+ --pf-c-menu__item--PaddingTop: var(--pf-c-nav--c-menu--m-flyout__item--PaddingTop);
16434
+ --pf-c-menu__item--PaddingRight: var(--pf-c-nav--c-menu--m-flyout__item--PaddingRight);
16435
+ --pf-c-menu__item--PaddingBottom: var(--pf-c-nav--c-menu--m-flyout__item--PaddingBottom);
16436
+ --pf-c-menu__item--PaddingLeft: var(--pf-c-nav--c-menu--m-flyout__item--PaddingLeft);
16437
+ top: var(--pf-c-nav--c-menu--m-flyout--c-menu--Top);
16438
+ right: var(--pf-c-nav--c-menu--m-flyout--c-menu--Right);
16439
+ bottom: var(--pf-c-nav--c-menu--m-flyout--c-menu--Bottom);
16440
+ left: var(--pf-c-nav--c-menu--m-flyout--c-menu--Left);
16441
+ }
16442
+
16443
+ .pf-c-nav .pf-c-menu.pf-m-flyout .pf-c-menu__item:hover {
16444
+ --pf-c-nav--c-menu__item--after--BorderLeftWidth: var(--pf-c-nav--c-menu--m-flyout__item--hover--after--BorderLeftWidth);
16445
+ --pf-c-nav--c-menu__item--after--BorderLeftColor: var(--pf-c-nav--c-menu--m-flyout__item--hover--after--BorderLeftColor);
16446
+ }
16447
+
16448
+ .pf-c-nav .pf-c-menu.pf-m-top {
16449
+ --pf-c-nav--c-menu--m-flyout--c-menu--Top: auto;
16450
+ --pf-c-nav--c-menu--m-flyout--c-menu--Bottom: var(--pf-c-nav--c-menu--m-flyout--m-top--Bottom);
16451
+ }
16452
+
16453
+ .pf-c-nav .pf-c-menu.pf-m-left {
16454
+ --pf-c-nav--c-menu--m-flyout--c-menu--Right: var(--pf-c-nav--c-menu--m-flyout--m-left--Right);
16455
+ --pf-c-nav--c-menu--m-flyout--c-menu--Left: auto;
16456
+ }
16457
+
16458
+ .pf-c-nav .pf-c-menu .pf-c-divider {
16459
+ margin-top: 0;
16460
+ margin-bottom: 0;
16461
+ }
16462
+
16463
+ .pf-c-nav .pf-c-menu__item {
16464
+ position: relative;
16465
+ outline-offset: var(--pf-c-nav--c-menu__item--OutlineOffset);
16466
+ }
16467
+
16468
+ .pf-c-nav .pf-c-menu__item::before, .pf-c-nav .pf-c-menu__item::after {
16469
+ position: absolute;
16470
+ top: 0;
16471
+ content: "";
16472
+ }
16473
+
16474
+ .pf-c-nav .pf-c-menu__item::before {
16475
+ right: 0;
16476
+ bottom: calc(var(--pf-c-nav--c-menu__item--before--BorderBottomWidth) * -1);
16477
+ left: 0;
16478
+ border-bottom: var(--pf-c-nav--c-menu__item--before--BorderBottomWidth) solid var(--pf-c-nav--c-menu__item--before--BorderBottomColor);
16479
+ }
16480
+
16481
+ .pf-c-nav .pf-c-menu__item::after {
16482
+ bottom: 0;
16483
+ left: 0;
16484
+ border-left: var(--pf-c-nav--c-menu__item--after--BorderLeftWidth) solid var(--pf-c-nav--c-menu__item--after--BorderLeftColor);
16485
+ }
16486
+
16487
+ .pf-c-nav .pf-c-menu__item.pf-m-current {
16488
+ --pf-c-nav--c-menu__item--after--BorderLeftWidth: var(--pf-c-nav--c-menu__item--m-current--after--BorderLeftWidth);
16489
+ --pf-c-nav--c-menu__item--after--BorderLeftColor: var(--pf-c-nav--c-menu__item--m-current--after--BorderColor);
16490
+ background-color: var(--pf-c-nav--c-menu__item--m-current--BackgroundColor);
16491
+ }
16492
+
16153
16493
  .pf-c-nav.pf-m-horizontal .pf-c-nav__link::after, .pf-c-nav.pf-m-tertiary .pf-c-nav__link::after {
16154
16494
  content: none;
16155
16495
  }
@@ -16431,9 +16771,13 @@ ul.pf-c-list {
16431
16771
  --pf-c-menu__list-item--active--BackgroundColor: var(--pf-c-nav__item--m-flyout--c-menu__list-item--active--BackgroundColor);
16432
16772
  --pf-c-menu__item--FontSize: var(--pf-c-nav__item--m-flyout--c-menu__item--FontSize);
16433
16773
  --pf-c-menu__item--Color: var(--pf-c-nav__item--m-flyout--c-menu__item--Color);
16774
+ --pf-c-menu__item--PaddingTop: var(--pf-c-nav__item--m-flyout--c-menu__item--PaddingTop);
16434
16775
  --pf-c-menu__item--PaddingRight: var(--pf-c-nav__item--m-flyout--c-menu__item--PaddingRight);
16776
+ --pf-c-menu__item--PaddingBottom: var(--pf-c-nav__item--m-flyout--c-menu__item--PaddingBottom);
16435
16777
  --pf-c-menu__item--PaddingLeft: var(--pf-c-nav__item--m-flyout--c-menu__item--PaddingLeft);
16436
16778
  --pf-c-menu__item-description--Color: var(--pf-c-nav__item--m-flyout--c-menu__item-description--Color);
16779
+ --pf-c-nav--c-menu--m-flyout--c-menu--Bottom: var(--pf-c-nav__item--m-flyout--c-menu--m-top--Bottom);
16780
+ --pf-c-nav--c-menu--m-flyout--c-menu--Right: var(--pf-c-nav__item--m-flyout--c-menu--m-left--Right);
16437
16781
  position: absolute;
16438
16782
  top: var(--pf-c-nav__item--m-flyout--c-menu--Top);
16439
16783
  left: var(--pf-c-nav__item--m-flyout--c-menu--Left);
@@ -16443,16 +16787,6 @@ ul.pf-c-list {
16443
16787
  top: var(--pf-c-nav__item--m-flyout--c-menu--c-menu--Top);
16444
16788
  }
16445
16789
 
16446
- .pf-c-nav__item.pf-m-flyout .pf-c-menu.pf-m-top {
16447
- top: auto;
16448
- bottom: var(--pf-c-nav__item--m-flyout--c-menu--m-top--Bottom);
16449
- }
16450
-
16451
- .pf-c-nav__item.pf-m-flyout .pf-c-menu.pf-m-left {
16452
- right: var(--pf-c-nav__item--m-flyout--c-menu--m-left--Right);
16453
- left: auto;
16454
- }
16455
-
16456
16790
  .pf-c-nav__item.pf-m-flyout .pf-c-menu .pf-c-menu__list-item:first-child {
16457
16791
  --pf-c-nav__item--m-flyout--c-menu--c-menu--Top: var(--pf-c-nav__item--m-flyout--c-menu__list-item--first-child--c-menu--Top);
16458
16792
  --pf-c-nav__item--m-flyout--c-menu__item--hover--after--Top: var(--pf-c-nav__item--m-flyout--c-menu__list-item--first-child__item--hover--after--Top);
@@ -16481,27 +16815,6 @@ ul.pf-c-list {
16481
16815
  border-left: var(--pf-c-nav__item--m-flyout--c-menu__item--hover--after--BorderLeftWidth) solid var(--pf-c-nav__item--m-flyout--c-menu__item--hover--after--BorderLeftColor);
16482
16816
  }
16483
16817
 
16484
- .pf-c-nav__item.pf-m-drilldown {
16485
- --pf-c-nav__subnav--PaddingTop: var(--pf-c-nav__item--m-drilldown__subnav--PaddingTop);
16486
- --pf-c-nav__subnav--PaddingBottom: var(--pf-c-nav__item--m-drilldown__subnav--PaddingBottom);
16487
- --pf-c-nav__subnav--PaddingLeft: var(--pf-c-nav__item--m-drilldown__subnav--PaddingLeft);
16488
- --pf-c-nav__item--m-expanded__toggle-icon--Rotate: var(--pf-c-nav__item--m-drilldown--m-expanded__toggle-icon--Rotate);
16489
- }
16490
-
16491
- .pf-c-nav__item.pf-m-drilldown > .pf-c-nav__subnav {
16492
- --pf-c-nav__link--PaddingTop: var(--pf-c-nav__item--m-drilldown__link--PaddingTop);
16493
- --pf-c-nav__link--PaddingBottom: var(--pf-c-nav__item--m-drilldown__link--PaddingBottom);
16494
- --pf-c-nav__link--FontSize: var(--pf-c-nav__item--m-drilldown__link--FontSize);
16495
- --pf-c-nav__subnav--MaxHeight: 100%;
16496
- position: absolute;
16497
- top: 0;
16498
- left: 100%;
16499
- z-index: var(--pf-c-nav__item--m-drilldown__subnav--ZIndex);
16500
- width: 100%;
16501
- height: 100%;
16502
- background-color: var(--pf-c-nav__item--m-drilldown__subnav--BackgroundColor);
16503
- }
16504
-
16505
16818
  .pf-c-nav__item.pf-m-drilldown.pf-m-expanded > .pf-c-nav__subnav {
16506
16819
  left: 0;
16507
16820
  z-index: var(--pf-c-nav__item--m-drilldown--m-expanded__subnav--ZIndex);
@@ -20168,6 +20481,83 @@ label.pf-c-radio, .pf-c-radio__label,
20168
20481
  box-shadow: var(--pf-c-select__menu-footer--BoxShadow);
20169
20482
  }
20170
20483
 
20484
+ .pf-c-simple-list {
20485
+ --pf-c-simple-list__item-link--PaddingTop: var(--pf-global--spacer--xs);
20486
+ --pf-c-simple-list__item-link--PaddingRight: var(--pf-global--spacer--md);
20487
+ --pf-c-simple-list__item-link--PaddingBottom: var(--pf-global--spacer--xs);
20488
+ --pf-c-simple-list__item-link--PaddingLeft: var(--pf-global--spacer--md);
20489
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-global--BackgroundColor--100);
20490
+ --pf-c-simple-list__item-link--Color: var(--pf-global--Color--100);
20491
+ --pf-c-simple-list__item-link--FontSize: var(--pf-global--FontSize--sm);
20492
+ --pf-c-simple-list__item-link--FontWeight: var(--pf-global--FontWeight--normal);
20493
+ --pf-c-simple-list__item-link--m-current--Color: var(--pf-global--link--Color);
20494
+ --pf-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-global--BackgroundColor--200);
20495
+ --pf-c-simple-list__item-link--m-current--FontWeight: var(--pf-global--FontWeight--normal);
20496
+ --pf-c-simple-list__item-link--hover--Color: var(--pf-global--Color--100);
20497
+ --pf-c-simple-list__item-link--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
20498
+ --pf-c-simple-list__item-link--focus--Color: var(--pf-global--Color--100);
20499
+ --pf-c-simple-list__item-link--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
20500
+ --pf-c-simple-list__item-link--focus--FontWeight: var(--pf-global--FontWeight--normal);
20501
+ --pf-c-simple-list__item-link--active--Color: var(--pf-global--Color--100);
20502
+ --pf-c-simple-list__item-link--active--BackgroundColor: var(--pf-global--BackgroundColor--200);
20503
+ --pf-c-simple-list__item-link--active--FontWeight: var(--pf-global--FontWeight--normal);
20504
+ --pf-c-simple-list__title--PaddingTop: var(--pf-global--spacer--sm);
20505
+ --pf-c-simple-list__title--PaddingRight: var(--pf-global--spacer--md);
20506
+ --pf-c-simple-list__title--PaddingBottom: var(--pf-global--spacer--sm);
20507
+ --pf-c-simple-list__title--PaddingLeft: var(--pf-global--spacer--md);
20508
+ --pf-c-simple-list__title--FontSize: var(--pf-global--FontSize--sm);
20509
+ --pf-c-simple-list__title--Color: var(--pf-global--Color--dark-200);
20510
+ --pf-c-simple-list__title--FontWeight: var(--pf-global--FontWeight--semi-bold);
20511
+ --pf-c-simple-list__section--section--MarginTop: var(--pf-global--spacer--sm);
20512
+ }
20513
+
20514
+ .pf-c-simple-list__item-link {
20515
+ display: block;
20516
+ width: 100%;
20517
+ padding: var(--pf-c-simple-list__item-link--PaddingTop) var(--pf-c-simple-list__item-link--PaddingRight) var(--pf-c-simple-list__item-link--PaddingBottom) var(--pf-c-simple-list__item-link--PaddingLeft);
20518
+ font-size: var(--pf-c-simple-list__item-link--FontSize);
20519
+ font-weight: var(--pf-c-simple-list__item-link--FontWeight);
20520
+ color: var(--pf-c-simple-list__item-link--Color);
20521
+ text-align: left;
20522
+ background-color: var(--pf-c-simple-list__item-link--BackgroundColor);
20523
+ border: none;
20524
+ }
20525
+
20526
+ .pf-c-simple-list__item-link:hover {
20527
+ text-decoration: none;
20528
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--hover--BackgroundColor);
20529
+ --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--hover--Color);
20530
+ }
20531
+
20532
+ .pf-c-simple-list__item-link:focus {
20533
+ --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--focus--FontWeight);
20534
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--focus--BackgroundColor);
20535
+ --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--focus--Color);
20536
+ }
20537
+
20538
+ .pf-c-simple-list__item-link:active {
20539
+ --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--active--FontWeight);
20540
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--active--BackgroundColor);
20541
+ --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--active--Color);
20542
+ }
20543
+
20544
+ .pf-c-simple-list__item-link.pf-m-current {
20545
+ --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--m-current--FontWeight);
20546
+ --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--m-current--BackgroundColor);
20547
+ --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--m-current--Color);
20548
+ }
20549
+
20550
+ .pf-c-simple-list__title {
20551
+ padding: var(--pf-c-simple-list__title--PaddingTop) var(--pf-c-simple-list__title--PaddingRight) var(--pf-c-simple-list__title--PaddingBottom) var(--pf-c-simple-list__title--PaddingLeft);
20552
+ font-size: var(--pf-c-simple-list__title--FontSize);
20553
+ font-weight: var(--pf-c-simple-list__title--FontWeight);
20554
+ color: var(--pf-c-simple-list__title--Color);
20555
+ }
20556
+
20557
+ .pf-c-simple-list__section + .pf-c-simple-list__section {
20558
+ margin-top: var(--pf-c-simple-list__section--section--MarginTop);
20559
+ }
20560
+
20171
20561
  .pf-c-skeleton {
20172
20562
  --pf-c-skeleton--BackgroundColor: var(--pf-global--palette--black-150);
20173
20563
  --pf-c-skeleton--Width: auto;
@@ -21904,83 +22294,6 @@ label.pf-c-radio, .pf-c-radio__label,
21904
22294
  font-weight: var(--pf-global--FontWeight--light);
21905
22295
  }
21906
22296
 
21907
- .pf-c-simple-list {
21908
- --pf-c-simple-list__item-link--PaddingTop: var(--pf-global--spacer--xs);
21909
- --pf-c-simple-list__item-link--PaddingRight: var(--pf-global--spacer--md);
21910
- --pf-c-simple-list__item-link--PaddingBottom: var(--pf-global--spacer--xs);
21911
- --pf-c-simple-list__item-link--PaddingLeft: var(--pf-global--spacer--md);
21912
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-global--BackgroundColor--100);
21913
- --pf-c-simple-list__item-link--Color: var(--pf-global--Color--100);
21914
- --pf-c-simple-list__item-link--FontSize: var(--pf-global--FontSize--sm);
21915
- --pf-c-simple-list__item-link--FontWeight: var(--pf-global--FontWeight--normal);
21916
- --pf-c-simple-list__item-link--m-current--Color: var(--pf-global--link--Color);
21917
- --pf-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-global--BackgroundColor--200);
21918
- --pf-c-simple-list__item-link--m-current--FontWeight: var(--pf-global--FontWeight--normal);
21919
- --pf-c-simple-list__item-link--hover--Color: var(--pf-global--Color--100);
21920
- --pf-c-simple-list__item-link--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
21921
- --pf-c-simple-list__item-link--focus--Color: var(--pf-global--Color--100);
21922
- --pf-c-simple-list__item-link--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
21923
- --pf-c-simple-list__item-link--focus--FontWeight: var(--pf-global--FontWeight--normal);
21924
- --pf-c-simple-list__item-link--active--Color: var(--pf-global--Color--100);
21925
- --pf-c-simple-list__item-link--active--BackgroundColor: var(--pf-global--BackgroundColor--200);
21926
- --pf-c-simple-list__item-link--active--FontWeight: var(--pf-global--FontWeight--normal);
21927
- --pf-c-simple-list__title--PaddingTop: var(--pf-global--spacer--sm);
21928
- --pf-c-simple-list__title--PaddingRight: var(--pf-global--spacer--md);
21929
- --pf-c-simple-list__title--PaddingBottom: var(--pf-global--spacer--sm);
21930
- --pf-c-simple-list__title--PaddingLeft: var(--pf-global--spacer--md);
21931
- --pf-c-simple-list__title--FontSize: var(--pf-global--FontSize--sm);
21932
- --pf-c-simple-list__title--Color: var(--pf-global--Color--dark-200);
21933
- --pf-c-simple-list__title--FontWeight: var(--pf-global--FontWeight--semi-bold);
21934
- --pf-c-simple-list__section--section--MarginTop: var(--pf-global--spacer--sm);
21935
- }
21936
-
21937
- .pf-c-simple-list__item-link {
21938
- display: block;
21939
- width: 100%;
21940
- padding: var(--pf-c-simple-list__item-link--PaddingTop) var(--pf-c-simple-list__item-link--PaddingRight) var(--pf-c-simple-list__item-link--PaddingBottom) var(--pf-c-simple-list__item-link--PaddingLeft);
21941
- font-size: var(--pf-c-simple-list__item-link--FontSize);
21942
- font-weight: var(--pf-c-simple-list__item-link--FontWeight);
21943
- color: var(--pf-c-simple-list__item-link--Color);
21944
- text-align: left;
21945
- background-color: var(--pf-c-simple-list__item-link--BackgroundColor);
21946
- border: none;
21947
- }
21948
-
21949
- .pf-c-simple-list__item-link:hover {
21950
- text-decoration: none;
21951
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--hover--BackgroundColor);
21952
- --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--hover--Color);
21953
- }
21954
-
21955
- .pf-c-simple-list__item-link:focus {
21956
- --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--focus--FontWeight);
21957
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--focus--BackgroundColor);
21958
- --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--focus--Color);
21959
- }
21960
-
21961
- .pf-c-simple-list__item-link:active {
21962
- --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--active--FontWeight);
21963
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--active--BackgroundColor);
21964
- --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--active--Color);
21965
- }
21966
-
21967
- .pf-c-simple-list__item-link.pf-m-current {
21968
- --pf-c-simple-list__item-link--FontWeight: var(--pf-c-simple-list__item-link--m-current--FontWeight);
21969
- --pf-c-simple-list__item-link--BackgroundColor: var(--pf-c-simple-list__item-link--m-current--BackgroundColor);
21970
- --pf-c-simple-list__item-link--Color: var(--pf-c-simple-list__item-link--m-current--Color);
21971
- }
21972
-
21973
- .pf-c-simple-list__title {
21974
- padding: var(--pf-c-simple-list__title--PaddingTop) var(--pf-c-simple-list__title--PaddingRight) var(--pf-c-simple-list__title--PaddingBottom) var(--pf-c-simple-list__title--PaddingLeft);
21975
- font-size: var(--pf-c-simple-list__title--FontSize);
21976
- font-weight: var(--pf-c-simple-list__title--FontWeight);
21977
- color: var(--pf-c-simple-list__title--Color);
21978
- }
21979
-
21980
- .pf-c-simple-list__section + .pf-c-simple-list__section {
21981
- margin-top: var(--pf-c-simple-list__section--section--MarginTop);
21982
- }
21983
-
21984
22297
  .pf-c-tile {
21985
22298
  --pf-c-tile--PaddingTop: var(--pf-global--spacer--lg);
21986
22299
  --pf-c-tile--PaddingRight: var(--pf-global--spacer--lg);