@patternfly/patternfly 6.0.0-alpha.34 → 6.0.0-alpha.39

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 (76) hide show
  1. package/CODE_OF_CONDUCT.md +1 -2
  2. package/assets/images/PF-HorizontalLogo-Color.svg +29 -0
  3. package/assets/images/PF-HorizontalLogo-Reverse.svg +28 -0
  4. package/assets/images/PF-IconLogo-color.svg +17 -0
  5. package/components/Backdrop/backdrop.css +6 -2
  6. package/components/Backdrop/backdrop.scss +5 -2
  7. package/components/Banner/banner.css +4 -0
  8. package/components/Banner/banner.scss +5 -0
  9. package/components/Card/card.css +3 -0
  10. package/components/Card/card.scss +8 -0
  11. package/components/Divider/divider.css +97 -177
  12. package/components/Divider/divider.scss +60 -79
  13. package/components/Form/form.css +6 -0
  14. package/components/Form/form.scss +4 -1
  15. package/components/Masthead/masthead.css +267 -435
  16. package/components/Masthead/masthead.scss +118 -233
  17. package/components/MenuToggle/menu-toggle.css +1 -0
  18. package/components/MenuToggle/menu-toggle.scss +2 -0
  19. package/components/Popover/popover.css +0 -2
  20. package/components/Popover/popover.scss +2 -2
  21. package/components/SimpleList/simple-list.css +35 -52
  22. package/components/SimpleList/simple-list.scss +41 -51
  23. package/components/Table/table.scss +1 -0
  24. package/components/Tooltip/tooltip.css +0 -2
  25. package/components/Tooltip/tooltip.scss +3 -3
  26. package/components/Truncate/truncate.css +4 -0
  27. package/components/Truncate/truncate.scss +3 -0
  28. package/docs/components/Accordion/examples/Accordion.md +6 -6
  29. package/docs/components/Alert/examples/Alert.md +2 -2
  30. package/docs/components/Brand/examples/Brand.md +9 -33
  31. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  32. package/docs/components/Card/examples/Card.md +18 -20
  33. package/docs/components/Check/examples/Check.md +1 -0
  34. package/docs/components/Content/examples/Content.md +5 -5
  35. package/docs/components/Divider/examples/Divider.css +3 -1
  36. package/docs/components/Divider/examples/Divider.md +4 -5
  37. package/docs/components/InlineEdit/examples/InlineEdit.md +3 -1
  38. package/docs/components/Label/examples/Label.md +11 -11
  39. package/docs/components/Masthead/examples/masthead.md +441 -16
  40. package/docs/components/Nav/examples/Navigation.css +18 -2
  41. package/docs/components/Nav/examples/Navigation.md +1 -1
  42. package/docs/components/Radio/examples/Radio.md +1 -1
  43. package/docs/components/SimpleList/examples/SimpleList.md +3 -3
  44. package/docs/components/Table/examples/Table.md +8 -8
  45. package/docs/components/Truncate/examples/Truncate.css +2 -2
  46. package/docs/demos/AboutModal/examples/AboutModal.md +40 -42
  47. package/docs/demos/Alert/examples/Alert.md +120 -126
  48. package/docs/demos/BackToTop/examples/BackToTop.md +40 -42
  49. package/docs/demos/Banner/examples/Banner.md +79 -80
  50. package/docs/demos/CardView/examples/CardView.md +40 -42
  51. package/docs/demos/ContextSelector/examples/ContextSelector.md +129 -146
  52. package/docs/demos/Dashboard/examples/Dashboard.md +40 -42
  53. package/docs/demos/DataList/examples/DataList.md +160 -279
  54. package/docs/demos/DescriptionList/examples/DescriptionList.md +120 -126
  55. package/docs/demos/Drawer/examples/Drawer.md +200 -210
  56. package/docs/demos/JumpLinks/examples/JumpLinks.md +240 -252
  57. package/docs/demos/Masthead/examples/Masthead.md +143 -224
  58. package/docs/demos/Modal/examples/Modal.md +240 -252
  59. package/docs/demos/Nav/examples/Nav.md +320 -336
  60. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +200 -210
  61. package/docs/demos/Page/examples/Page.md +360 -378
  62. package/docs/demos/Page/examples/Penta.md +8 -15
  63. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +280 -294
  64. package/docs/demos/Skeleton/examples/Skeleton.md +40 -42
  65. package/docs/demos/Table/examples/Table.md +617 -647
  66. package/docs/demos/Tabs/examples/Tabs.md +240 -252
  67. package/docs/demos/Toolbar/examples/Toolbar.md +80 -84
  68. package/docs/demos/Wizard/examples/Wizard.md +360 -378
  69. package/docs/layouts/Flex/examples/Flex.md +11 -11
  70. package/package.json +32 -32
  71. package/patternfly-no-globals.css +422 -673
  72. package/patternfly-theme-dark-unversioned.css +422 -673
  73. package/patternfly.css +422 -673
  74. package/patternfly.min.css +1 -1
  75. package/patternfly.min.css.map +1 -1
  76. package/components/SimpleList/themes/dark/simple-list.scss +0 -14
package/patternfly-theme-dark-unversioned.css CHANGED
@@ -7456,10 +7456,14 @@ button) {
7456
7456
  }
7457
7457
  }
7458
7458
 
7459
+ :root,
7459
7460
  .pf-v5-c-backdrop {
7460
7461
  --pf-v5-c-backdrop--Position: fixed;
7461
- --pf-v5-c-backdrop--ZIndex: var(--pf-v5-global--ZIndex--lg);
7462
- --pf-v5-c-backdrop--BackgroundColor: var(--pf-v5-global--BackgroundColor--dark-transparent-100);
7462
+ --pf-v5-c-backdrop--ZIndex: var(--pf-t--global--Zindex--lg);
7463
+ --pf-v5-c-backdrop--BackgroundColor: var(--pf-t--global--background--color--backdrop--default);
7464
+ }
7465
+
7466
+ .pf-v5-c-backdrop {
7463
7467
  position: var(--pf-v5-c-backdrop--Position);
7464
7468
  inset-block-start: 0;
7465
7469
  inset-inline-start: 0;
@@ -7658,6 +7662,10 @@ button) {
7658
7662
  --pf-v5-c-banner--BackgroundColor: var(--pf-v5-c-banner--m-info--BackgroundColor);
7659
7663
  --pf-v5-c-banner--Color: var(--pf-v5-c-banner--m-info--Color);
7660
7664
  }
