@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-no-globals.css CHANGED
@@ -7339,10 +7339,14 @@ html .ws-preview {
7339
7339
  }
7340
7340
  }
7341
7341
 
7342
+ :root,
7342
7343
  .pf-v5-c-backdrop {
7343
7344
  --pf-v5-c-backdrop--Position: fixed;
7344
- --pf-v5-c-backdrop--ZIndex: var(--pf-v5-global--ZIndex--lg);
7345
- --pf-v5-c-backdrop--BackgroundColor: var(--pf-v5-global--BackgroundColor--dark-transparent-100);
7345
+ --pf-v5-c-backdrop--ZIndex: var(--pf-t--global--Zindex--lg);
7346
+ --pf-v5-c-backdrop--BackgroundColor: var(--pf-t--global--background--color--backdrop--default);
7347
+ }
7348
+
7349
+ .pf-v5-c-backdrop {
7346
7350
  position: var(--pf-v5-c-backdrop--Position);
7347
7351
  inset-block-start: 0;
7348
7352
  inset-inline-start: 0;
@@ -7541,6 +7545,10 @@ html .ws-preview {
7541
7545
  --pf-v5-c-banner--BackgroundColor: var(--pf-v5-c-banner--m-info--BackgroundColor);
7542
7546
  --pf-v5-c-banner--Color: var(--pf-v5-c-banner--m-info--Color);
7543
7547
  }
7548
+ .pf-v5-c-banner.pf-m-custom {
7549
+ --pf-v5-c-banner--BackgroundColor: var(--pf-v5-c-banner--m-custom--BackgroundColor);
7550
+ --pf-v5-c-banner--Color: var(--pf-v5-c-banner--m-custom--Color);
7551
+ }
7544
7552
  .pf-v5-c-banner.pf-m-red {
7545
7553
  --pf-v5-c-banner--BackgroundColor: var(--pf-v5-c-banner--m-red--BackgroundColor);
7546
7554
  --pf-v5-c-banner--Color: var(--pf-v5-c-banner--m-red--Color);
@@ -8630,6 +8638,9 @@ button.pf-v5-c-breadcrumb__link {
8630
8638
  background-color: var(--pf-v5-c-card--BackgroundColor);
8631
8639
  box-shadow: var(--pf-v5-c-card--BoxShadow);
8632
8640
  }
8641
+ .pf-v5-c-card.pf-m-selectable .pf-v5-c-card__selectable-actions :is(.pf-v5-c-check, .pf-v5-c-radio) {
8642
+ gap: 0;
8643
+ }
8633
8644
  .pf-v5-c-card.pf-m-selectable, .pf-v5-c-card.pf-m-clickable {
8634
8645
  isolation: isolate;
8635
8646
  box-shadow: none;
@@ -12919,341 +12930,261 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
12919
12930
  --pf-v5-c-date-picker__calendar--Top: 100%;
12920
12931
  }
12921
12932
 
12933
+ :root,
12934
+ :where(.pf-v5-c-divider) {
12935
+ --pf-v5-c-divider--Display: flex;
12936
+ --pf-v5-c-divider--Color: var(--pf-t--global--border--color--default);
12937
+ --pf-v5-c-divider--Size: var(--pf-t--global--border--width--divider--default);
12938
+ --pf-v5-c-divider--before--FlexBasis: 100%;
12939
+ }
12940
+
12922
12941
  .pf-v5-c-divider {
12923
- --pf-v5-c-divider--BorderWidth--base: var(--pf-v5-global--BorderWidth--sm);
12924
- --pf-v5-c-divider--BorderColor--base: var(--pf-v5-c-divider--BackgroundColor);
12925
- --pf-v5-c-divider--Height: var(--pf-v5-c-divider--BorderWidth--base);
12926
- --pf-v5-c-divider--BackgroundColor: var(--pf-v5-global--BorderColor--100);
12927
- --pf-v5-c-divider--after--BackgroundColor: var(--pf-v5-c-divider--BorderColor--base);
12928
- --pf-v5-c-divider--after--FlexBasis: 100%;
12929
- --pf-v5-c-divider--after--Inset: 0%;
12930
- --pf-v5-c-divider--m-vertical--after--FlexBasis: 100%;
12931
- --pf-v5-c-divider--m-horizontal--Display: flex;
12932
- --pf-v5-c-divider--m-horizontal--FlexDirection: row;
12933
- --pf-v5-c-divider--m-horizontal--after--Height: var(--pf-v5-c-divider--Height);
12934
- --pf-v5-c-divider--m-horizontal--after--Width: auto;
12935
- --pf-v5-c-divider--m-vertical--Display: inline-flex;
12936
- --pf-v5-c-divider--m-vertical--FlexDirection: column;
12937
- --pf-v5-c-divider--m-vertical--after--Height: auto;
12938
- --pf-v5-c-divider--m-vertical--after--Width: var(--pf-v5-c-divider--BorderWidth--base);
12939
- --pf-v5-hidden-visible--visible--Display: var(--pf-v5-c-divider--Display);
12940
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
12941
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
12942
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
12943
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
12942
+ flex-direction: row;
12944
12943
  width: 100%;
12945
- height: auto;
12946
- flex-direction: var(--pf-v5-c-divider--FlexDirection);
12947
- flex-shrink: 0;
12948
- align-items: center;
12949
- align-self: stretch;
12944
+ height: var(--pf-v5-c-divider--Size);
12945
+ --pf-v5-hidden-visible--visible--Display: var(--pf-v5-c-divider--Display);
12946
+ align-items: stretch;
12950
12947
  justify-content: center;
12951
12948
  border: 0;
12952
12949
  }
12953
- .pf-v5-c-divider::after {
12954
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
12955
- }
12956
- .pf-v5-c-divider::after {
12957
- align-self: stretch;
12958
- justify-self: center;
12959
- width: var(--pf-v5-c-divider--after--Width);
12960
- height: var(--pf-v5-c-divider--after--Height);
12950
+ .pf-v5-c-divider::before {
12951
+ flex-basis: var(--pf-v5-c-divider--before--FlexBasis);
12961
12952
  content: "";
12962
- background-color: var(--pf-v5-c-divider--after--BackgroundColor);
12953
+ background-color: var(--pf-v5-c-divider--Color);
12963
12954
  }
12964
- .pf-v5-c-divider.pf-m-vertical {
12965
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
12966
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
12967
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
12968
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
12969
- width: auto;
12970
- height: inherit;
12955
+ .pf-v5-c-divider.pf-m-horizontal {
12956
+ flex-direction: row;
12957
+ width: 100%;
12958
+ height: var(--pf-v5-c-divider--Size);
12971
12959
  }
12972
- .pf-v5-c-divider.pf-m-vertical::after {
12973
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
12960
+ .pf-v5-c-divider.pf-m-vertical {
12961
+ flex-direction: column;
12962
+ width: var(--pf-v5-c-divider--Size);
12963
+ height: 100%;
12974
12964
  }
12975
12965
  .pf-v5-c-divider.pf-m-inset-none {
12976
- --pf-v5-c-divider--after--Inset: 0%;
12966
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - 0% * 2);
12977
12967
  }
12978
12968
  .pf-v5-c-divider.pf-m-inset-xs {
12979
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
12969
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
12980
12970
  }
12981
12971
  .pf-v5-c-divider.pf-m-inset-sm {
12982
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
12972
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
12983
12973
  }
12984
12974
  .pf-v5-c-divider.pf-m-inset-md {
12985
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
12975
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
12986
12976
  }
12987
12977
  .pf-v5-c-divider.pf-m-inset-lg {
12988
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
12978
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
12989
12979
  }
12990
12980
  .pf-v5-c-divider.pf-m-inset-xl {
12991
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
12981
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
12992
12982
  }
12993
12983
  .pf-v5-c-divider.pf-m-inset-2xl {
12994
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
12984
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
12995
12985
  }
12996
12986
  .pf-v5-c-divider.pf-m-inset-3xl {
12997
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
12987
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
12998
12988
  }
12989
+
12999
12990
  @media (min-width: 576px) {
13000
12991
  .pf-v5-c-divider.pf-m-horizontal-on-sm {
13001
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13002
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13003
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13004
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
12992
+ flex-direction: row;
13005
12993
  width: 100%;
13006
- height: auto;
13007
- }
13008
- .pf-v5-c-divider.pf-m-horizontal-on-sm::after {
13009
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
12994
+ height: var(--pf-v5-c-divider--Size);
13010
12995
  }
13011
12996
  }
13012
12997
  @media (min-width: 576px) {
13013
12998
  .pf-v5-c-divider.pf-m-vertical-on-sm {
13014
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13015
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13016
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13017
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13018
- width: auto;
13019
- height: inherit;
13020
- }
13021
- .pf-v5-c-divider.pf-m-vertical-on-sm::after {
13022
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
12999
+ flex-direction: column;
13000
+ width: var(--pf-v5-c-divider--Size);
13001
+ height: 100%;
13023
13002
  }
13024
13003
  }
13025
13004
  @media (min-width: 576px) {
13026
13005
  .pf-v5-c-divider.pf-m-inset-none-on-sm {
13027
- --pf-v5-c-divider--after--Inset: 0%;
13006
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13028
13007
  }
13029
13008
  .pf-v5-c-divider.pf-m-inset-xs-on-sm {
13030
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13009
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13031
13010
  }
13032
13011
  .pf-v5-c-divider.pf-m-inset-sm-on-sm {
13033
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13012
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13034
13013
  }
13035
13014
  .pf-v5-c-divider.pf-m-inset-md-on-sm {
13036
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13015
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13037
13016
  }
13038
13017
  .pf-v5-c-divider.pf-m-inset-lg-on-sm {
13039
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13018
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13040
13019
  }
13041
13020
  .pf-v5-c-divider.pf-m-inset-xl-on-sm {
13042
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13021
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13043
13022
  }
13044
13023
  .pf-v5-c-divider.pf-m-inset-2xl-on-sm {
13045
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13024
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13046
13025
  }
13047
13026
  .pf-v5-c-divider.pf-m-inset-3xl-on-sm {
13048
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13027
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13049
13028
  }
13050
13029
  }
13051
13030
  @media (min-width: 768px) {
13052
13031
  .pf-v5-c-divider.pf-m-horizontal-on-md {
13053
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13054
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13055
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13056
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13032
+ flex-direction: row;
13057
13033
  width: 100%;
13058
- height: auto;
13059
- }
13060
- .pf-v5-c-divider.pf-m-horizontal-on-md::after {
13061
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13034
+ height: var(--pf-v5-c-divider--Size);
13062
13035
  }
13063
13036
  }
13064
13037
  @media (min-width: 768px) {
13065
13038
  .pf-v5-c-divider.pf-m-vertical-on-md {
13066
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13067
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13068
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13069
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13070
- width: auto;
13071
- height: inherit;
13072
- }
13073
- .pf-v5-c-divider.pf-m-vertical-on-md::after {
13074
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13039
+ flex-direction: column;
13040
+ width: var(--pf-v5-c-divider--Size);
13041
+ height: 100%;
13075
13042
  }
13076
13043
  }
13077
13044
  @media (min-width: 768px) {
13078
13045
  .pf-v5-c-divider.pf-m-inset-none-on-md {
13079
- --pf-v5-c-divider--after--Inset: 0%;
13046
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13080
13047
  }
13081
13048
  .pf-v5-c-divider.pf-m-inset-xs-on-md {
13082
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13049
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13083
13050
  }
13084
13051
  .pf-v5-c-divider.pf-m-inset-sm-on-md {
13085
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13052
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13086
13053
  }
13087
13054
  .pf-v5-c-divider.pf-m-inset-md-on-md {
13088
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13055
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13089
13056
  }
13090
13057
  .pf-v5-c-divider.pf-m-inset-lg-on-md {
13091
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13058
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13092
13059
  }
13093
13060
  .pf-v5-c-divider.pf-m-inset-xl-on-md {
13094
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13061
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13095
13062
  }
13096
13063
  .pf-v5-c-divider.pf-m-inset-2xl-on-md {
13097
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13064
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13098
13065
  }
13099
13066
  .pf-v5-c-divider.pf-m-inset-3xl-on-md {
13100
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13067
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13101
13068
  }
13102
13069
  }
13103
13070
  @media (min-width: 992px) {
13104
13071
  .pf-v5-c-divider.pf-m-horizontal-on-lg {
13105
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13106
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13107
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13108
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13072
+ flex-direction: row;
13109
13073
  width: 100%;
13110
- height: auto;
13111
- }
13112
- .pf-v5-c-divider.pf-m-horizontal-on-lg::after {
13113
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13074
+ height: var(--pf-v5-c-divider--Size);
13114
13075
  }
13115
13076
  }
13116
13077
  @media (min-width: 992px) {
13117
13078
  .pf-v5-c-divider.pf-m-vertical-on-lg {
13118
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13119
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13120
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13121
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13122
- width: auto;
13123
- height: inherit;
13124
- }
13125
- .pf-v5-c-divider.pf-m-vertical-on-lg::after {
13126
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13079
+ flex-direction: column;
13080
+ width: var(--pf-v5-c-divider--Size);
13081
+ height: 100%;
13127
13082
  }
13128
13083
  }
13129
13084
  @media (min-width: 992px) {
13130
13085
  .pf-v5-c-divider.pf-m-inset-none-on-lg {
13131
- --pf-v5-c-divider--after--Inset: 0%;
13086
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13132
13087
  }
13133
13088
  .pf-v5-c-divider.pf-m-inset-xs-on-lg {
13134
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13089
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13135
13090
  }
13136
13091
  .pf-v5-c-divider.pf-m-inset-sm-on-lg {
13137
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13092
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13138
13093
  }
13139
13094
  .pf-v5-c-divider.pf-m-inset-md-on-lg {
13140
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13095
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13141
13096
  }
13142
13097
  .pf-v5-c-divider.pf-m-inset-lg-on-lg {
13143
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13098
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13144
13099
  }
13145
13100
  .pf-v5-c-divider.pf-m-inset-xl-on-lg {
13146
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13101
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13147
13102
  }
13148
13103
  .pf-v5-c-divider.pf-m-inset-2xl-on-lg {
13149
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13104
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13150
13105
  }
13151
13106
  .pf-v5-c-divider.pf-m-inset-3xl-on-lg {
13152
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13107
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13153
13108
  }
13154
13109
  }
13155
13110
  @media (min-width: 1200px) {
13156
13111
  .pf-v5-c-divider.pf-m-horizontal-on-xl {
13157
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13158
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13159
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13160
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13112
+ flex-direction: row;
13161
13113
  width: 100%;
13162
- height: auto;
13163
- }
13164
- .pf-v5-c-divider.pf-m-horizontal-on-xl::after {
13165
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13114
+ height: var(--pf-v5-c-divider--Size);
13166
13115
  }
13167
13116
  }
13168
13117
  @media (min-width: 1200px) {
13169
13118
  .pf-v5-c-divider.pf-m-vertical-on-xl {
13170
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13171
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13172
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13173
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13174
- width: auto;
13175
- height: inherit;
13176
- }
13177
- .pf-v5-c-divider.pf-m-vertical-on-xl::after {
13178
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13119
+ flex-direction: column;
13120
+ width: var(--pf-v5-c-divider--Size);
13121
+ height: 100%;
13179
13122
  }
13180
13123
  }
13181
13124
  @media (min-width: 1200px) {
13182
13125
  .pf-v5-c-divider.pf-m-inset-none-on-xl {
13183
- --pf-v5-c-divider--after--Inset: 0%;
13126
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13184
13127
  }
13185
13128
  .pf-v5-c-divider.pf-m-inset-xs-on-xl {
13186
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13129
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13187
13130
  }
13188
13131
  .pf-v5-c-divider.pf-m-inset-sm-on-xl {
13189
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13132
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13190
13133
  }
13191
13134
  .pf-v5-c-divider.pf-m-inset-md-on-xl {
13192
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13135
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13193
13136
  }
13194
13137
  .pf-v5-c-divider.pf-m-inset-lg-on-xl {
13195
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13138
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13196
13139
  }
13197
13140
  .pf-v5-c-divider.pf-m-inset-xl-on-xl {
13198
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13141
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13199
13142
  }
13200
13143
  .pf-v5-c-divider.pf-m-inset-2xl-on-xl {
13201
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13144
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13202
13145
  }
13203
13146
  .pf-v5-c-divider.pf-m-inset-3xl-on-xl {
13204
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13147
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13205
13148
  }
13206
13149
  }
13207
13150
  @media (min-width: 1450px) {
13208
13151
  .pf-v5-c-divider.pf-m-horizontal-on-2xl {
13209
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-horizontal--Display);
13210
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-horizontal--FlexDirection);
13211
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-horizontal--after--Width);
13212
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-horizontal--after--Height);
13152
+ flex-direction: row;
13213
13153
  width: 100%;
13214
- height: auto;
13215
- }
13216
- .pf-v5-c-divider.pf-m-horizontal-on-2xl::after {
13217
- flex-basis: calc(var(--pf-v5-c-divider--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset) * 2);
13154
+ height: var(--pf-v5-c-divider--Size);
13218
13155
  }
13219
13156
  }
13220
13157
  @media (min-width: 1450px) {
13221
13158
  .pf-v5-c-divider.pf-m-vertical-on-2xl {
13222
- --pf-v5-c-divider--Display: var(--pf-v5-c-divider--m-vertical--Display);
13223
- --pf-v5-c-divider--FlexDirection: var(--pf-v5-c-divider--m-vertical--FlexDirection);
13224
- --pf-v5-c-divider--after--Width: var(--pf-v5-c-divider--m-vertical--after--Width);
13225
- --pf-v5-c-divider--after--Height: var(--pf-v5-c-divider--m-vertical--after--Height);
13226
- width: auto;
13227
- height: inherit;
13228
- }
13229
- .pf-v5-c-divider.pf-m-vertical-on-2xl::after {
13230
- flex-basis: calc(var(--pf-v5-c-divider--m-vertical--after--FlexBasis) - var(--pf-v5-c-divider--after--Inset));
13159
+ flex-direction: column;
13160
+ width: var(--pf-v5-c-divider--Size);
13161
+ height: 100%;
13231
13162
  }
13232
13163
  }
13233
13164
  @media (min-width: 1450px) {
13234
13165
  .pf-v5-c-divider.pf-m-inset-none-on-2xl {
13235
- --pf-v5-c-divider--after--Inset: 0%;
13166
+ --pf-v5-c-divider--before--FlexBasis: 100%;
13236
13167
  }
13237
13168
  .pf-v5-c-divider.pf-m-inset-xs-on-2xl {
13238
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xs);
13169
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xs) * 2);
13239
13170
  }
13240
13171
  .pf-v5-c-divider.pf-m-inset-sm-on-2xl {
13241
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--sm);
13172
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--sm) * 2);
13242
13173
  }
13243
13174
  .pf-v5-c-divider.pf-m-inset-md-on-2xl {
13244
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--md);
13175
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--md) * 2);
13245
13176
  }