7665
+ .pf-v5-c-banner.pf-m-custom {
7666
+ --pf-v5-c-banner--BackgroundColor: var(--pf-v5-c-banner--m-custom--BackgroundColor);
7667
+ --pf-v5-c-banner--Color: var(--pf-v5-c-banner--m-custom--Color);
7668
+ }
7661
7669
  .pf-v5-c-banner.pf-m-red {
7662
7670
  --pf-v5-c-banner--BackgroundColor: var(--pf-v5-c-banner--m-red--BackgroundColor);
7663
7671
  --pf-v5-c-banner--Color: var(--pf-v5-c-banner--m-red--Color);
@@ -8747,6 +8755,9 @@ button.pf-v5-c-breadcrumb__link {
8747
8755
  background-color: var(--pf-v5-c-card--BackgroundColor);
8748
8756
  box-shadow: var(--pf-v5-c-card--BoxShadow);
8749
8757
  }
8758
+ .pf-v5-c-card.pf-m-selectable .pf-v5-c-card__selectable-actions :is(.pf-v5-c-check, .pf-v5-c-radio) {
8759
+ gap: 0;
8760
+ }
8750
8761
  .pf-v5-c-card.pf-m-selectable, .pf-v5-c-card.pf-m-clickable {
8751
8762
  isolation: isolate;
8752
8763
  box-shadow: none;
@@ -13036,341 +13047,261 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13036
13047
  --pf-v5-c-date-picker__calendar--Top: 100%;
13037
13048
  }
13038
13049
 
13050
+ :root,
13051
+ :where(.pf-v5-c-divider) {
13052
+ --pf-v5-c-divider--Display: flex;
13053
+ --pf-v5-c-divider--Color: var(--pf-t--global--border--color--default);
13054
+ --pf-v5-c-divider--Size: var(--pf-t--global--border--width--divider--default);
13055
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13056
+ }
13057
+
13039
13058
  .pf-v5-c-divider {
13040
- --pf-v5-c-divider--BorderWidth--base: var(--pf-v5-global--BorderWidth--sm);
13041
- --pf-v5-c-divider--BorderColor--base: var(--pf-v5-c-divider--BackgroundColor);
13042
- --pf-v5-c-divider--Height: var(--pf-v5-c-divider--BorderWidth--base);
13043
- --pf-v5-c-divider--BackgroundColor: var(--pf-v5-global--BorderColor--100);
13044
- --pf-v5-c-divider--after--BackgroundColor: var(--pf-v5-c-divider--BorderColor--base);
13045
- --pf-v5-c-divider--after--FlexBasis: 100%;
13046
- --pf-v5-c-divider--after--Inset: 0%;
13047
- --pf-v5-c-divider--m-vertical--after--FlexBasis: 100%;
13048
- --pf-v5-c-divider--m-horizontal--Display: flex;
13049
- --pf-v5-c-divider--m-horizontal--FlexDirection: row;
13050
- --pf-v5-c-divider--m-horizontal--after--Height: var(--pf-v5-c-divider--Height);
13051
- --pf-v5-c-divider--m-horizontal--after--Width: auto;
13052
- --pf-v5-c-divider--m-vertical--Display: inline-flex;
13053
- --pf-v5-c-divider--m-vertical--FlexDirection: column;
13054
- --pf-v5-c-divider--m-vertical--after--Height: auto;
13055
- --pf-v5-c-divider--m-vertical--after--Width: var(--pf-v5-c-divider--BorderWidth--base);
13056
- --pf-v5-hidden-visible--visible--Display: var(--pf-v5-c-divider--Display);
13057
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13058
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13059
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13060
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13059
+ flex-direction: row;
13061
13060
  width: 100%;
13062
- height: auto;
13063
- flex-direction: var(--pf-v5-c-divider--FlexDirection);
13064
- flex-shrink: 0;
13065
- align-items: center;
13066
- align-self: stretch;
13061
+ height: var(--pf-v5-c-divider--Size);
13062
+ --pf-v5-hidden-visible--visible--Display: var(--pf-v5-c-divider--Display);
13063
+ align-items: stretch;
13067
13064
  justify-content: center;
13068
13065
  border: 0;
13069
13066
  }
13070
- .pf-v5-c-divider::after {
13071
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13072
- }
13073
- .pf-v5-c-divider::after {
13074
- align-self: stretch;
13075
- justify-self: center;
13076
- width: var(--pf-v5-c-divider--after--Width);
13077
- height: var(--pf-v5-c-divider--after--Height);
13067
+ .pf-v5-c-divider::before {
13068
+ flex-basis: var(--pf-v5-c-divider--before--FlexBasis);
13078
13069
  content: "";
13079
- background-color: var(--pf-v5-c-divider--after--BackgroundColor);
13070
+ background-color: var(--pf-v5-c-divider--Color);
13080
13071
  }
13081
- .pf-v5-c-divider.pf-m-vertical {
13082
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13083
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13084
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13085
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13086
- width: auto;
13087
- height: inherit;
13072
+ .pf-v5-c-divider.pf-m-horizontal {
13073
+ flex-direction: row;
13074
+ width: 100%;
13075
+ height: var(--pf-v5-c-divider--Size);
13088
13076
  }
13089
- .pf-v5-c-divider.pf-m-vertical::after {
13090
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13077
+ .pf-v5-c-divider.pf-m-vertical {
13078
+ flex-direction: column;
13079
+ width: var(--pf-v5-c-divider--Size);
13080
+ height: 100%;
13091
13081
  }
13092
13082
  .pf-v5-c-divider.pf-m-inset-none {
13093
- --pf-v5-c-divider--after--Inset: 0%;
13083
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - 0% * 2);
13094
13084
  }
13095
13085
  .pf-v5-c-divider.pf-m-inset-xs {
13096
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13086
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13097
13087
  }
13098
13088
  .pf-v5-c-divider.pf-m-inset-sm {
13099
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13089
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13100
13090
  }
13101
13091
  .pf-v5-c-divider.pf-m-inset-md {
13102
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13092
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13103
13093
  }
13104
13094
  .pf-v5-c-divider.pf-m-inset-lg {
13105
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13095
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13106
13096
  }
13107
13097
  .pf-v5-c-divider.pf-m-inset-xl {
13108
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13098
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13109
13099
  }
13110
13100
  .pf-v5-c-divider.pf-m-inset-2xl {
13111
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13101
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13112
13102
  }
13113
13103
  .pf-v5-c-divider.pf-m-inset-3xl {
13114
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13104
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13115
13105
  }
13106
+
13116
13107
  @media (min-width: 576px) {
13117
13108
  .pf-v5-c-divider.pf-m-horizontal-on-sm {
13118
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13119
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13120
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13121
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13109
+ flex-direction: row;
13122
13110
  width: 100%;
13123
- height: auto;
13124
- }
13125
- .pf-v5-c-divider.pf-m-horizontal-on-sm::after {
13126
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13111
+ height: var(--pf-v5-c-divider--Size);
13127
13112
  }
13128
13113
  }
13129
13114
  @media (min-width: 576px) {
13130
13115
  .pf-v5-c-divider.pf-m-vertical-on-sm {
13131
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13132
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13133
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13134
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13135
- width: auto;
13136
- height: inherit;
13137
- }
13138
- .pf-v5-c-divider.pf-m-vertical-on-sm::after {
13139
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13116
+ flex-direction: column;
13117
+ width: var(--pf-v5-c-divider--Size);
13118
+ height: 100%;
13140
13119
  }
13141
13120
  }
13142
13121
  @media (min-width: 576px) {
13143
13122
  .pf-v5-c-divider.pf-m-inset-none-on-sm {
13144
- --pf-v5-c-divider--after--Inset: 0%;
13123
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13145
13124
  }
13146
13125
  .pf-v5-c-divider.pf-m-inset-xs-on-sm {
13147
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13126
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13148
13127
  }
13149
13128
  .pf-v5-c-divider.pf-m-inset-sm-on-sm {
13150
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13129
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13151
13130
  }
13152
13131
  .pf-v5-c-divider.pf-m-inset-md-on-sm {
13153
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13132
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13154
13133
  }
13155
13134
  .pf-v5-c-divider.pf-m-inset-lg-on-sm {
13156
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13135
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13157
13136
  }
13158
13137
  .pf-v5-c-divider.pf-m-inset-xl-on-sm {
13159
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13138
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13160
13139
  }
13161
13140
  .pf-v5-c-divider.pf-m-inset-2xl-on-sm {
13162
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13141
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13163
13142
  }
13164
13143
  .pf-v5-c-divider.pf-m-inset-3xl-on-sm {
13165
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13144
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13166
13145
  }
13167
13146
  }
13168
13147
  @media (min-width: 768px) {
13169
13148
  .pf-v5-c-divider.pf-m-horizontal-on-md {
13170
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13171
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13172
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13173
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13149
+ flex-direction: row;
13174
13150
  width: 100%;
13175
- height: auto;
13176
- }
13177
- .pf-v5-c-divider.pf-m-horizontal-on-md::after {
13178
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13151
+ height: var(--pf-v5-c-divider--Size);
13179
13152
  }
13180
13153
  }
13181
13154
  @media (min-width: 768px) {
13182
13155
  .pf-v5-c-divider.pf-m-vertical-on-md {
13183
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13184
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13185
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13186
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13187
- width: auto;
13188
- height: inherit;
13189
- }
13190
- .pf-v5-c-divider.pf-m-vertical-on-md::after {
13191
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13156
+ flex-direction: column;
13157
+ width: var(--pf-v5-c-divider--Size);
13158
+ height: 100%;
13192
13159
  }
13193
13160
  }
13194
13161
  @media (min-width: 768px) {
13195
13162
  .pf-v5-c-divider.pf-m-inset-none-on-md {
13196
- --pf-v5-c-divider--after--Inset: 0%;
13163
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13197
13164
  }
13198
13165
  .pf-v5-c-divider.pf-m-inset-xs-on-md {
13199
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13166
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13200
13167
  }
13201
13168
  .pf-v5-c-divider.pf-m-inset-sm-on-md {
13202
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13169
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13203
13170
  }
13204
13171
  .pf-v5-c-divider.pf-m-inset-md-on-md {
13205
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13172
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13206
13173
  }
13207
13174
  .pf-v5-c-divider.pf-m-inset-lg-on-md {
13208
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13175
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13209
13176
  }
13210
13177
  .pf-v5-c-divider.pf-m-inset-xl-on-md {
13211
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13178
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13212
13179
  }
13213
13180
  .pf-v5-c-divider.pf-m-inset-2xl-on-md {
13214
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13181
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13215
13182
  }
13216
13183
  .pf-v5-c-divider.pf-m-inset-3xl-on-md {
13217
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13184
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13218
13185
  }
13219
13186
  }
13220
13187
  @media (min-width: 992px) {
13221
13188
  .pf-v5-c-divider.pf-m-horizontal-on-lg {
13222
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13223
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13224
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13225
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13189
+ flex-direction: row;
13226
13190
  width: 100%;
13227
- height: auto;
13228
- }
13229
- .pf-v5-c-divider.pf-m-horizontal-on-lg::after {
13230
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13191
+ height: var(--pf-v5-c-divider--Size);
13231
13192
  }
13232
13193
  }
13233
13194
  @media (min-width: 992px) {
13234
13195
  .pf-v5-c-divider.pf-m-vertical-on-lg {
13235
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13236
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13237
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13238
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13239
- width: auto;
13240
- height: inherit;
13241
- }
13242
- .pf-v5-c-divider.pf-m-vertical-on-lg::after {
13243
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13196
+ flex-direction: column;
13197
+ width: var(--pf-v5-c-divider--Size);
13198
+ height: 100%;
13244
13199
  }
13245
13200
  }
13246
13201
  @media (min-width: 992px) {
13247
13202
  .pf-v5-c-divider.pf-m-inset-none-on-lg {
13248
- --pf-v5-c-divider--after--Inset: 0%;
13203
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13249
13204
  }
13250
13205
  .pf-v5-c-divider.pf-m-inset-xs-on-lg {
13251
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13206
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13252
13207
  }
13253
13208
  .pf-v5-c-divider.pf-m-inset-sm-on-lg {
13254
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13209
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13255
13210
  }
13256
13211
  .pf-v5-c-divider.pf-m-inset-md-on-lg {
13257
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13212
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13258
13213
  }
13259
13214
  .pf-v5-c-divider.pf-m-inset-lg-on-lg {
13260
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13215
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13261
13216
  }
13262
13217
  .pf-v5-c-divider.pf-m-inset-xl-on-lg {
13263
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13218
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13264
13219
  }
13265
13220
  .pf-v5-c-divider.pf-m-inset-2xl-on-lg {
13266
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13221
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13267
13222
  }
13268
13223
  .pf-v5-c-divider.pf-m-inset-3xl-on-lg {
13269
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13224
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13270
13225
  }
13271
13226
  }
13272
13227
  @media (min-width: 1200px) {
13273
13228
  .pf-v5-c-divider.pf-m-horizontal-on-xl {
13274
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13275
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13276
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13277
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13229
+ flex-direction: row;
13278
13230
  width: 100%;
13279
- height: auto;
13280
- }
13281
- .pf-v5-c-divider.pf-m-horizontal-on-xl::after {
13282
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13231
+ height: var(--pf-v5-c-divider--Size);
13283
13232
  }
13284
13233
  }
13285
13234
  @media (min-width: 1200px) {
13286
13235
  .pf-v5-c-divider.pf-m-vertical-on-xl {
13287
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13288
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13289
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13290
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13291
- width: auto;
13292
- height: inherit;
13293
- }
13294
- .pf-v5-c-divider.pf-m-vertical-on-xl::after {
13295
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13236
+ flex-direction: column;
13237
+ width: var(--pf-v5-c-divider--Size);
13238
+ height: 100%;
13296
13239
  }
13297
13240
  }
13298
13241
  @media (min-width: 1200px) {
13299
13242
  .pf-v5-c-divider.pf-m-inset-none-on-xl {
13300
- --pf-v5-c-divider--after--Inset: 0%;
13243
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13301
13244
  }
13302
13245
  .pf-v5-c-divider.pf-m-inset-xs-on-xl {
13303
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13246
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13304
13247
  }
13305
13248
  .pf-v5-c-divider.pf-m-inset-sm-on-xl {
13306
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13249
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13307
13250
  }
13308
13251
  .pf-v5-c-divider.pf-m-inset-md-on-xl {
13309
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13252
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13310
13253
  }
13311
13254
  .pf-v5-c-divider.pf-m-inset-lg-on-xl {
13312
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13255
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13313
13256
  }
13314
13257
  .pf-v5-c-divider.pf-m-inset-xl-on-xl {
13315
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13258
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13316
13259
  }
13317
13260
  .pf-v5-c-divider.pf-m-inset-2xl-on-xl {
13318
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13261
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13319
13262
  }
13320
13263
  .pf-v5-c-divider.pf-m-inset-3xl-on-xl {
13321
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13264
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13322
13265
  }
13323
13266
  }
13324
13267
  @media (min-width: 1450px) {
13325
13268
  .pf-v5-c-divider.pf-m-horizontal-on-2xl {
13326
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13327
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13328
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13329
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13269
+ flex-direction: row;
13330
13270
  width: 100%;
13331
- height: auto;
13332
- }
13333
- .pf-v5-c-divider.pf-m-horizontal-on-2xl::after {
13334
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13271
+ height: var(--pf-v5-c-divider--Size);
13335
13272
  }
13336
13273
  }
13337
13274
  @media (min-width: 1450px) {
13338
13275
  .pf-v5-c-divider.pf-m-vertical-on-2xl {
13339
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13340
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13341
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13342
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13343
- width: auto;
13344
- height: inherit;
13345
- }
13346
- .pf-v5-c-divider.pf-m-vertical-on-2xl::after {
13347
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13276
+ flex-direction: column;
13277
+ width: var(--pf-v5-c-divider--Size);
13278
+ height: 100%;
13348
13279
  }
13349
13280
  }
13350
13281
  @media (min-width: 1450px) {
13351
13282
  .pf-v5-c-divider.pf-m-inset-none-on-2xl {
13352
- --pf-v5-c-divider--after--Inset: 0%;
13283
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13353
13284
  }
13354
13285
  .pf-v5-c-divider.pf-m-inset-xs-on-2xl {
13355
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13286
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13356
13287
  }
13357
13288
  .pf-v5-c-divider.pf-m-inset-sm-on-2xl {
13358
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13289
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13359
13290
  }
13360
13291
  .pf-v5-c-divider.pf-m-inset-md-on-2xl {
13361
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13292
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13362
13293
  }
13363
13294
  .pf-v5-c-divider.pf-m-inset-lg-on-2xl {
13364
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13295
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13365
13296
  }
13366
13297
  .pf-v5-c-divider.pf-m-inset-xl-on-2xl {
13367
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13298
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13368
13299
  }
13369
13300
  .pf-v5-c-divider.pf-m-inset-2xl-on-2xl {
13370
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13301
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13371
13302
  }
13372
13303
  .pf-v5-c-divider.pf-m-inset-3xl-on-2xl {
13373
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13304
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13374
13305
  }
13375
13306
  }
13376
13307
 
@@ -15503,6 +15434,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
15503
15434
  max-width: var(--pf-v5-c-form--m-limit-width--MaxWidth);
15504
15435
  }
15505
15436
 
15437
+ .pf-v5-c-form__group {
15438
+ min-width: 0;
15439
+ }
15506
15440
  .pf-v5-c-form__group.pf-m-action {
15507
15441
  margin-block-start: var(--pf-v5-c-form__group--m-action--MarginTop);
15508
15442
  overflow: hidden;
@@ -15591,6 +15525,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
15591
15525
  --pf-v5-c-form__group-label-help--Color: var(--pf-v5-c-form__group-label-help--focus--Color);
15592
15526
  }
15593
15527
 
15528
+ .pf-v5-c-form__group-control {
15529
+ min-width: 0;
15530
+ }
15594
15531
  .pf-v5-c-form__group-control.pf-m-inline {
15595
15532
  display: flex;
15596
15533
  flex-flow: row wrap;
@@ -17900,616 +17837,448 @@ ul.pf-v5-c-list {
17900
17837
  padding-block-start: var(--pf-v5-c-login__footer--c-list--PaddingTop);
17901
17838
  }
17902
17839
 
17903
- :root {
17904
- --pf-v5-c-masthead--PaddingLeft: var(--pf-v5-c-masthead--inset);
17905
- --pf-v5-c-masthead--PaddingRight: var(--pf-v5-c-masthead--inset);
17840
+ :root,
17841
+ :where(.pf-v5-c-masthead) {
17842
+ --pf-v5-c-masthead--inset: var(--pf-t--global--spacer--lg);
17843
+ --pf-v5-c-masthead--PaddingBlockStart: var(--pf-t--global--spacer--md);
17844
+ --pf-v5-c-masthead--PaddingBlockEnd: var(--pf-t--global--spacer--md);
17845
+ --pf-v5-c-masthead--PaddingInlineStart: var(--pf-v5-c-masthead--inset);
17846
+ --pf-v5-c-masthead--PaddingInlineEnd: var(--pf-v5-c-masthead--inset);
17847
+ --pf-v5-c-masthead--AlignItems: start;
17848
+ --pf-v5-c-masthead--RowGap: var(--pf-t--global--spacer--sm);
17849
+ --pf-v5-c-masthead--ColumnGap: var(--pf-t--global--spacer--md);
17906
17850
  --pf-v5-c-masthead--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
17907
- --pf-v5-c-masthead--inset: var(--pf-t--global--spacer--md);
17908
- --pf-v5-c-masthead--xl--inset: var(--pf-t--global--spacer--lg);
17851
+ --pf-v5-c-masthead--BorderWidth: var(--pf-t--global--border--width--divider--default);
17852
+ --pf-v5-c-masthead--BorderColor: var(--pf-t--global--border--color--default);
17853
+ --pf-v5-c-masthead__brand--MarginInlineEnd: var(--pf-t--global--spacer--md);
17854
+ --pf-v5-c-masthead__brand--MaxHeight: 2.375rem;
17855
+ --pf-v5-c-masthead__toggle--Size: var(--pf-t--global--icon--size--xl);
17909
17856
  --pf-v5-c-masthead--m-display-stack--GridTemplateColumns: max-content 1fr;
17910
17857
  --pf-v5-c-masthead--m-display-stack__main--GridColumn: -1 / 1;
17911
- --pf-v5-c-masthead--m-display-stack__main--MinHeight: 4.375rem;
17912
17858
  --pf-v5-c-masthead--m-display-stack__main--Order: -1;
17913
- --pf-v5-c-masthead--m-display-stack__main--FlexBasis: 100%;
17914
- --pf-v5-c-masthead--m-display-stack__main--PaddingTop: var(--pf-t--global--spacer--lg);
17915
- --pf-v5-c-masthead--m-display-stack__main--PaddingBottom: var(--pf-t--global--spacer--md);
17916
- --pf-v5-c-masthead--m-display-stack__main--MarginRight: 0;
17917
- --pf-v5-c-masthead--m-display-stack__main--before--BorderBottom: var(--pf-v5-c-masthead__main--before--BorderBottomWidth) solid var(--pf-v5-c-masthead__main--before--BorderBottomColor);
17918
- --pf-v5-c-masthead--m-display-stack__toggle--GridColumn: 1;
17859
+ --pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd: var(--pf-v5-c-masthead--RowGap);
17860
+ --pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd: var(--pf-v5-c-masthead--BorderWidth) solid var(--pf-v5-c-masthead--BorderColor);
17919
17861
  --pf-v5-c-masthead--m-display-stack__content--GridColumn: 2;
17920
- --pf-v5-c-masthead--m-display-stack__content--MinHeight: auto;
17921
17862
  --pf-v5-c-masthead--m-display-stack__content--Order: 1;
17922
- --pf-v5-c-masthead--m-display-stack__content--PaddingTop: var(--pf-t--global--spacer--xs);
17923
- --pf-v5-c-masthead--m-display-stack__content--PaddingBottom: var(--pf-t--global--spacer--xs);
17924
- --pf-v5-c-masthead--m-display-stack__content--MarginLeft: 0;
17925
- --pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight: calc(var(--pf-v5-c-masthead--inset) * -1);
17926
- --pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-v5-c-masthead--inset) * -1);
17927
17863
  --pf-v5-c-masthead--m-display-inline--GridTemplateColumns: max-content max-content 1fr;
17928
17864
  --pf-v5-c-masthead--m-display-inline__main--GridColumn: 2;
17929
- --pf-v5-c-masthead--m-display-inline__main--MinHeight: 4.375rem;
17930
17865
  --pf-v5-c-masthead--m-display-inline__main--Order: 0;
17931
- --pf-v5-c-masthead--m-display-inline__main--FlexBasis: auto;
17932
- --pf-v5-c-masthead--m-display-inline__main--PaddingTop: 0;
17933
- --pf-v5-c-masthead--m-display-inline__main--PaddingBottom: 0;
17934
- --pf-v5-c-masthead--m-display-inline__main--MarginRight: calc(var(--pf-t--global--spacer--lg) / 2);
17935
- --pf-v5-c-masthead--m-display-inline__main--BorderBottom: 0;
17936
- --pf-v5-c-masthead--m-display-inline__toggle--GridColumn: 1;
17866
+ --pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd: 0;
17867
+ --pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd: 0;
17937
17868
  --pf-v5-c-masthead--m-display-inline__content--GridColumn: 3;
17938
- --pf-v5-c-masthead--m-display-inline__content--MinHeight: 4.375rem;
17939
17869
  --pf-v5-c-masthead--m-display-inline__content--Order: 0;
17940
- --pf-v5-c-masthead--m-display-inline__content--PaddingTop: 0;
17941
- --pf-v5-c-masthead--m-display-inline__content--PaddingBottom: 0;
17942
- --pf-v5-c-masthead--m-display-inline__content--MarginLeft: calc(var(--pf-t--global--spacer--lg) / 2);
17943
- --pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight: 0;
17944
- --pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft: 0;
17945
- --pf-v5-c-masthead__main--before--Right: calc(var(--pf-v5-c-masthead--inset) * -1);
17946
- --pf-v5-c-masthead__main--before--Left: calc(var(--pf-v5-c-masthead--inset) * -1);
17947
- --pf-v5-c-masthead__main--before--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
17948
- --pf-v5-c-masthead__main--before--BorderBottomColor: var(--pf-t--global--border--color--default);
17949
- --pf-v5-c-masthead__content--Gap: var(--pf-t--global--spacer--sm);
17950
- --pf-v5-c-masthead__toggle--MarginRight: var(--pf-t--global--spacer--sm);
17951
- --pf-v5-c-masthead__toggle--MarginLeft: calc(var(--pf-t--global--spacer--sm) * -1);
17952
- --pf-v5-c-masthead__toggle--c-button--FontSize: var(--pf-t--global--icon--size--lg);
17953
- --pf-v5-c-masthead--c-toolbar__item--Display: flex;
17954
- --pf-v5-c-masthead--item-border-color--base: var(--pf-t--global--border--color--default);
17955
- --pf-v5-c-masthead--c-context-selector--Width: auto;
17956
- --pf-v5-c-masthead--c-context-selector__toggle--BorderTopColor: var(--pf-v5-c-masthead--item-border-color--base);
17957
- --pf-v5-c-masthead--c-context-selector__toggle--BorderRightColor: var(--pf-v5-c-masthead--item-border-color--base);
17958
- --pf-v5-c-masthead--c-context-selector__toggle--BorderLeftColor: var(--pf-v5-c-masthead--item-border-color--base);
17959
- --pf-v5-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor: transparent;
17960
- --pf-v5-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor: transparent;
17961
- --pf-v5-c-masthead--c-dropdown__toggle--before--BorderTopColor: var(--pf-v5-c-masthead--item-border-color--base);
17962
- --pf-v5-c-masthead--c-dropdown__toggle--before--BorderRightColor: var(--pf-v5-c-masthead--item-border-color--base);
17963
- --pf-v5-c-masthead--c-dropdown__toggle--before--BorderLeftColor: var(--pf-v5-c-masthead--item-border-color--base);
17964
- --pf-v5-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor: transparent;
17965
- --pf-v5-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor: transparent;
17966
- --pf-v5-c-masthead--c-menu-toggle--before--BorderTopColor: var(--pf-v5-c-masthead--item-border-color--base);
17967
- --pf-v5-c-masthead--c-menu-toggle--before--BorderRightColor: var(--pf-v5-c-masthead--item-border-color--base);
17968
- --pf-v5-c-masthead--c-menu-toggle--before--BorderLeftColor: var(--pf-v5-c-masthead--item-border-color--base);
17969
- --pf-v5-c-masthead--c-toolbar--BackgroundColor: var(--pf-v5-c-masthead--BackgroundColor);
17970
- --pf-v5-c-masthead--c-toolbar--AlignItems--base: center;
17971
- --pf-v5-c-masthead--c-toolbar__content--PaddingRight: 0;
17972
- --pf-v5-c-masthead--c-toolbar__content--PaddingLeft: 0;
17973
- --pf-v5-c-masthead--c-toolbar__expandable-content--PaddingTop: var(--pf-t--global--spacer--md);
17974
- --pf-v5-c-masthead--c-toolbar__expandable-content--PaddingRight: var(--pf-v5-c-masthead--inset);
17975
- --pf-v5-c-masthead--c-toolbar__expandable-content--PaddingBottom: var(--pf-t--global--spacer--md);
17976
- --pf-v5-c-masthead--c-toolbar__expandable-content--PaddingLeft: var(--pf-v5-c-masthead--inset);
17977
- --pf-v5-c-masthead--c-toolbar__expandable-content--before--BorderTopWidth: var(--pf-t--global--border--width--divider--default);
17978
- --pf-v5-c-masthead--c-toolbar__expandable-content--before--BorderTopColor: var(--pf-v5-c-masthead--item-border-color--base);
17870
+ --pf-v5-c-masthead__expandable-content--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
17871
+ --pf-v5-c-masthead__expandable-content--BorderBlockStart: var(--pf-v5-c-masthead--BorderWidth) solid var(--pf-v5-c-masthead--BorderColor);
17979
17872
  }
17980
17873
 
17981
17874
  .pf-v5-c-masthead {
17982
- --pf-v5-c-toolbar--BackgroundColor: var(--pf-v5-c-masthead--c-toolbar--BackgroundColor);
17983
- --pf-v5-c-toolbar--AlignItems--base: var(--pf-v5-c-masthead--c-toolbar--AlignItems--base);
17984
- --pf-v5-c-toolbar__content--PaddingRight: var(--pf-v5-c-masthead--c-toolbar__content--PaddingRight);
17985
- --pf-v5-c-toolbar__content--PaddingLeft: var(--pf-v5-c-masthead--c-toolbar__content--PaddingLeft);
17986
- --pf-v5-c-toolbar__expandable-content--PaddingTop: var(--pf-v5-c-masthead--c-toolbar__expandable-content--PaddingTop);
17987
- --pf-v5-c-toolbar__expandable-content--PaddingRight: var(--pf-v5-c-masthead--c-toolbar__expandable-content--PaddingRight);
17988
- --pf-v5-c-toolbar__expandable-content--PaddingBottom: var(--pf-v5-c-masthead--c-toolbar__expandable-content--PaddingBottom);
17989
- --pf-v5-c-toolbar__expandable-content--PaddingLeft: var(--pf-v5-c-masthead--c-toolbar__expandable-content--PaddingLeft);
17990
- --pf-v5-c-context-selector--Width: var(--pf-v5-c-masthead--c-context-selector--Width);
17991
- --pf-v5-c-context-selector__toggle--BorderTopColor: var(--pf-v5-c-masthead--c-context-selector__toggle--BorderTopColor);
17992
- --pf-v5-c-context-selector__toggle--BorderRightColor: var(--pf-v5-c-masthead--c-context-selector__toggle--BorderRightColor);
17993
- --pf-v5-c-context-selector__toggle--BorderLeftColor: var(--pf-v5-c-masthead--c-context-selector__toggle--BorderLeftColor);
17994
- --pf-v5-c-dropdown__toggle--before--BorderTopColor: var(--pf-v5-c-masthead--c-dropdown__toggle--before--BorderTopColor);
17995
- --pf-v5-c-dropdown__toggle--before--BorderRightColor: var(--pf-v5-c-masthead--c-dropdown__toggle--before--BorderRightColor);
17996
- --pf-v5-c-dropdown__toggle--before--BorderLeftColor: var(--pf-v5-c-masthead--c-dropdown__toggle--before--BorderLeftColor);
17997
- --pf-v5-c-menu-toggle--before--BorderTopColor: var(--pf-v5-c-masthead--c-menu-toggle--before--BorderTopColor);
17998
- --pf-v5-c-menu-toggle--before--BorderRightColor: var(--pf-v5-c-masthead--c-menu-toggle--before--BorderRightColor);
17999
- --pf-v5-c-menu-toggle--before--BorderLeftColor: var(--pf-v5-c-masthead--c-menu-toggle--before--BorderLeftColor);
18000
- --pf-v5-c-menu-toggle--m-full-height__toggle--after--BorderBottomWidth: 0;
17875
+ --pf-v5-c-toolbar--PaddingTop: 0;
17876
+ --pf-v5-c-toolbar--PaddingBottom: 0;
17877
+ --pf-v5-c-toolbar__content--PaddingRight: 0;
17878
+ --pf-v5-c-toolbar__content--PaddingLeft: 0;
17879
+ --pf-v5-c-toolbar__expandable-content--PaddingTop: var(--pf-t--global--spacer--md);
17880
+ --pf-v5-c-toolbar__expandable-content--PaddingRight: var(--pf-v5-c-masthead--inset);
17881
+ --pf-v5-c-toolbar__expandable-content--PaddingBottom: var(--pf-t--global--spacer--md);
17882
+ --pf-v5-c-toolbar__expandable-content--PaddingLeft: var(--pf-v5-c-masthead--inset);
17883
+ --pf-v5-c-toolbar__expandable-content--BackgroundColor: var(--pf-v5-c-masthead--BackgroundColor);
17884
+ --pf-v5-c-toolbar__expandable-content--lg--PaddingRight: var(--pf-v5-c-masthead--PaddingInlineStart);
17885
+ --pf-v5-c-toolbar__expandable-content--lg--PaddingBottom: var(--pf-t--global--spacer--md);
17886
+ --pf-v5-c-toolbar__expandable-content--lg--PaddingLeft: var(--pf-v5-c-masthead--PaddingInlineEnd);
18001
17887
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18002
17888
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18003
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18004
17889
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18005
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18006
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18007
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18008
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18009
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
17890
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
17891
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18010
17892
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18011
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18012
17893
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18013
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18014
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18015
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18016
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18017
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18018
- position: relative;
18019
17894
  display: grid;
18020
17895
  grid-template-columns: var(--pf-v5-c-masthead--GridTemplateColumns);
18021
- align-items: center;
17896
+ row-gap: var(--pf-v5-c-masthead--RowGap);
17897
+ column-gap: var(--pf-v5-c-masthead--ColumnGap);
17898
+ align-items: var(--pf-v5-c-masthead--AlignItems);
18022
17899
  min-width: 0;
18023
- padding-inline-start: var(--pf-v5-c-masthead--PaddingLeft);
18024
- padding-inline-end: var(--pf-v5-c-masthead--PaddingRight);
17900
+ padding-block-start: var(--pf-v5-c-masthead--PaddingBlockStart);
17901
+ padding-block-end: var(--pf-v5-c-masthead--PaddingBlockEnd);
17902
+ padding-inline-start: var(--pf-v5-c-masthead--inset);
17903
+ padding-inline-end: var(--pf-v5-c-masthead--inset);
18025
17904
  background-color: var(--pf-v5-c-masthead--BackgroundColor);
18026
17905
  }
18027
17906
  @media screen and (min-width: 768px) {
18028
17907
  :where(:not(.pf-m-resize-observer)) .pf-v5-c-masthead {
18029
17908
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18030
17909
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18031
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18032
17910
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18033
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18034
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18035
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18036
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18037
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
17911
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
17912
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18038
17913
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18039
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18040
17914
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18041
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18042
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18043
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18044
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18045
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18046
- }
18047
- }
18048
- @media screen and (min-width: 1200px) {
18049
- .pf-v5-c-masthead {
18050
- --pf-v5-c-masthead--inset: var(--pf-v5-c-masthead--xl--inset);
18051
17915
  }
18052
17916
  }
18053
17917
  .pf-v5-c-masthead .pf-v5-c-toolbar {
18054
17918
  width: 100%;
18055
17919
  }
18056
- .pf-v5-c-masthead .pf-v5-c-toolbar__content-section {
18057
- flex-wrap: nowrap;
18058
- }
18059
17920
  .pf-v5-c-masthead .pf-v5-c-toolbar__expandable-content {
18060
17921
  inset-block-start: 100%;
17922
+ border-block-start: var(--pf-v5-c-masthead__expandable-content--BorderBlockStart);
17923
+ box-shadow: var(--pf-v5-c-masthead__expandable-content--BoxShadow);
18061
17924
  }
18062
- .pf-v5-c-masthead .pf-v5-c-toolbar__expandable-content::before {
18063
- position: absolute;
18064
- inset: 0;
18065
- content: "";
18066
- border-block-start: var(--pf-v5-c-masthead--c-toolbar__expandable-content--before--BorderTopWidth) solid var(--pf-v5-c-masthead--c-toolbar__expandable-content--before--BorderTopColor);
18067
- box-shadow: var(--pf-v5-c-toolbar__expandable-content--before--BoxShadow);
17925
+ .pf-v5-c-masthead.pf-m-display-stack {
17926
+ --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
17927
+ --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
17928
+ --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
17929
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
17930
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
17931
+ --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
17932
+ --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
17933
+ }
17934
+ .pf-v5-c-masthead.pf-m-display-inline {
17935
+ --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
17936
+ --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
17937
+ --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
17938
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
17939
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
17940
+ --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
17941
+ --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18068
17942
  }
18069
- .pf-v5-c-masthead .pf-v5-c-context-selector.pf-m-full-height {
18070
- --pf-v5-c-context-selector__toggle--BorderTopColor: var(--pf-v5-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor);
18071
- --pf-v5-c-context-selector__toggle--BorderBottomColor: var(--pf-v5-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor);
17943
+ .pf-v5-c-masthead.pf-m-inset-none {
17944
+ padding-inline-start: 0;
17945
+ padding-inline-end: 0;
17946
+ }
17947
+ .pf-v5-c-masthead.pf-m-inset-sm {
17948
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
17949
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18072
17950
  }
18073
- .pf-v5-c-masthead .pf-v5-c-dropdown.pf-m-full-height {
18074
- --pf-v5-c-dropdown__toggle--before--BorderTopColor: var(--pf-v5-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor);
18075
- --pf-v5-c-dropdown__toggle--before--BorderBottomColor: var(--pf-v5-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor);
17951
+ .pf-v5-c-masthead.pf-m-inset-md {
17952
+ padding-inline-start: var(--pf-v5-global--spacer--md);
17953
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18076
17954
  }
18077
- .pf-v5-c-masthead .pf-v5-c-nav {
18078
- align-self: stretch;
17955
+ .pf-v5-c-masthead.pf-m-inset-lg {
17956
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
17957
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
17958
+ }
17959
+ .pf-v5-c-masthead.pf-m-inset-xl {
17960
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
17961
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
17962
+ }
17963
+ .pf-v5-c-masthead.pf-m-inset-2xl {
17964
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
17965
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18079
17966
  }
18080
17967
 
17968
+ .pf-v5-c-masthead,
18081
17969
  .pf-v5-c-masthead__main {
18082
17970
  position: relative;
17971
+ }
17972
+
17973
+ .pf-v5-c-masthead__main,
17974
+ .pf-v5-c-masthead__content,
17975
+ .pf-v5-c-masthead__logo,
17976
+ .pf-v5-c-masthead__brand {
18083
17977
  display: flex;
18084
- flex-basis: var(--pf-v5-c-masthead__main--FlexBasis);
18085
- grid-column: var(--pf-v5-c-masthead__main--GridColumn);
18086
- align-items: center;
18087
17978
  align-self: stretch;
18088
- order: var(--pf-v5-c-masthead__main--Order);
18089
- min-height: var(--pf-v5-c-masthead__main--MinHeight);
18090
- padding-block-start: var(--pf-v5-c-masthead__main--PaddingTop);
18091
- padding-block-end: var(--pf-v5-c-masthead__main--PaddingBottom);
18092
- margin-inline-end: var(--pf-v5-c-masthead__main--MarginRight);
18093
- }
18094
- .pf-v5-c-masthead__main::before {
18095
- position: absolute;
18096
- inset-block-end: 0;
18097
- inset-inline-start: var(--pf-v5-c-masthead__main--before--Left);
18098
- inset-inline-end: var(--pf-v5-c-masthead__main--before--Right);
18099
- content: "";
18100
- border-block-end: var(--pf-v5-c-masthead__main--before--BorderBottom);
18101
17979
  }
18102
- .pf-v5-c-masthead__main:last-child {
18103
- --pf-v5-c-masthead__main--MarginRight: 0;
17980
+
17981
+ .pf-v5-c-masthead__main,
17982
+ .pf-v5-c-masthead__brand,
17983
+ .pf-v5-c-masthead__content {
17984
+ min-width: 0.25rem;
18104
17985
  }
18105
17986
 
18106
- .pf-v5-c-masthead__logo {
18107
- display: flex;
18108
- gap: var(--pf-t--global--spacer--md);
17987
+ .pf-v5-c-masthead__main {
17988
+ grid-column: var(--pf-v5-c-masthead__main--GridColumn);
17989
+ row-gap: var(--pf-v5-c-masthead__main--RowGap, var(--pf-v5-c-masthead--RowGap));
17990
+ align-items: var(--pf-v5-c-masthead__main--AlignItems, var(--pf-v5-c-masthead--AlignItems));
17991
+ order: var(--pf-v5-c-masthead__main--Order);
17992
+ padding-block-end: var(--pf-v5-c-masthead__main--PaddingBlockEnd);
17993
+ border-block-end: var(--pf-v5-c-masthead__main--BorderBlockEnd);
18109
17994
  }
18110
17995
 
18111
17996
  .pf-v5-c-masthead__content {
18112
- display: flex;
18113
- flex-grow: 1;
18114
- flex-shrink: 1;
17997
+ flex-wrap: wrap;
18115
17998
  grid-column: var(--pf-v5-c-masthead__content--GridColumn);
18116
17999
  grid-column-end: -1;
18117
- gap: var(--pf-v5-c-masthead__content--Gap);
18118
- align-items: center;
18119
- align-self: stretch;
18000
+ row-gap: var(--pf-v5-c-masthead__content-RowGap, var(--pf-v5-c-masthead--RowGap));
18001
+ column-gap: var(--pf-v5-c-masthead__content-ColumnGap, var(--pf-v5-c-masthead--ColumnGap));
18002
+ align-items: var(--pf-v5-c-masthead__content--AlignItems, var(--pf-v5-c-masthead--AlignItems));
18120
18003
  order: var(--pf-v5-c-masthead__content--Order);
18121
- min-height: var(--pf-v5-c-masthead__content--MinHeight);
18122
- padding-block-start: var(--pf-v5-c-masthead__content--PaddingTop);
18123
- padding-block-end: var(--pf-v5-c-masthead__content--PaddingBottom);
18124
- margin-inline-start: var(--pf-v5-c-masthead__content--MarginLeft);
18125
- }
18126
- .pf-v5-c-masthead__content:only-child {
18127
- --pf-v5-c-masthead__content--MarginLeft: 0;
18128
- }
18129
- .pf-v5-c-masthead__content .pf-v5-c-nav.pf-m-horizontal {
18130
- margin-inline-start: var(--pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft);
18131
- margin-inline-end: var(--pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight);
18132
- }
18133
- .pf-v5-c-masthead__toggle ~ .pf-v5-c-masthead__content {
18134
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-v5-c-masthead__content--MarginLeft) * -1);
18135
- }
18136
-
18137
- .pf-v5-c-masthead__main,
18138
- .pf-v5-c-masthead__brand,
18139
- .pf-v5-c-masthead__content {
18140
- min-width: 0;
18141
18004
  }
18142
18005
 
18143
18006
  .pf-v5-c-masthead__brand {
18144
- display: inline-flex;
18145
- align-self: center;
18007
+ align-items: var(--pf-v5-c-masthead__brand--AlignItems, var(--pf-v5-c-masthead--AlignItems));
18008
+ max-height: var(--pf-v5-c-masthead__brand--MaxHeight);
18009
+ margin-inline-end: var(--pf-v5-c-masthead__brand--MarginInlineEnd);
18146
18010
  }
18147
18011
 
18148
18012
  .pf-v5-c-masthead__toggle {
18149
- grid-column: var(--pf-v5-c-masthead__toggle--GridColumn);
18150
- align-self: center;
18151
- margin-inline-start: var(--pf-v5-c-masthead__toggle--MarginLeft);
18152
- margin-inline-end: var(--pf-v5-c-masthead__toggle--MarginRight);
18013
+ --pf-v5-c-button--FontSize: var(--pf-v5-c-masthead__toggle--Size);
18153
18014
  }
18154
- .pf-v5-c-masthead__toggle .pf-v5-c-button {
18155
- --pf-v5-c-button--FontSize: var(--pf-v5-c-masthead__toggle--c-button--FontSize);
18015
+
18016
+ .pf-v5-c-masthead__expandable-content {
18017
+ row-gap: var(--pf-v5-c-masthead__expandable-content-RowGap, var(--pf-v5-c-masthead--RowGap));
18018
+ background-color: var(--pf-v5-c-masthead--BackgroundColor);
18156
18019
  }
18157
18020
 
18158
18021
  .pf-v5-c-masthead.pf-m-display-stack {
18159
18022
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18160
18023
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18161
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18162
18024
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18163
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18164
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18165
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18166
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18167
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18025
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18026
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18168
18027
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18169
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18170
18028
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18171
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18172
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18173
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18174
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18175
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18176
18029
  }
18177
18030
  .pf-v5-c-masthead.pf-m-display-inline {
18178
18031
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18179
18032
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18180
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18181
18033
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18182
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18183
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18184
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18185
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18186
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18034
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18035
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18187
18036
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18188
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18189
18037
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18190
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18191
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18192
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18193
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18194
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18195
18038
  }
18196
18039
  .pf-v5-c-masthead.pf-m-inset-none {
18197
- --pf-v5-c-masthead--inset: 0;
18040
+ padding-inline-start: 0;
18041
+ padding-inline-end: 0;
18198
18042
  }
18199
18043
  .pf-v5-c-masthead.pf-m-inset-sm {
18200
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18044
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18045
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18201
18046
  }
18202
18047
  .pf-v5-c-masthead.pf-m-inset-md {
18203
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18048
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18049
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18204
18050
  }
18205
18051
  .pf-v5-c-masthead.pf-m-inset-lg {
18206
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18052
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18053
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18207
18054
  }
18208
18055
  .pf-v5-c-masthead.pf-m-inset-xl {
18209
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18056
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18057
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18210
18058
  }
18211
18059
  .pf-v5-c-masthead.pf-m-inset-2xl {
18212
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18060
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18061
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18213
18062
  }
18214
18063
  @media (min-width: 576px) {
18215
18064
  .pf-v5-c-masthead.pf-m-display-stack-on-sm {
18216
18065
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18217
18066
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18218
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18219
18067
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18220
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18221
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18222
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18223
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18224
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18068
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18069
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18225
18070
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18226
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18227
18071
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18228
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18229
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18230
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18231
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18232
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18233
18072
  }
18234
18073
  .pf-v5-c-masthead.pf-m-display-inline-on-sm {
18235
18074
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18236
18075
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18237
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18238
18076
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18239
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18240
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18241
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18242
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18243
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18077
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18078
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18244
18079
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18245
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18246
18080
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18247
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18248
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18249
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18250
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18251
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18252
18081
  }
18253
18082
  }
18254
- @media (min-width: 576px) {
18255
- .pf-v5-c-masthead.pf-m-inset-none-on-sm {
18256
- --pf-v5-c-masthead--inset: 0;
18257
- }
18258
- .pf-v5-c-masthead.pf-m-inset-sm-on-sm {
18259
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18260
- }
18261
- .pf-v5-c-masthead.pf-m-inset-md-on-sm {
18262
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18263
- }
18264
- .pf-v5-c-masthead.pf-m-inset-lg-on-sm {
18265
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18266
- }
18267
- .pf-v5-c-masthead.pf-m-inset-xl-on-sm {
18268
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18269
- }
18270
- .pf-v5-c-masthead.pf-m-inset-2xl-on-sm {
18271
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18272
- }
18083
+ .pf-v5-c-masthead.pf-m-inset-none {
18084
+ padding-inline-start: 0;
18085
+ padding-inline-end: 0;
18086
+ }
18087
+ .pf-v5-c-masthead.pf-m-inset-sm {
18088
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18089
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18090
+ }
18091
+ .pf-v5-c-masthead.pf-m-inset-md {
18092
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18093
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18094
+ }
18095
+ .pf-v5-c-masthead.pf-m-inset-lg {
18096
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18097
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18098
+ }
18099
+ .pf-v5-c-masthead.pf-m-inset-xl {
18100
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18101
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18102
+ }
18103
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18104
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18105
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18273
18106
  }
18274
18107
  @media (min-width: 768px) {
18275
18108
  .pf-v5-c-masthead.pf-m-display-stack-on-md {
18276
18109
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18277
18110
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18278
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18279
18111
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18280
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18281
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18282
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18283
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18284
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18112
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18113
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18285
18114
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18286
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18287
18115
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18288
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18289
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18290
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18291
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18292
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18293
18116
  }
18294
18117
  .pf-v5-c-masthead.pf-m-display-inline-on-md {
18295
18118
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18296
18119
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18297
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18298
18120
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18299
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18300
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18301
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18302
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18303
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18121
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18122
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18304
18123
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18305
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18306
18124
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18307
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18308
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18309
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18310
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18311
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18312
18125
  }
18313
18126
  }
18314
- @media (min-width: 768px) {
18315
- .pf-v5-c-masthead.pf-m-inset-none-on-md {
18316
- --pf-v5-c-masthead--inset: 0;
18317
- }
18318
- .pf-v5-c-masthead.pf-m-inset-sm-on-md {
18319
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18320
- }
18321
- .pf-v5-c-masthead.pf-m-inset-md-on-md {
18322
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18323
- }
18324
- .pf-v5-c-masthead.pf-m-inset-lg-on-md {
18325
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18326
- }
18327
- .pf-v5-c-masthead.pf-m-inset-xl-on-md {
18328
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18329
- }
18330
- .pf-v5-c-masthead.pf-m-inset-2xl-on-md {
18331
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18332
- }
18127
+ .pf-v5-c-masthead.pf-m-inset-none {
18128
+ padding-inline-start: 0;
18129
+ padding-inline-end: 0;
18130
+ }
18131
+ .pf-v5-c-masthead.pf-m-inset-sm {
18132
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18133
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18134
+ }
18135
+ .pf-v5-c-masthead.pf-m-inset-md {
18136
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18137
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18138
+ }
18139
+ .pf-v5-c-masthead.pf-m-inset-lg {
18140
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18141
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18142
+ }
18143
+ .pf-v5-c-masthead.pf-m-inset-xl {
18144
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18145
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18146
+ }
18147
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18148
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18149
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18333
18150
  }
18334
18151
  @media (min-width: 992px) {
18335
18152
  .pf-v5-c-masthead.pf-m-display-stack-on-lg {
18336
18153
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18337
18154
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18338
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18339
18155
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18340
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18341
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18342
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18343
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18344
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18156
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18157
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18345
18158
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18346
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18347
18159
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18348
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18349
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18350
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18351
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18352
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18353
18160
  }
18354
18161
  .pf-v5-c-masthead.pf-m-display-inline-on-lg {
18355
18162
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18356
18163
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18357
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18358
18164
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18359
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18360
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18361
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18362
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18363
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18165
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18166
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18364
18167
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18365
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18366
18168
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18367
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18368
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18369
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18370
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18371
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18372
18169
  }
18373
18170
  }
18374
- @media (min-width: 992px) {
18375
- .pf-v5-c-masthead.pf-m-inset-none-on-lg {
18376
- --pf-v5-c-masthead--inset: 0;
18377
- }
18378
- .pf-v5-c-masthead.pf-m-inset-sm-on-lg {
18379
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18380
- }
18381
- .pf-v5-c-masthead.pf-m-inset-md-on-lg {
18382
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18383
- }
18384
- .pf-v5-c-masthead.pf-m-inset-lg-on-lg {
18385
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18386
- }
18387
- .pf-v5-c-masthead.pf-m-inset-xl-on-lg {
18388
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18389
- }
18390
- .pf-v5-c-masthead.pf-m-inset-2xl-on-lg {
18391
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18392
- }
18171
+ .pf-v5-c-masthead.pf-m-inset-none {
18172
+ padding-inline-start: 0;
18173
+ padding-inline-end: 0;
18174
+ }
18175
+ .pf-v5-c-masthead.pf-m-inset-sm {
18176
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18177
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18178
+ }
18179
+ .pf-v5-c-masthead.pf-m-inset-md {
18180
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18181
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18182
+ }
18183
+ .pf-v5-c-masthead.pf-m-inset-lg {
18184
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18185
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18186
+ }
18187
+ .pf-v5-c-masthead.pf-m-inset-xl {
18188
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18189
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18190
+ }
18191
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18192
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18193
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18393
18194
  }
18394
18195
  @media (min-width: 1200px) {
18395
18196
  .pf-v5-c-masthead.pf-m-display-stack-on-xl {
18396
18197
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18397
18198
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18398
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18399
18199
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18400
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18401
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18402
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18403
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18404
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18200
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18201
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18405
18202
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18406
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18407
18203
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18408
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18409
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18410
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18411
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18412
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18413
18204
  }
18414
18205
  .pf-v5-c-masthead.pf-m-display-inline-on-xl {
18415
18206
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18416
18207
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18417
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18418
18208
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18419
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18420
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18421
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18422
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18423
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18209
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18210
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18424
18211
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18425
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18426
18212
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18427
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18428
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18429
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18430
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18431
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18432
18213
  }
18433
18214
  }
18434
- @media (min-width: 1200px) {
18435
- .pf-v5-c-masthead.pf-m-inset-none-on-xl {
18436
- --pf-v5-c-masthead--inset: 0;
18437
- }
18438
- .pf-v5-c-masthead.pf-m-inset-sm-on-xl {
18439
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18440
- }
18441
- .pf-v5-c-masthead.pf-m-inset-md-on-xl {
18442
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18443
- }
18444
- .pf-v5-c-masthead.pf-m-inset-lg-on-xl {
18445
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18446
- }
18447
- .pf-v5-c-masthead.pf-m-inset-xl-on-xl {
18448
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18449
- }
18450
- .pf-v5-c-masthead.pf-m-inset-2xl-on-xl {
18451
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18452
- }
18215
+ .pf-v5-c-masthead.pf-m-inset-none {
18216
+ padding-inline-start: 0;
18217
+ padding-inline-end: 0;
18218
+ }
18219
+ .pf-v5-c-masthead.pf-m-inset-sm {
18220
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18221
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18222
+ }
18223
+ .pf-v5-c-masthead.pf-m-inset-md {
18224
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18225
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18226
+ }
18227
+ .pf-v5-c-masthead.pf-m-inset-lg {
18228
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18229
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18230
+ }
18231
+ .pf-v5-c-masthead.pf-m-inset-xl {
18232
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18233
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18234
+ }
18235
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18236
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18237
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18453
18238
  }
18454
18239
  @media (min-width: 1450px) {
18455
18240
  .pf-v5-c-masthead.pf-m-display-stack-on-2xl {
18456
18241
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18457
18242
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18458
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18459
18243
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18460
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18461
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18462
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18463
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18464
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18244
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18245
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18465
18246
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18466
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18467
18247
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18468
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18469
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18470
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18471
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18472
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18473
18248
  }
18474
18249
  .pf-v5-c-masthead.pf-m-display-inline-on-2xl {
18475
18250
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18476
18251
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18477
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18478
18252
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18479
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18480
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18481
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18482
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18483
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18253
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18254
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18484
18255
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18485
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18486
18256
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18487
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18488
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18489
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18490
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18491
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18492
18257
  }
18493
18258
  }
18494
- @media (min-width: 1450px) {
18495
- .pf-v5-c-masthead.pf-m-inset-none-on-2xl {
18496
- --pf-v5-c-masthead--inset: 0;
18497
- }
18498
- .pf-v5-c-masthead.pf-m-inset-sm-on-2xl {
18499
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18500
- }
18501
- .pf-v5-c-masthead.pf-m-inset-md-on-2xl {
18502
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18503
- }
18504
- .pf-v5-c-masthead.pf-m-inset-lg-on-2xl {
18505
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18506
- }
18507
- .pf-v5-c-masthead.pf-m-inset-xl-on-2xl {
18508
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18509
- }
18510
- .pf-v5-c-masthead.pf-m-inset-2xl-on-2xl {
18511
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18512
- }
18259
+ .pf-v5-c-masthead.pf-m-inset-none {
18260
+ padding-inline-start: 0;
18261
+ padding-inline-end: 0;
18262
+ }
18263
+ .pf-v5-c-masthead.pf-m-inset-sm {
18264
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18265
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18266
+ }
18267
+ .pf-v5-c-masthead.pf-m-inset-md {
18268
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18269
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18270
+ }
18271
+ .pf-v5-c-masthead.pf-m-inset-lg {
18272
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18273
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18274
+ }
18275
+ .pf-v5-c-masthead.pf-m-inset-xl {
18276
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18277
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18278
+ }
18279
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18280
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18281
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18513
18282
  }
18514
18283
 
18515
18284
  .pf-v5-c-menu {
@@ -19383,6 +19152,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
19383
19152
  align-self: stretch;
19384
19153
  }
19385
19154
  .pf-v5-c-menu-toggle.pf-m-split-button > .pf-v5-c-check .pf-v5-c-check__input {
19155
+ --pf-v5-c-check__input--TranslateY: 0;
19386
19156
  align-self: center;
19387
19157
  }
19388
19158
  .pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *::after {
@@ -23158,12 +22928,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
23158
22928
 
23159
22929
  .pf-v5-c-popover__arrow {
23160
22930
  position: absolute;
23161
- /* stylelint-disable liberty/use-logical-spec */
23162
22931
  top: var(--pf-v5-c-popover__arrow--Top, auto);
23163
22932
  right: var(--pf-v5-c-popover__arrow--Right, auto);
23164
22933
  bottom: var(--pf-v5-c-popover__arrow--Bottom, auto);
23165
22934
  left: var(--pf-v5-c-popover__arrow--Left, auto);
23166
- /* stylelint-enable */
23167
22935
  width: var(--pf-v5-c-popover__arrow--Width);
23168
22936
  height: var(--pf-v5-c-popover__arrow--Height);
23169
22937
  pointer-events: none;
@@ -24986,34 +24754,31 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
24986
24754
  --pf-v5-c-sidebar__panel--FlexBasis: 100%;
24987
24755
  }
24988
24756
  }
24989
- .pf-v5-c-simple-list {
24990
- --pf-v5-c-simple-list__item-link--PaddingTop: var(--pf-v5-global--spacer--xs);
24991
- --pf-v5-c-simple-list__item-link--PaddingRight: var(--pf-v5-global--spacer--md);
24992
- --pf-v5-c-simple-list__item-link--PaddingBottom: var(--pf-v5-global--spacer--xs);
24993
- --pf-v5-c-simple-list__item-link--PaddingLeft: var(--pf-v5-global--spacer--md);
24994
- --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
24995
- --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-global--Color--100);
24996
- --pf-v5-c-simple-list__item-link--FontSize: var(--pf-v5-global--FontSize--sm);
24997
- --pf-v5-c-simple-list__item-link--FontWeight: var(--pf-v5-global--FontWeight--normal);
24998
- --pf-v5-c-simple-list__item-link--m-current--Color: var(--pf-v5-global--link--Color);
24999
- --pf-v5-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
25000
- --pf-v5-c-simple-list__item-link--m-current--FontWeight: var(--pf-v5-global--FontWeight--normal);
25001
- --pf-v5-c-simple-list__item-link--hover--Color: var(--pf-v5-global--Color--100);
25002
- --pf-v5-c-simple-list__item-link--hover--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
25003
- --pf-v5-c-simple-list__item-link--focus--Color: var(--pf-v5-global--Color--100);
25004
- --pf-v5-c-simple-list__item-link--focus--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
25005
- --pf-v5-c-simple-list__item-link--focus--FontWeight: var(--pf-v5-global--FontWeight--normal);
25006
- --pf-v5-c-simple-list__item-link--active--Color: var(--pf-v5-global--Color--100);
25007
- --pf-v5-c-simple-list__item-link--active--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
25008
- --pf-v5-c-simple-list__item-link--active--FontWeight: var(--pf-v5-global--FontWeight--normal);
25009
- --pf-v5-c-simple-list__title--PaddingTop: var(--pf-v5-global--spacer--sm);
25010
- --pf-v5-c-simple-list__title--PaddingRight: var(--pf-v5-global--spacer--md);
25011
- --pf-v5-c-simple-list__title--PaddingBottom: var(--pf-v5-global--spacer--sm);
25012
- --pf-v5-c-simple-list__title--PaddingLeft: var(--pf-v5-global--spacer--md);
25013
- --pf-v5-c-simple-list__title--FontSize: var(--pf-v5-global--FontSize--sm);
25014
- --pf-v5-c-simple-list__title--Color: var(--pf-v5-global--Color--dark-200);
25015
- --pf-v5-c-simple-list__title--FontWeight: var(--pf-v5-global--FontWeight--bold);
25016
- --pf-v5-c-simple-list__section--section--MarginTop: var(--pf-v5-global--spacer--sm);
24757
+ :root, .pf-v5-c-simple-list {
24758
+ --pf-v5-c-simple-list__item-link--PaddingTop: var(--pf-t--global--spacer--xs);
24759
+ --pf-v5-c-simple-list__item-link--PaddingRight: var(--pf-t--global--spacer--md);
24760
+ --pf-v5-c-simple-list__item-link--PaddingBottom: var(--pf-t--global--spacer--xs);
24761
+ --pf-v5-c-simple-list__item-link--PaddingLeft: var(--pf-t--global--spacer--md);
24762
+ --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
24763
+ --pf-v5-c-simple-list__item-link--Color: var(--pf-t--global--text--color--subtle);
24764
+ --pf-v5-c-simple-list__item-link--FontSize: var(--pf-t--global--font--size--body);
24765
+ --pf-v5-c-simple-list__item-link--m-current--Color: var(--pf-t--global--text--color--regular);
24766
+ --pf-v5-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--selected);
24767
+ --pf-v5-c-simple-list__item-link--hover--Color: var(--pf-t--global--text--color--subtle);
24768
+ --pf-v5-c-simple-list__item-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
24769
+ --pf-v5-c-simple-list__item-link--MixBlendMode: var(--pf-t--global--background--color--action--plain--hover--blend);
24770
+ --pf-v5-c-simple-list__item-link--BorderRadius: var(--pf-t--global--border--radius--tiny);
24771
+ --pf-v5-c-simple-list__item-link--m-link--Color: var(--pf-t--global--text--color--link--default);
24772
+ --pf-v5-c-simple-list__item-link--m-link--m-current--Color: var(--pf-t--global--text--color--link--hover);
24773
+ --pf-v5-c-simple-list__item-link--m-link--hover--Color: var(--pf-t--global--text--color--link--hover);
24774
+ --pf-v5-c-simple-list__title--PaddingTop: var(--pf-t--global--spacer--sm);
24775
+ --pf-v5-c-simple-list__title--PaddingRight: var(--pf-t--global--spacer--md);
24776
+ --pf-v5-c-simple-list__title--PaddingBottom: var(--pf-t--global--spacer--sm);
24777
+ --pf-v5-c-simple-list__title--PaddingLeft: var(--pf-t--global--spacer--md);
24778
+ --pf-v5-c-simple-list__title--FontSize: var(--pf-t--global--font--size--body--sm);
24779
+ --pf-v5-c-simple-list__title--Color: var(--pf-t--global--text--color--regular);
24780
+ --pf-v5-c-simple-list__title--FontWeight: var(--pf-t--global--font--weight--body--bold);
24781
+ --pf-v5-c-simple-list__section--section--MarginTop: var(--pf-t--global--spacer--sm);
25017
24782
  }
25018
24783
 
25019
24784
  .pf-v5-c-simple-list__item-link {
@@ -25024,31 +24789,28 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
25024
24789
  padding-inline-start: var(--pf-v5-c-simple-list__item-link--PaddingLeft);
25025
24790
  padding-inline-end: var(--pf-v5-c-simple-list__item-link--PaddingRight);
25026
24791
  font-size: var(--pf-v5-c-simple-list__item-link--FontSize);
25027
- font-weight: var(--pf-v5-c-simple-list__item-link--FontWeight);
25028
24792
  color: var(--pf-v5-c-simple-list__item-link--Color);
25029
24793
  text-align: start;
24794
+ text-decoration: none;
25030
24795
  background-color: var(--pf-v5-c-simple-list__item-link--BackgroundColor);
25031
24796
  border: none;
24797
+ border-radius: var(--pf-v5-c-simple-list__item-link--BorderRadius);
24798
+ }
24799
+ .pf-v5-c-simple-list__item-link.pf-m-link {
24800
+ --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--m-link--Color);
24801
+ --pf-v5-c-simple-list__item-link--hover--Color: var(--pf-v5-c-simple-list__item-link--m-link--m-current--Color);
24802
+ --pf-v5-c-simple-list__item-link--m-current--Color: var(--pf-v5-c-simple-list__item-link--m-link--hover--Color);
25032
24803
  }
25033
- .pf-v5-c-simple-list__item-link:hover {
24804
+ .pf-v5-c-simple-list__item-link:hover, .pf-v5-c-simple-list__item-link:focus {
25034
24805
  --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-c-simple-list__item-link--hover--BackgroundColor);
25035
24806
  --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--hover--Color);
25036
24807
  text-decoration: none;
25037
- }
25038
- .pf-v5-c-simple-list__item-link:focus {
25039
- --pf-v5-c-simple-list__item-link--FontWeight: var(--pf-v5-c-simple-list__item-link--focus--FontWeight);
25040
- --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-c-simple-list__item-link--focus--BackgroundColor);
25041
- --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--focus--Color);
25042
- }
25043
- .pf-v5-c-simple-list__item-link:active {
25044
- --pf-v5-c-simple-list__item-link--FontWeight: var(--pf-v5-c-simple-list__item-link--active--FontWeight);
25045
- --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-c-simple-list__item-link--active--BackgroundColor);
25046
- --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--active--Color);
24808
+ mix-blend-mode: var(--pf-v5-c-simple-list__item-link--MixBlendMode);
25047
24809
  }