13246
13177
  .pf-v5-c-divider.pf-m-inset-lg-on-2xl {
13247
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--lg);
13178
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--lg) * 2);
13248
13179
  }
13249
13180
  .pf-v5-c-divider.pf-m-inset-xl-on-2xl {
13250
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--xl);
13181
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--xl) * 2);
13251
13182
  }
13252
13183
  .pf-v5-c-divider.pf-m-inset-2xl-on-2xl {
13253
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--2xl);
13184
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--2xl) * 2);
13254
13185
  }
13255
13186
  .pf-v5-c-divider.pf-m-inset-3xl-on-2xl {
13256
- --pf-v5-c-divider--after--Inset: var(--pf-v5-global--spacer--3xl);
13187
+ --pf-v5-c-divider--before--FlexBasis: calc(100% - var(--pf-v5-global--spacer--3xl) * 2);
13257
13188
  }
13258
13189
  }
13259
13190
 
@@ -15386,6 +15317,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
15386
15317
  max-width: var(--pf-v5-c-form--m-limit-width--MaxWidth);
15387
15318
  }
15388
15319
 
15320
+ .pf-v5-c-form__group {
15321
+ min-width: 0;
15322
+ }
15389
15323
  .pf-v5-c-form__group.pf-m-action {
15390
15324
  margin-block-start: var(--pf-v5-c-form__group--m-action--MarginTop);
15391
15325
  overflow: hidden;
@@ -15474,6 +15408,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
15474
15408
  --pf-v5-c-form__group-label-help--Color: var(--pf-v5-c-form__group-label-help--focus--Color);
15475
15409
  }
15476
15410
 
15411
+ .pf-v5-c-form__group-control {
15412
+ min-width: 0;
15413
+ }
15477
15414
  .pf-v5-c-form__group-control.pf-m-inline {
15478
15415
  display: flex;
15479
15416
  flex-flow: row wrap;
@@ -17783,616 +17720,448 @@ ul.pf-v5-c-list {
17783
17720
  padding-block-start: var(--pf-v5-c-login__footer--c-list--PaddingTop);
17784
17721
  }
17785
17722
 
17786
- :root {
17787
- --pf-v5-c-masthead--PaddingLeft: var(--pf-v5-c-masthead--inset);
17788
- --pf-v5-c-masthead--PaddingRight: var(--pf-v5-c-masthead--inset);
17723
+ :root,
17724
+ :where(.pf-v5-c-masthead) {
17725
+ --pf-v5-c-masthead--inset: var(--pf-t--global--spacer--lg);
17726
+ --pf-v5-c-masthead--PaddingBlockStart: var(--pf-t--global--spacer--md);
17727
+ --pf-v5-c-masthead--PaddingBlockEnd: var(--pf-t--global--spacer--md);
17728
+ --pf-v5-c-masthead--PaddingInlineStart: var(--pf-v5-c-masthead--inset);
17729
+ --pf-v5-c-masthead--PaddingInlineEnd: var(--pf-v5-c-masthead--inset);
17730
+ --pf-v5-c-masthead--AlignItems: start;
17731
+ --pf-v5-c-masthead--RowGap: var(--pf-t--global--spacer--sm);
17732
+ --pf-v5-c-masthead--ColumnGap: var(--pf-t--global--spacer--md);
17789
17733
  --pf-v5-c-masthead--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
17790
- --pf-v5-c-masthead--inset: var(--pf-t--global--spacer--md);
17791
- --pf-v5-c-masthead--xl--inset: var(--pf-t--global--spacer--lg);
17734
+ --pf-v5-c-masthead--BorderWidth: var(--pf-t--global--border--width--divider--default);
17735
+ --pf-v5-c-masthead--BorderColor: var(--pf-t--global--border--color--default);
17736
+ --pf-v5-c-masthead__brand--MarginInlineEnd: var(--pf-t--global--spacer--md);
17737
+ --pf-v5-c-masthead__brand--MaxHeight: 2.375rem;
17738
+ --pf-v5-c-masthead__toggle--Size: var(--pf-t--global--icon--size--xl);
17792
17739
  --pf-v5-c-masthead--m-display-stack--GridTemplateColumns: max-content 1fr;
17793
17740
  --pf-v5-c-masthead--m-display-stack__main--GridColumn: -1 / 1;
17794
- --pf-v5-c-masthead--m-display-stack__main--MinHeight: 4.375rem;
17795
17741
  --pf-v5-c-masthead--m-display-stack__main--Order: -1;
17796
- --pf-v5-c-masthead--m-display-stack__main--FlexBasis: 100%;
17797
- --pf-v5-c-masthead--m-display-stack__main--PaddingTop: var(--pf-t--global--spacer--lg);
17798
- --pf-v5-c-masthead--m-display-stack__main--PaddingBottom: var(--pf-t--global--spacer--md);
17799
- --pf-v5-c-masthead--m-display-stack__main--MarginRight: 0;
17800
- --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);
17801
- --pf-v5-c-masthead--m-display-stack__toggle--GridColumn: 1;
17742
+ --pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd: var(--pf-v5-c-masthead--RowGap);
17743
+ --pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd: var(--pf-v5-c-masthead--BorderWidth) solid var(--pf-v5-c-masthead--BorderColor);
17802
17744
  --pf-v5-c-masthead--m-display-stack__content--GridColumn: 2;
17803
- --pf-v5-c-masthead--m-display-stack__content--MinHeight: auto;
17804
17745
  --pf-v5-c-masthead--m-display-stack__content--Order: 1;
17805
- --pf-v5-c-masthead--m-display-stack__content--PaddingTop: var(--pf-t--global--spacer--xs);
17806
- --pf-v5-c-masthead--m-display-stack__content--PaddingBottom: var(--pf-t--global--spacer--xs);
17807
- --pf-v5-c-masthead--m-display-stack__content--MarginLeft: 0;
17808
- --pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight: calc(var(--pf-v5-c-masthead--inset) * -1);
17809
- --pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-v5-c-masthead--inset) * -1);
17810
17746
  --pf-v5-c-masthead--m-display-inline--GridTemplateColumns: max-content max-content 1fr;
17811
17747
  --pf-v5-c-masthead--m-display-inline__main--GridColumn: 2;
17812
- --pf-v5-c-masthead--m-display-inline__main--MinHeight: 4.375rem;
17813
17748
  --pf-v5-c-masthead--m-display-inline__main--Order: 0;
17814
- --pf-v5-c-masthead--m-display-inline__main--FlexBasis: auto;
17815
- --pf-v5-c-masthead--m-display-inline__main--PaddingTop: 0;
17816
- --pf-v5-c-masthead--m-display-inline__main--PaddingBottom: 0;
17817
- --pf-v5-c-masthead--m-display-inline__main--MarginRight: calc(var(--pf-t--global--spacer--lg) / 2);
17818
- --pf-v5-c-masthead--m-display-inline__main--BorderBottom: 0;
17819
- --pf-v5-c-masthead--m-display-inline__toggle--GridColumn: 1;
17749
+ --pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd: 0;
17750
+ --pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd: 0;
17820
17751
  --pf-v5-c-masthead--m-display-inline__content--GridColumn: 3;
17821
- --pf-v5-c-masthead--m-display-inline__content--MinHeight: 4.375rem;
17822
17752
  --pf-v5-c-masthead--m-display-inline__content--Order: 0;
17823
- --pf-v5-c-masthead--m-display-inline__content--PaddingTop: 0;
17824
- --pf-v5-c-masthead--m-display-inline__content--PaddingBottom: 0;
17825
- --pf-v5-c-masthead--m-display-inline__content--MarginLeft: calc(var(--pf-t--global--spacer--lg) / 2);
17826
- --pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight: 0;
17827
- --pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft: 0;
17828
- --pf-v5-c-masthead__main--before--Right: calc(var(--pf-v5-c-masthead--inset) * -1);
17829
- --pf-v5-c-masthead__main--before--Left: calc(var(--pf-v5-c-masthead--inset) * -1);
17830
- --pf-v5-c-masthead__main--before--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
17831
- --pf-v5-c-masthead__main--before--BorderBottomColor: var(--pf-t--global--border--color--default);
17832
- --pf-v5-c-masthead__content--Gap: var(--pf-t--global--spacer--sm);
17833
- --pf-v5-c-masthead__toggle--MarginRight: var(--pf-t--global--spacer--sm);
17834
- --pf-v5-c-masthead__toggle--MarginLeft: calc(var(--pf-t--global--spacer--sm) * -1);
17835
- --pf-v5-c-masthead__toggle--c-button--FontSize: var(--pf-t--global--icon--size--lg);
17836
- --pf-v5-c-masthead--c-toolbar__item--Display: flex;
17837
- --pf-v5-c-masthead--item-border-color--base: var(--pf-t--global--border--color--default);
17838
- --pf-v5-c-masthead--c-context-selector--Width: auto;
17839
- --pf-v5-c-masthead--c-context-selector__toggle--BorderTopColor: var(--pf-v5-c-masthead--item-border-color--base);
17840
- --pf-v5-c-masthead--c-context-selector__toggle--BorderRightColor: var(--pf-v5-c-masthead--item-border-color--base);
17841
- --pf-v5-c-masthead--c-context-selector__toggle--BorderLeftColor: var(--pf-v5-c-masthead--item-border-color--base);
17842
- --pf-v5-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor: transparent;
17843
- --pf-v5-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor: transparent;
17844
- --pf-v5-c-masthead--c-dropdown__toggle--before--BorderTopColor: var(--pf-v5-c-masthead--item-border-color--base);
17845
- --pf-v5-c-masthead--c-dropdown__toggle--before--BorderRightColor: var(--pf-v5-c-masthead--item-border-color--base);
17846
- --pf-v5-c-masthead--c-dropdown__toggle--before--BorderLeftColor: var(--pf-v5-c-masthead--item-border-color--base);
17847
- --pf-v5-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor: transparent;
17848
- --pf-v5-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor: transparent;
17849
- --pf-v5-c-masthead--c-menu-toggle--before--BorderTopColor: var(--pf-v5-c-masthead--item-border-color--base);
17850
- --pf-v5-c-masthead--c-menu-toggle--before--BorderRightColor: var(--pf-v5-c-masthead--item-border-color--base);
17851
- --pf-v5-c-masthead--c-menu-toggle--before--BorderLeftColor: var(--pf-v5-c-masthead--item-border-color--base);
17852
- --pf-v5-c-masthead--c-toolbar--BackgroundColor: var(--pf-v5-c-masthead--BackgroundColor);
17853
- --pf-v5-c-masthead--c-toolbar--AlignItems--base: center;
17854
- --pf-v5-c-masthead--c-toolbar__content--PaddingRight: 0;
17855
- --pf-v5-c-masthead--c-toolbar__content--PaddingLeft: 0;
17856
- --pf-v5-c-masthead--c-toolbar__expandable-content--PaddingTop: var(--pf-t--global--spacer--md);
17857
- --pf-v5-c-masthead--c-toolbar__expandable-content--PaddingRight: var(--pf-v5-c-masthead--inset);
17858
- --pf-v5-c-masthead--c-toolbar__expandable-content--PaddingBottom: var(--pf-t--global--spacer--md);
17859
- --pf-v5-c-masthead--c-toolbar__expandable-content--PaddingLeft: var(--pf-v5-c-masthead--inset);
17860
- --pf-v5-c-masthead--c-toolbar__expandable-content--before--BorderTopWidth: var(--pf-t--global--border--width--divider--default);
17861
- --pf-v5-c-masthead--c-toolbar__expandable-content--before--BorderTopColor: var(--pf-v5-c-masthead--item-border-color--base);
17753
+ --pf-v5-c-masthead__expandable-content--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
17754
+ --pf-v5-c-masthead__expandable-content--BorderBlockStart: var(--pf-v5-c-masthead--BorderWidth) solid var(--pf-v5-c-masthead--BorderColor);
17862
17755
  }
17863
17756
 
17864
17757
  .pf-v5-c-masthead {
17865
- --pf-v5-c-toolbar--BackgroundColor: var(--pf-v5-c-masthead--c-toolbar--BackgroundColor);
17866
- --pf-v5-c-toolbar--AlignItems--base: var(--pf-v5-c-masthead--c-toolbar--AlignItems--base);
17867
- --pf-v5-c-toolbar__content--PaddingRight: var(--pf-v5-c-masthead--c-toolbar__content--PaddingRight);
17868
- --pf-v5-c-toolbar__content--PaddingLeft: var(--pf-v5-c-masthead--c-toolbar__content--PaddingLeft);
17869
- --pf-v5-c-toolbar__expandable-content--PaddingTop: var(--pf-v5-c-masthead--c-toolbar__expandable-content--PaddingTop);
17870
- --pf-v5-c-toolbar__expandable-content--PaddingRight: var(--pf-v5-c-masthead--c-toolbar__expandable-content--PaddingRight);
17871
- --pf-v5-c-toolbar__expandable-content--PaddingBottom: var(--pf-v5-c-masthead--c-toolbar__expandable-content--PaddingBottom);
17872
- --pf-v5-c-toolbar__expandable-content--PaddingLeft: var(--pf-v5-c-masthead--c-toolbar__expandable-content--PaddingLeft);
17873
- --pf-v5-c-context-selector--Width: var(--pf-v5-c-masthead--c-context-selector--Width);
17874
- --pf-v5-c-context-selector__toggle--BorderTopColor: var(--pf-v5-c-masthead--c-context-selector__toggle--BorderTopColor);
17875
- --pf-v5-c-context-selector__toggle--BorderRightColor: var(--pf-v5-c-masthead--c-context-selector__toggle--BorderRightColor);
17876
- --pf-v5-c-context-selector__toggle--BorderLeftColor: var(--pf-v5-c-masthead--c-context-selector__toggle--BorderLeftColor);
17877
- --pf-v5-c-dropdown__toggle--before--BorderTopColor: var(--pf-v5-c-masthead--c-dropdown__toggle--before--BorderTopColor);
17878
- --pf-v5-c-dropdown__toggle--before--BorderRightColor: var(--pf-v5-c-masthead--c-dropdown__toggle--before--BorderRightColor);
17879
- --pf-v5-c-dropdown__toggle--before--BorderLeftColor: var(--pf-v5-c-masthead--c-dropdown__toggle--before--BorderLeftColor);
17880
- --pf-v5-c-menu-toggle--before--BorderTopColor: var(--pf-v5-c-masthead--c-menu-toggle--before--BorderTopColor);
17881
- --pf-v5-c-menu-toggle--before--BorderRightColor: var(--pf-v5-c-masthead--c-menu-toggle--before--BorderRightColor);
17882
- --pf-v5-c-menu-toggle--before--BorderLeftColor: var(--pf-v5-c-masthead--c-menu-toggle--before--BorderLeftColor);
17883
- --pf-v5-c-menu-toggle--m-full-height__toggle--after--BorderBottomWidth: 0;
17758
+ --pf-v5-c-toolbar--PaddingTop: 0;
17759
+ --pf-v5-c-toolbar--PaddingBottom: 0;
17760
+ --pf-v5-c-toolbar__content--PaddingRight: 0;
17761
+ --pf-v5-c-toolbar__content--PaddingLeft: 0;
17762
+ --pf-v5-c-toolbar__expandable-content--PaddingTop: var(--pf-t--global--spacer--md);
17763
+ --pf-v5-c-toolbar__expandable-content--PaddingRight: var(--pf-v5-c-masthead--inset);
17764
+ --pf-v5-c-toolbar__expandable-content--PaddingBottom: var(--pf-t--global--spacer--md);
17765
+ --pf-v5-c-toolbar__expandable-content--PaddingLeft: var(--pf-v5-c-masthead--inset);
17766
+ --pf-v5-c-toolbar__expandable-content--BackgroundColor: var(--pf-v5-c-masthead--BackgroundColor);
17767
+ --pf-v5-c-toolbar__expandable-content--lg--PaddingRight: var(--pf-v5-c-masthead--PaddingInlineStart);
17768
+ --pf-v5-c-toolbar__expandable-content--lg--PaddingBottom: var(--pf-t--global--spacer--md);
17769
+ --pf-v5-c-toolbar__expandable-content--lg--PaddingLeft: var(--pf-v5-c-masthead--PaddingInlineEnd);
17884
17770
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
17885
17771
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
17886
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
17887
17772
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
17888
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
17889
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
17890
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
17891
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
17892
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
17773
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
17774
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
17893
17775
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
17894
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
17895
17776
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
17896
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
17897
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
17898
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
17899
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
17900
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
17901
- position: relative;
17902
17777
  display: grid;
17903
17778
  grid-template-columns: var(--pf-v5-c-masthead--GridTemplateColumns);
17904
- align-items: center;
17779
+ row-gap: var(--pf-v5-c-masthead--RowGap);
17780
+ column-gap: var(--pf-v5-c-masthead--ColumnGap);
17781
+ align-items: var(--pf-v5-c-masthead--AlignItems);
17905
17782
  min-width: 0;
17906
- padding-inline-start: var(--pf-v5-c-masthead--PaddingLeft);
17907
- padding-inline-end: var(--pf-v5-c-masthead--PaddingRight);
17783
+ padding-block-start: var(--pf-v5-c-masthead--PaddingBlockStart);
17784
+ padding-block-end: var(--pf-v5-c-masthead--PaddingBlockEnd);
17785
+ padding-inline-start: var(--pf-v5-c-masthead--inset);
17786
+ padding-inline-end: var(--pf-v5-c-masthead--inset);
17908
17787
  background-color: var(--pf-v5-c-masthead--BackgroundColor);
17909
17788
  }
17910
17789
  @media screen and (min-width: 768px) {
17911
17790
  :where(:not(.pf-m-resize-observer)) .pf-v5-c-masthead {
17912
17791
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
17913
17792
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
17914
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
17915
17793
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
17916
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
17917
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
17918
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
17919
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
17920
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
17794
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
17795
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
17921
17796
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
17922
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
17923
17797
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
17924
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
17925
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
17926
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
17927
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
17928
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
17929
- }
17930
- }
17931
- @media screen and (min-width: 1200px) {
17932
- .pf-v5-c-masthead {
17933
- --pf-v5-c-masthead--inset: var(--pf-v5-c-masthead--xl--inset);
17934
17798
  }
17935
17799
  }
17936
17800
  .pf-v5-c-masthead .pf-v5-c-toolbar {
17937
17801
  width: 100%;
17938
17802
  }
17939
- .pf-v5-c-masthead .pf-v5-c-toolbar__content-section {
17940
- flex-wrap: nowrap;
17941
- }
17942
17803
  .pf-v5-c-masthead .pf-v5-c-toolbar__expandable-content {
17943
17804
  inset-block-start: 100%;
17805
+ border-block-start: var(--pf-v5-c-masthead__expandable-content--BorderBlockStart);
17806
+ box-shadow: var(--pf-v5-c-masthead__expandable-content--BoxShadow);
17944
17807
  }