25048
24810
  .pf-v5-c-simple-list__item-link.pf-m-current {
25049
- --pf-v5-c-simple-list__item-link--FontWeight: var(--pf-v5-c-simple-list__item-link--m-current--FontWeight);
25050
24811
  --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-c-simple-list__item-link--m-current--BackgroundColor);
25051
24812
  --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--m-current--Color);
24813
+ mix-blend-mode: var(--pf-v5-c-simple-list__item-link--MixBlendMode);
25052
24814
  }
25053
24815
 
25054
24816
  .pf-v5-c-simple-list__title {
@@ -25065,21 +24827,6 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
25065
24827
  margin-block-start: var(--pf-v5-c-simple-list__section--section--MarginTop);
25066
24828
  }
25067
24829
 
25068
- :where(.pf-theme-dark) .pf-v5-c-wizard__header .pf-v5-c-button, :where(.pf-theme-dark) .pf-v5-c-log-viewer.pf-m-dark .pf-v5-c-log-viewer__main .pf-v5-c-button {
25069
- --pf-v5-c-button--m-primary--BackgroundColor: var(--pf-v5-global--primary-color--300);
25070
- }
25071
-
25072
- :where(.pf-theme-dark) .pf-v5-c-simple-list {
25073
- --pf-v5-c-simple-list__item-link--m-current--Color: var(--pf-v5-global--active-color--100);
25074
- --pf-v5-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
25075
- --pf-v5-c-simple-list__item-link--hover--Color: var(--pf-v5-global--Color--100);
25076
- --pf-v5-c-simple-list__item-link--hover--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
25077
- --pf-v5-c-simple-list__item-link--focus--Color: var(--pf-v5-global--Color--100);
25078
- --pf-v5-c-simple-list__item-link--focus--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
25079
- --pf-v5-c-simple-list__item-link--active--Color: var(--pf-v5-global--Color--100);
25080
- --pf-v5-c-simple-list__item-link--active--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
25081
- }
25082
-
25083
24830
  .pf-v5-c-skeleton {
25084
24831
  --pf-v5-c-skeleton--BackgroundColor: var(--pf-v5-global--palette--black-150);
25085
24832
  --pf-v5-c-skeleton--Width: auto;
@@ -30893,12 +30640,10 @@ svg.pf-v5-c-spinner.pf-m-xl {
30893
30640
 
30894
30641
  .pf-v5-c-tooltip__arrow {
30895
30642
  position: absolute;
30896
- /* stylelint-disable liberty/use-logical-spec */
30897
30643
  top: var(--pf-v5-c-tooltip__arrow--Top, auto);
30898
30644
  right: var(--pf-v5-c-tooltip__arrow--Right, auto);
30899
30645
  bottom: var(--pf-v5-c-tooltip__arrow--Bottom, auto);
30900
30646
  left: var(--pf-v5-c-tooltip__arrow--Left, auto);
30901
- /* stylelint-enable */
30902
30647
  width: var(--pf-v5-c-tooltip__arrow--Width);
30903
30648
  height: var(--pf-v5-c-tooltip__arrow--Height);
30904
30649
  pointer-events: none;
@@ -30907,9 +30652,13 @@ svg.pf-v5-c-spinner.pf-m-xl {
30907
30652
  transform: translateX(var(--pf-v5-c-tooltip__arrow--TranslateX, 0)) translateY(var(--pf-v5-c-tooltip__arrow--TranslateY, 0)) rotate(var(--pf-v5-c-tooltip__arrow--Rotate, 0));
30908
30653
  }
30909
30654
 
30655
+ :root,
30910
30656
  .pf-v5-c-truncate {
30911
30657
  --pf-v5-c-truncate--MinWidth: 12ch;
30912
30658
  --pf-v5-c-truncate__start--MinWidth: 6ch;
30659
+ }
30660
+
30661
+ .pf-v5-c-truncate {
30913
30662
  display: inline-grid;
30914
30663
  grid-auto-flow: column;
30915
30664
  align-items: baseline;