17945
- .pf-v5-c-masthead .pf-v5-c-toolbar__expandable-content::before {
17946
- position: absolute;
17947
- inset: 0;
17948
- content: "";
17949
- 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);
17950
- box-shadow: var(--pf-v5-c-toolbar__expandable-content--before--BoxShadow);
17808
+ .pf-v5-c-masthead.pf-m-display-stack {
17809
+ --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
17810
+ --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
17811
+ --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
17812
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
17813
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
17814
+ --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
17815
+ --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
17816
+ }
17817
+ .pf-v5-c-masthead.pf-m-display-inline {
17818
+ --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
17819
+ --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
17820
+ --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
17821
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
17822
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
17823
+ --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
17824
+ --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
17951
17825
  }
17952
- .pf-v5-c-masthead .pf-v5-c-context-selector.pf-m-full-height {
17953
- --pf-v5-c-context-selector__toggle--BorderTopColor: var(--pf-v5-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor);
17954
- --pf-v5-c-context-selector__toggle--BorderBottomColor: var(--pf-v5-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor);
17826
+ .pf-v5-c-masthead.pf-m-inset-none {
17827
+ padding-inline-start: 0;
17828
+ padding-inline-end: 0;
17829
+ }
17830
+ .pf-v5-c-masthead.pf-m-inset-sm {
17831
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
17832
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
17955
17833
  }
17956
- .pf-v5-c-masthead .pf-v5-c-dropdown.pf-m-full-height {
17957
- --pf-v5-c-dropdown__toggle--before--BorderTopColor: var(--pf-v5-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor);
17958
- --pf-v5-c-dropdown__toggle--before--BorderBottomColor: var(--pf-v5-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor);
17834
+ .pf-v5-c-masthead.pf-m-inset-md {
17835
+ padding-inline-start: var(--pf-v5-global--spacer--md);
17836
+ padding-inline-end: var(--pf-v5-global--spacer--md);
17959
17837
  }
17960
- .pf-v5-c-masthead .pf-v5-c-nav {
17961
- align-self: stretch;
17838
+ .pf-v5-c-masthead.pf-m-inset-lg {
17839
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
17840
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
17841
+ }
17842
+ .pf-v5-c-masthead.pf-m-inset-xl {
17843
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
17844
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
17845
+ }
17846
+ .pf-v5-c-masthead.pf-m-inset-2xl {
17847
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
17848
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
17962
17849
  }
17963
17850
 
17851
+ .pf-v5-c-masthead,
17964
17852
  .pf-v5-c-masthead__main {
17965
17853
  position: relative;
17854
+ }
17855
+
17856
+ .pf-v5-c-masthead__main,
17857
+ .pf-v5-c-masthead__content,
17858
+ .pf-v5-c-masthead__logo,
17859
+ .pf-v5-c-masthead__brand {
17966
17860
  display: flex;
17967
- flex-basis: var(--pf-v5-c-masthead__main--FlexBasis);
17968
- grid-column: var(--pf-v5-c-masthead__main--GridColumn);
17969
- align-items: center;
17970
17861
  align-self: stretch;
17971
- order: var(--pf-v5-c-masthead__main--Order);
17972
- min-height: var(--pf-v5-c-masthead__main--MinHeight);
17973
- padding-block-start: var(--pf-v5-c-masthead__main--PaddingTop);
17974
- padding-block-end: var(--pf-v5-c-masthead__main--PaddingBottom);
17975
- margin-inline-end: var(--pf-v5-c-masthead__main--MarginRight);
17976
- }
17977
- .pf-v5-c-masthead__main::before {
17978
- position: absolute;
17979
- inset-block-end: 0;
17980
- inset-inline-start: var(--pf-v5-c-masthead__main--before--Left);
17981
- inset-inline-end: var(--pf-v5-c-masthead__main--before--Right);
17982
- content: "";
17983
- border-block-end: var(--pf-v5-c-masthead__main--before--BorderBottom);
17984
17862
  }
17985
- .pf-v5-c-masthead__main:last-child {
17986
- --pf-v5-c-masthead__main--MarginRight: 0;
17863
+
17864
+ .pf-v5-c-masthead__main,
17865
+ .pf-v5-c-masthead__brand,
17866
+ .pf-v5-c-masthead__content {
17867
+ min-width: 0.25rem;
17987
17868
  }
17988
17869
 
17989
- .pf-v5-c-masthead__logo {
17990
- display: flex;
17991
- gap: var(--pf-t--global--spacer--md);
17870
+ .pf-v5-c-masthead__main {
17871
+ grid-column: var(--pf-v5-c-masthead__main--GridColumn);
17872
+ row-gap: var(--pf-v5-c-masthead__main--RowGap, var(--pf-v5-c-masthead--RowGap));
17873
+ align-items: var(--pf-v5-c-masthead__main--AlignItems, var(--pf-v5-c-masthead--AlignItems));
17874
+ order: var(--pf-v5-c-masthead__main--Order);
17875
+ padding-block-end: var(--pf-v5-c-masthead__main--PaddingBlockEnd);
17876
+ border-block-end: var(--pf-v5-c-masthead__main--BorderBlockEnd);
17992
17877
  }
17993
17878
 
17994
17879
  .pf-v5-c-masthead__content {
17995
- display: flex;
17996
- flex-grow: 1;
17997
- flex-shrink: 1;
17880
+ flex-wrap: wrap;
17998
17881
  grid-column: var(--pf-v5-c-masthead__content--GridColumn);
17999
17882
  grid-column-end: -1;
18000
- gap: var(--pf-v5-c-masthead__content--Gap);
18001
- align-items: center;
18002
- align-self: stretch;
17883
+ row-gap: var(--pf-v5-c-masthead__content-RowGap, var(--pf-v5-c-masthead--RowGap));
17884
+ column-gap: var(--pf-v5-c-masthead__content-ColumnGap, var(--pf-v5-c-masthead--ColumnGap));
17885
+ align-items: var(--pf-v5-c-masthead__content--AlignItems, var(--pf-v5-c-masthead--AlignItems));
18003
17886
  order: var(--pf-v5-c-masthead__content--Order);
18004
- min-height: var(--pf-v5-c-masthead__content--MinHeight);
18005
- padding-block-start: var(--pf-v5-c-masthead__content--PaddingTop);
18006
- padding-block-end: var(--pf-v5-c-masthead__content--PaddingBottom);
18007
- margin-inline-start: var(--pf-v5-c-masthead__content--MarginLeft);
18008
- }
18009
- .pf-v5-c-masthead__content:only-child {
18010
- --pf-v5-c-masthead__content--MarginLeft: 0;
18011
- }
18012
- .pf-v5-c-masthead__content .pf-v5-c-nav.pf-m-horizontal {
18013
- margin-inline-start: var(--pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft);
18014
- margin-inline-end: var(--pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight);
18015
- }
18016
- .pf-v5-c-masthead__toggle ~ .pf-v5-c-masthead__content {
18017
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: calc(var(--pf-v5-c-masthead__content--MarginLeft) * -1);
18018
- }
18019
-
18020
- .pf-v5-c-masthead__main,
18021
- .pf-v5-c-masthead__brand,
18022
- .pf-v5-c-masthead__content {
18023
- min-width: 0;
18024
17887
  }
18025
17888
 
18026
17889
  .pf-v5-c-masthead__brand {
18027
- display: inline-flex;
18028
- align-self: center;
17890
+ align-items: var(--pf-v5-c-masthead__brand--AlignItems, var(--pf-v5-c-masthead--AlignItems));
17891
+ max-height: var(--pf-v5-c-masthead__brand--MaxHeight);
17892
+ margin-inline-end: var(--pf-v5-c-masthead__brand--MarginInlineEnd);
18029
17893
  }
18030
17894
 
18031
17895
  .pf-v5-c-masthead__toggle {
18032
- grid-column: var(--pf-v5-c-masthead__toggle--GridColumn);
18033
- align-self: center;
18034
- margin-inline-start: var(--pf-v5-c-masthead__toggle--MarginLeft);
18035
- margin-inline-end: var(--pf-v5-c-masthead__toggle--MarginRight);
17896
+ --pf-v5-c-button--FontSize: var(--pf-v5-c-masthead__toggle--Size);
18036
17897
  }
18037
- .pf-v5-c-masthead__toggle .pf-v5-c-button {
18038
- --pf-v5-c-button--FontSize: var(--pf-v5-c-masthead__toggle--c-button--FontSize);
17898
+
17899
+ .pf-v5-c-masthead__expandable-content {
17900
+ row-gap: var(--pf-v5-c-masthead__expandable-content-RowGap, var(--pf-v5-c-masthead--RowGap));
17901
+ background-color: var(--pf-v5-c-masthead--BackgroundColor);
18039
17902
  }
18040
17903
 
18041
17904
  .pf-v5-c-masthead.pf-m-display-stack {
18042
17905
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18043
17906
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18044
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18045
17907
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18046
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18047
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18048
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18049
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18050
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
17908
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
17909
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18051
17910
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18052
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18053
17911
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18054
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18055
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18056
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18057
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18058
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18059
17912
  }
18060
17913
  .pf-v5-c-masthead.pf-m-display-inline {
18061
17914
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18062
17915
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18063
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18064
17916
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18065
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18066
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18067
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18068
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18069
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
17917
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
17918
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18070
17919
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18071
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18072
17920
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18073
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18074
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18075
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18076
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18077
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18078
17921
  }
18079
17922
  .pf-v5-c-masthead.pf-m-inset-none {
18080
- --pf-v5-c-masthead--inset: 0;
17923
+ padding-inline-start: 0;
17924
+ padding-inline-end: 0;
18081
17925
  }
18082
17926
  .pf-v5-c-masthead.pf-m-inset-sm {
18083
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
17927
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
17928
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18084
17929
  }
18085
17930
  .pf-v5-c-masthead.pf-m-inset-md {
18086
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
17931
+ padding-inline-start: var(--pf-v5-global--spacer--md);
17932
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18087
17933
  }
18088
17934
  .pf-v5-c-masthead.pf-m-inset-lg {
18089
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
17935
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
17936
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18090
17937
  }
18091
17938
  .pf-v5-c-masthead.pf-m-inset-xl {
18092
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
17939
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
17940
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18093
17941
  }
18094
17942
  .pf-v5-c-masthead.pf-m-inset-2xl {
18095
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
17943
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
17944
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18096
17945
  }
18097
17946
  @media (min-width: 576px) {
18098
17947
  .pf-v5-c-masthead.pf-m-display-stack-on-sm {
18099
17948
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18100
17949
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18101
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18102
17950
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18103
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18104
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18105
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18106
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18107
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
17951
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
17952
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18108
17953
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18109
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18110
17954
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18111
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18112
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18113
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18114
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18115
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18116
17955
  }
18117
17956
  .pf-v5-c-masthead.pf-m-display-inline-on-sm {
18118
17957
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18119
17958
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18120
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18121
17959
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18122
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18123
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18124
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18125
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18126
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
17960
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
17961
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18127
17962
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18128
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18129
17963
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18130
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18131
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18132
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18133
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18134
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18135
17964
  }
18136
17965
  }
18137
- @media (min-width: 576px) {
18138
- .pf-v5-c-masthead.pf-m-inset-none-on-sm {
18139
- --pf-v5-c-masthead--inset: 0;
18140
- }
18141
- .pf-v5-c-masthead.pf-m-inset-sm-on-sm {
18142
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18143
- }
18144
- .pf-v5-c-masthead.pf-m-inset-md-on-sm {
18145
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18146
- }
18147
- .pf-v5-c-masthead.pf-m-inset-lg-on-sm {
18148
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18149
- }
18150
- .pf-v5-c-masthead.pf-m-inset-xl-on-sm {
18151
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18152
- }
18153
- .pf-v5-c-masthead.pf-m-inset-2xl-on-sm {
18154
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18155
- }
17966
+ .pf-v5-c-masthead.pf-m-inset-none {
17967
+ padding-inline-start: 0;
17968
+ padding-inline-end: 0;
17969
+ }
17970
+ .pf-v5-c-masthead.pf-m-inset-sm {
17971
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
17972
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
17973
+ }
17974
+ .pf-v5-c-masthead.pf-m-inset-md {
17975
+ padding-inline-start: var(--pf-v5-global--spacer--md);
17976
+ padding-inline-end: var(--pf-v5-global--spacer--md);
17977
+ }
17978
+ .pf-v5-c-masthead.pf-m-inset-lg {
17979
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
17980
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
17981
+ }
17982
+ .pf-v5-c-masthead.pf-m-inset-xl {
17983
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
17984
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
17985
+ }
17986
+ .pf-v5-c-masthead.pf-m-inset-2xl {
17987
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
17988
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18156
17989
  }
18157
17990
  @media (min-width: 768px) {
18158
17991
  .pf-v5-c-masthead.pf-m-display-stack-on-md {
18159
17992
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18160
17993
  --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
17994
  --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);
17995
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
17996
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18168
17997
  --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
17998
  --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
17999
  }
18177
18000
  .pf-v5-c-masthead.pf-m-display-inline-on-md {
18178
18001
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18179
18002
  --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
18003
  --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);
18004
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18005
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18187
18006
  --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
18007
  --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
18008
  }
18196
18009
  }
18197
- @media (min-width: 768px) {
18198
- .pf-v5-c-masthead.pf-m-inset-none-on-md {
18199
- --pf-v5-c-masthead--inset: 0;
18200
- }
18201
- .pf-v5-c-masthead.pf-m-inset-sm-on-md {
18202
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18203
- }
18204
- .pf-v5-c-masthead.pf-m-inset-md-on-md {
18205
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18206
- }
18207
- .pf-v5-c-masthead.pf-m-inset-lg-on-md {
18208
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18209
- }
18210
- .pf-v5-c-masthead.pf-m-inset-xl-on-md {
18211
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18212
- }
18213
- .pf-v5-c-masthead.pf-m-inset-2xl-on-md {
18214
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18215
- }
18010
+ .pf-v5-c-masthead.pf-m-inset-none {
18011
+ padding-inline-start: 0;
18012
+ padding-inline-end: 0;
18013
+ }
18014
+ .pf-v5-c-masthead.pf-m-inset-sm {
18015
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18016
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18017
+ }
18018
+ .pf-v5-c-masthead.pf-m-inset-md {
18019
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18020
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18021
+ }
18022
+ .pf-v5-c-masthead.pf-m-inset-lg {
18023
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18024
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18025
+ }
18026
+ .pf-v5-c-masthead.pf-m-inset-xl {
18027
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18028
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18029
+ }
18030
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18031
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18032
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18216
18033
  }
18217
18034
  @media (min-width: 992px) {
18218
18035
  .pf-v5-c-masthead.pf-m-display-stack-on-lg {
18219
18036
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18220
18037
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18221
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18222
18038
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18223
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18224
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18225
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18226
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18227
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18039
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18040
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18228
18041
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18229
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18230
18042
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18231
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18232
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18233
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18234
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18235
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18236
18043
  }
18237
18044
  .pf-v5-c-masthead.pf-m-display-inline-on-lg {
18238
18045
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18239
18046
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18240
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18241
18047
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18242
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18243
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18244
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18245
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18246
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18048
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18049
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18247
18050
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18248
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18249
18051
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18250
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18251
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18252
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18253
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18254
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18255
18052
  }
18256
18053
  }
18257
- @media (min-width: 992px) {
18258
- .pf-v5-c-masthead.pf-m-inset-none-on-lg {
18259
- --pf-v5-c-masthead--inset: 0;
18260
- }
18261
- .pf-v5-c-masthead.pf-m-inset-sm-on-lg {
18262
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18263
- }
18264
- .pf-v5-c-masthead.pf-m-inset-md-on-lg {
18265
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18266
- }
18267
- .pf-v5-c-masthead.pf-m-inset-lg-on-lg {
18268
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18269
- }
18270
- .pf-v5-c-masthead.pf-m-inset-xl-on-lg {
18271
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18272
- }
18273
- .pf-v5-c-masthead.pf-m-inset-2xl-on-lg {
18274
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18275
- }
18054
+ .pf-v5-c-masthead.pf-m-inset-none {
18055
+ padding-inline-start: 0;
18056
+ padding-inline-end: 0;
18057
+ }
18058
+ .pf-v5-c-masthead.pf-m-inset-sm {
18059
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18060
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18061
+ }
18062
+ .pf-v5-c-masthead.pf-m-inset-md {
18063
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18064
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18065
+ }
18066
+ .pf-v5-c-masthead.pf-m-inset-lg {
18067
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18068
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18069
+ }
18070
+ .pf-v5-c-masthead.pf-m-inset-xl {
18071
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18072
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18073
+ }
18074
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18075
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18076
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18276
18077
  }
18277
18078
  @media (min-width: 1200px) {
18278
18079
  .pf-v5-c-masthead.pf-m-display-stack-on-xl {
18279
18080
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18280
18081
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18281
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18282
18082
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18283
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18284
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18285
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18286
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18287
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18083
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18084
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18288
18085
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18289
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18290
18086
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18291
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18292
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18293
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18294
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18295
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18296
18087
  }
18297
18088
  .pf-v5-c-masthead.pf-m-display-inline-on-xl {
18298
18089
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18299
18090
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18300
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18301
18091
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18302
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18303
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18304
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18305
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18306
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18092
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18093
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18307
18094
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18308
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18309
18095
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18310
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18311
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18312
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18313
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18314
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18315
18096
  }
18316
18097
  }
18317
- @media (min-width: 1200px) {
18318
- .pf-v5-c-masthead.pf-m-inset-none-on-xl {
18319
- --pf-v5-c-masthead--inset: 0;
18320
- }
18321
- .pf-v5-c-masthead.pf-m-inset-sm-on-xl {
18322
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18323
- }
18324
- .pf-v5-c-masthead.pf-m-inset-md-on-xl {
18325
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18326
- }
18327
- .pf-v5-c-masthead.pf-m-inset-lg-on-xl {
18328
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18329
- }
18330
- .pf-v5-c-masthead.pf-m-inset-xl-on-xl {
18331
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18332
- }
18333
- .pf-v5-c-masthead.pf-m-inset-2xl-on-xl {
18334
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18335
- }
18098
+ .pf-v5-c-masthead.pf-m-inset-none {
18099
+ padding-inline-start: 0;
18100
+ padding-inline-end: 0;
18101
+ }
18102
+ .pf-v5-c-masthead.pf-m-inset-sm {
18103
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18104
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18105
+ }
18106
+ .pf-v5-c-masthead.pf-m-inset-md {
18107
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18108
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18109
+ }
18110
+ .pf-v5-c-masthead.pf-m-inset-lg {
18111
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18112
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18113
+ }
18114
+ .pf-v5-c-masthead.pf-m-inset-xl {
18115
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18116
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18117
+ }
18118
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18119
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18120
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18336
18121
  }
18337
18122
  @media (min-width: 1450px) {
18338
18123
  .pf-v5-c-masthead.pf-m-display-stack-on-2xl {
18339
18124
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-stack--GridTemplateColumns);
18340
18125
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-stack__main--GridColumn);
18341
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-stack__main--MinHeight);
18342
18126
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-stack__main--Order);
18343
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-stack__main--FlexBasis);
18344
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__main--PaddingTop);
18345
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBottom);
18346
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-stack__main--MarginRight);
18347
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-stack__main--before--BorderBottom);
18127
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--PaddingBlockEnd);
18128
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-stack__main--BorderBlockEnd);
18348
18129
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-stack__content--GridColumn);
18349
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-stack__content--MinHeight);
18350
18130
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-stack__content--Order);
18351
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-stack__content--PaddingTop);
18352
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-stack__content--PaddingBottom);
18353
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--MarginLeft);
18354
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginRight);
18355
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-stack__content--c-nav--m-horizontal--MarginLeft);
18356
18131
  }
18357
18132
  .pf-v5-c-masthead.pf-m-display-inline-on-2xl {
18358
18133
  --pf-v5-c-masthead--GridTemplateColumns: var(--pf-v5-c-masthead--m-display-inline--GridTemplateColumns);
18359
18134
  --pf-v5-c-masthead__main--GridColumn: var(--pf-v5-c-masthead--m-display-inline__main--GridColumn);
18360
- --pf-v5-c-masthead__main--MinHeight: var(--pf-v5-c-masthead--m-display-inline__main--MinHeight);
18361
18135
  --pf-v5-c-masthead__main--Order: var(--pf-v5-c-masthead--m-display-inline__main--Order);
18362
- --pf-v5-c-masthead__main--FlexBasis: var(--pf-v5-c-masthead--m-display-inline__main--FlexBasis);
18363
- --pf-v5-c-masthead__main--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__main--PaddingTop);
18364
- --pf-v5-c-masthead__main--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBottom);
18365
- --pf-v5-c-masthead__main--MarginRight: var(--pf-v5-c-masthead--m-display-inline__main--MarginRight);
18366
- --pf-v5-c-masthead__main--before--BorderBottom: var(--pf-v5-c-masthead--m-display-inline__main--BorderBottom);
18136
+ --pf-v5-c-masthead__main--PaddingBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--PaddingBlockEnd);
18137
+ --pf-v5-c-masthead__main--BorderBlockEnd: var(--pf-v5-c-masthead--m-display-inline__main--BorderBlockEnd);
18367
18138
  --pf-v5-c-masthead__content--GridColumn: var(--pf-v5-c-masthead--m-display-inline__content--GridColumn);
18368
- --pf-v5-c-masthead__content--MinHeight: var(--pf-v5-c-masthead--m-display-inline__content--MinHeight);
18369
18139
  --pf-v5-c-masthead__content--Order: var(--pf-v5-c-masthead--m-display-inline__content--Order);
18370
- --pf-v5-c-masthead__content--PaddingTop: var(--pf-v5-c-masthead--m-display-inline__content--PaddingTop);
18371
- --pf-v5-c-masthead__content--PaddingBottom: var(--pf-v5-c-masthead--m-display-inline__content--PaddingBottom);
18372
- --pf-v5-c-masthead__content--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--MarginLeft);
18373
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginRight: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginRight);
18374
- --pf-v5-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-v5-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
18375
18140
  }
18376
18141
  }
18377
- @media (min-width: 1450px) {
18378
- .pf-v5-c-masthead.pf-m-inset-none-on-2xl {
18379
- --pf-v5-c-masthead--inset: 0;
18380
- }
18381
- .pf-v5-c-masthead.pf-m-inset-sm-on-2xl {
18382
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--sm);
18383
- }
18384
- .pf-v5-c-masthead.pf-m-inset-md-on-2xl {
18385
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--md);
18386
- }
18387
- .pf-v5-c-masthead.pf-m-inset-lg-on-2xl {
18388
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--lg);
18389
- }
18390
- .pf-v5-c-masthead.pf-m-inset-xl-on-2xl {
18391
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--xl);
18392
- }
18393
- .pf-v5-c-masthead.pf-m-inset-2xl-on-2xl {
18394
- --pf-v5-c-masthead--inset: var(--pf-v5-global--spacer--2xl);
18395
- }
18142
+ .pf-v5-c-masthead.pf-m-inset-none {
18143
+ padding-inline-start: 0;
18144
+ padding-inline-end: 0;
18145
+ }
18146
+ .pf-v5-c-masthead.pf-m-inset-sm {
18147
+ padding-inline-start: var(--pf-v5-global--spacer--sm);
18148
+ padding-inline-end: var(--pf-v5-global--spacer--sm);
18149
+ }
18150
+ .pf-v5-c-masthead.pf-m-inset-md {
18151
+ padding-inline-start: var(--pf-v5-global--spacer--md);
18152
+ padding-inline-end: var(--pf-v5-global--spacer--md);
18153
+ }
18154
+ .pf-v5-c-masthead.pf-m-inset-lg {
18155
+ padding-inline-start: var(--pf-v5-global--spacer--lg);
18156
+ padding-inline-end: var(--pf-v5-global--spacer--lg);
18157
+ }
18158
+ .pf-v5-c-masthead.pf-m-inset-xl {
18159
+ padding-inline-start: var(--pf-v5-global--spacer--xl);
18160
+ padding-inline-end: var(--pf-v5-global--spacer--xl);
18161
+ }
18162
+ .pf-v5-c-masthead.pf-m-inset-2xl {
18163
+ padding-inline-start: var(--pf-v5-global--spacer--2xl);
18164
+ padding-inline-end: var(--pf-v5-global--spacer--2xl);
18396
18165
  }
18397
18166
 
18398
18167
  .pf-v5-c-menu {
@@ -19266,6 +19035,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
19266
19035
  align-self: stretch;
19267
19036
  }
19268
19037
  .pf-v5-c-menu-toggle.pf-m-split-button > .pf-v5-c-check .pf-v5-c-check__input {
19038
+ --pf-v5-c-check__input--TranslateY: 0;
19269
19039
  align-self: center;
19270
19040
  }
19271
19041
  .pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *::after {
@@ -23041,12 +22811,10 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
23041
22811
 
23042
22812
  .pf-v5-c-popover__arrow {
23043
22813
  position: absolute;
23044
- /* stylelint-disable liberty/use-logical-spec */
23045
22814
  top: var(--pf-v5-c-popover__arrow--Top, auto);
23046
22815
  right: var(--pf-v5-c-popover__arrow--Right, auto);
23047
22816
  bottom: var(--pf-v5-c-popover__arrow--Bottom, auto);
23048
22817
  left: var(--pf-v5-c-popover__arrow--Left, auto);
23049
- /* stylelint-enable */
23050
22818
  width: var(--pf-v5-c-popover__arrow--Width);
23051
22819
  height: var(--pf-v5-c-popover__arrow--Height);
23052
22820
  pointer-events: none;
@@ -24869,34 +24637,31 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
24869
24637
  --pf-v5-c-sidebar__panel--FlexBasis: 100%;
24870
24638
  }
24871
24639
  }
24872
- .pf-v5-c-simple-list {
24873
- --pf-v5-c-simple-list__item-link--PaddingTop: var(--pf-v5-global--spacer--xs);
24874
- --pf-v5-c-simple-list__item-link--PaddingRight: var(--pf-v5-global--spacer--md);
24875
- --pf-v5-c-simple-list__item-link--PaddingBottom: var(--pf-v5-global--spacer--xs);
24876
- --pf-v5-c-simple-list__item-link--PaddingLeft: var(--pf-v5-global--spacer--md);
24877
- --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
24878
- --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-global--Color--100);
24879
- --pf-v5-c-simple-list__item-link--FontSize: var(--pf-v5-global--FontSize--sm);
24880
- --pf-v5-c-simple-list__item-link--FontWeight: var(--pf-v5-global--FontWeight--normal);
24881
- --pf-v5-c-simple-list__item-link--m-current--Color: var(--pf-v5-global--link--Color);
24882
- --pf-v5-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
24883
- --pf-v5-c-simple-list__item-link--m-current--FontWeight: var(--pf-v5-global--FontWeight--normal);
24884
- --pf-v5-c-simple-list__item-link--hover--Color: var(--pf-v5-global--Color--100);
24885
- --pf-v5-c-simple-list__item-link--hover--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
24886
- --pf-v5-c-simple-list__item-link--focus--Color: var(--pf-v5-global--Color--100);
24887
- --pf-v5-c-simple-list__item-link--focus--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
24888
- --pf-v5-c-simple-list__item-link--focus--FontWeight: var(--pf-v5-global--FontWeight--normal);
24889
- --pf-v5-c-simple-list__item-link--active--Color: var(--pf-v5-global--Color--100);
24890
- --pf-v5-c-simple-list__item-link--active--BackgroundColor: var(--pf-v5-global--BackgroundColor--200);
24891
- --pf-v5-c-simple-list__item-link--active--FontWeight: var(--pf-v5-global--FontWeight--normal);
24892
- --pf-v5-c-simple-list__title--PaddingTop: var(--pf-v5-global--spacer--sm);
24893
- --pf-v5-c-simple-list__title--PaddingRight: var(--pf-v5-global--spacer--md);
24894
- --pf-v5-c-simple-list__title--PaddingBottom: var(--pf-v5-global--spacer--sm);
24895
- --pf-v5-c-simple-list__title--PaddingLeft: var(--pf-v5-global--spacer--md);
24896
- --pf-v5-c-simple-list__title--FontSize: var(--pf-v5-global--FontSize--sm);
24897
- --pf-v5-c-simple-list__title--Color: var(--pf-v5-global--Color--dark-200);
24898
- --pf-v5-c-simple-list__title--FontWeight: var(--pf-v5-global--FontWeight--bold);
24899
- --pf-v5-c-simple-list__section--section--MarginTop: var(--pf-v5-global--spacer--sm);
24640
+ :root, .pf-v5-c-simple-list {
24641
+ --pf-v5-c-simple-list__item-link--PaddingTop: var(--pf-t--global--spacer--xs);
24642
+ --pf-v5-c-simple-list__item-link--PaddingRight: var(--pf-t--global--spacer--md);
24643
+ --pf-v5-c-simple-list__item-link--PaddingBottom: var(--pf-t--global--spacer--xs);
24644
+ --pf-v5-c-simple-list__item-link--PaddingLeft: var(--pf-t--global--spacer--md);
24645
+ --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
24646
+ --pf-v5-c-simple-list__item-link--Color: var(--pf-t--global--text--color--subtle);
24647
+ --pf-v5-c-simple-list__item-link--FontSize: var(--pf-t--global--font--size--body);
24648
+ --pf-v5-c-simple-list__item-link--m-current--Color: var(--pf-t--global--text--color--regular);
24649
+ --pf-v5-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-t--global--background--color--action--plain--selected);
24650
+ --pf-v5-c-simple-list__item-link--hover--Color: var(--pf-t--global--text--color--subtle);
24651
+ --pf-v5-c-simple-list__item-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
24652
+ --pf-v5-c-simple-list__item-link--MixBlendMode: var(--pf-t--global--background--color--action--plain--hover--blend);
24653
+ --pf-v5-c-simple-list__item-link--BorderRadius: var(--pf-t--global--border--radius--tiny);
24654
+ --pf-v5-c-simple-list__item-link--m-link--Color: var(--pf-t--global--text--color--link--default);
24655
+ --pf-v5-c-simple-list__item-link--m-link--m-current--Color: var(--pf-t--global--text--color--link--hover);
24656
+ --pf-v5-c-simple-list__item-link--m-link--hover--Color: var(--pf-t--global--text--color--link--hover);
24657
+ --pf-v5-c-simple-list__title--PaddingTop: var(--pf-t--global--spacer--sm);
24658
+ --pf-v5-c-simple-list__title--PaddingRight: var(--pf-t--global--spacer--md);
24659
+ --pf-v5-c-simple-list__title--PaddingBottom: var(--pf-t--global--spacer--sm);
24660
+ --pf-v5-c-simple-list__title--PaddingLeft: var(--pf-t--global--spacer--md);
24661
+ --pf-v5-c-simple-list__title--FontSize: var(--pf-t--global--font--size--body--sm);
24662
+ --pf-v5-c-simple-list__title--Color: var(--pf-t--global--text--color--regular);
24663
+ --pf-v5-c-simple-list__title--FontWeight: var(--pf-t--global--font--weight--body--bold);
24664
+ --pf-v5-c-simple-list__section--section--MarginTop: var(--pf-t--global--spacer--sm);
24900
24665
  }
24901
24666
 
24902
24667
  .pf-v5-c-simple-list__item-link {
@@ -24907,31 +24672,28 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
24907
24672
  padding-inline-start: var(--pf-v5-c-simple-list__item-link--PaddingLeft);
24908
24673
  padding-inline-end: var(--pf-v5-c-simple-list__item-link--PaddingRight);
24909
24674
  font-size: var(--pf-v5-c-simple-list__item-link--FontSize);
24910
- font-weight: var(--pf-v5-c-simple-list__item-link--FontWeight);
24911
24675
  color: var(--pf-v5-c-simple-list__item-link--Color);
24912
24676
  text-align: start;
24677
+ text-decoration: none;
24913
24678
  background-color: var(--pf-v5-c-simple-list__item-link--BackgroundColor);
24914
24679
  border: none;
24680
+ border-radius: var(--pf-v5-c-simple-list__item-link--BorderRadius);
24681
+ }
24682
+ .pf-v5-c-simple-list__item-link.pf-m-link {
24683
+ --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--m-link--Color);
24684
+ --pf-v5-c-simple-list__item-link--hover--Color: var(--pf-v5-c-simple-list__item-link--m-link--m-current--Color);
24685
+ --pf-v5-c-simple-list__item-link--m-current--Color: var(--pf-v5-c-simple-list__item-link--m-link--hover--Color);
24915
24686
  }
24916
- .pf-v5-c-simple-list__item-link:hover {
24687
+ .pf-v5-c-simple-list__item-link:hover, .pf-v5-c-simple-list__item-link:focus {
24917
24688
  --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-c-simple-list__item-link--hover--BackgroundColor);
24918
24689
  --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--hover--Color);
24919
24690
  text-decoration: none;
24920
- }
24921
- .pf-v5-c-simple-list__item-link:focus {
24922
- --pf-v5-c-simple-list__item-link--FontWeight: var(--pf-v5-c-simple-list__item-link--focus--FontWeight);
24923
- --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-c-simple-list__item-link--focus--BackgroundColor);
24924
- --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--focus--Color);
24925
- }
24926
- .pf-v5-c-simple-list__item-link:active {
24927
- --pf-v5-c-simple-list__item-link--FontWeight: var(--pf-v5-c-simple-list__item-link--active--FontWeight);
24928
- --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-c-simple-list__item-link--active--BackgroundColor);
24929
- --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--active--Color);
24691
+ mix-blend-mode: var(--pf-v5-c-simple-list__item-link--MixBlendMode);
24930
24692
  }
24931
24693
  .pf-v5-c-simple-list__item-link.pf-m-current {
24932
- --pf-v5-c-simple-list__item-link--FontWeight: var(--pf-v5-c-simple-list__item-link--m-current--FontWeight);
24933
24694
  --pf-v5-c-simple-list__item-link--BackgroundColor: var(--pf-v5-c-simple-list__item-link--m-current--BackgroundColor);
24934
24695
  --pf-v5-c-simple-list__item-link--Color: var(--pf-v5-c-simple-list__item-link--m-current--Color);
24696
+ mix-blend-mode: var(--pf-v5-c-simple-list__item-link--MixBlendMode);
24935
24697
  }
24936
24698
 
24937
24699
  .pf-v5-c-simple-list__title {
@@ -24948,21 +24710,6 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
24948
24710
  margin-block-start: var(--pf-v5-c-simple-list__section--section--MarginTop);
24949
24711
  }
24950
24712
 
24951
- :where(.pf-v5-theme-dark) .pf-v5-c-wizard__header .pf-v5-c-button, :where(.pf-v5-theme-dark) .pf-v5-c-log-viewer.pf-m-dark .pf-v5-c-log-viewer__main .pf-v5-c-button {
24952
- --pf-v5-c-button--m-primary--BackgroundColor: var(--pf-v5-global--primary-color--300);
24953
- }
24954
-
24955
- :where(.pf-v5-theme-dark) .pf-v5-c-simple-list {
24956
- --pf-v5-c-simple-list__item-link--m-current--Color: var(--pf-v5-global--active-color--100);
24957
- --pf-v5-c-simple-list__item-link--m-current--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
24958
- --pf-v5-c-simple-list__item-link--hover--Color: var(--pf-v5-global--Color--100);
24959
- --pf-v5-c-simple-list__item-link--hover--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
24960
- --pf-v5-c-simple-list__item-link--focus--Color: var(--pf-v5-global--Color--100);
24961
- --pf-v5-c-simple-list__item-link--focus--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
24962
- --pf-v5-c-simple-list__item-link--active--Color: var(--pf-v5-global--Color--100);
24963
- --pf-v5-c-simple-list__item-link--active--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
24964
- }
24965
-
24966
24713
  .pf-v5-c-skeleton {
24967
24714
  --pf-v5-c-skeleton--BackgroundColor: var(--pf-v5-global--palette--black-150);
24968
24715
  --pf-v5-c-skeleton--Width: auto;
@@ -30776,12 +30523,10 @@ svg.pf-v5-c-spinner.pf-m-xl {
30776
30523
 
30777
30524
  .pf-v5-c-tooltip__arrow {
30778
30525
  position: absolute;
30779
- /* stylelint-disable liberty/use-logical-spec */
30780
30526
  top: var(--pf-v5-c-tooltip__arrow--Top, auto);
30781
30527
  right: var(--pf-v5-c-tooltip__arrow--Right, auto);
30782
30528
  bottom: var(--pf-v5-c-tooltip__arrow--Bottom, auto);
30783
30529
  left: var(--pf-v5-c-tooltip__arrow--Left, auto);
30784
- /* stylelint-enable */
30785
30530
  width: var(--pf-v5-c-tooltip__arrow--Width);
30786
30531
  height: var(--pf-v5-c-tooltip__arrow--Height);
30787
30532
  pointer-events: none;
@@ -30790,9 +30535,13 @@ svg.pf-v5-c-spinner.pf-m-xl {
30790
30535
  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));
30791
30536
  }
30792
30537
 
30538
+ :root,
30793
30539
  .pf-v5-c-truncate {
30794
30540
  --pf-v5-c-truncate--MinWidth: 12ch;
30795
30541
  --pf-v5-c-truncate__start--MinWidth: 6ch;
30542
+ }
30543
+
30544
+ .pf-v5-c-truncate {
30796
30545
  display: inline-grid;
30797
30546
  grid-auto-flow: column;
30798
30547
  align-items: baseline;