@patternfly/react-styles 6.0.0-alpha.20 → 6.0.0-alpha.21

package/css/components/Page/page.css

@@ -1,97 +1,8 @@
-.pf-v6-c-page__sidebar-body.pf-m-menu .pf-v6-c-context-selector {
-  --pf-v6-global--Color--100: var(--pf-v6-global--Color--light-100);
-  --pf-v6-global--Color--200: var(--pf-v6-global--Color--light-200);
-  --pf-v6-global--BorderColor--100: var(--pf-v6-global--BorderColor--light-100);
-  --pf-v6-global--primary-color--100: var(--pf-v6-global--primary-color--light-100);
-  --pf-v6-global--link--Color: var(--pf-v6-global--link--Color--light);
-  --pf-v6-global--link--Color--hover: var(--pf-v6-global--link--Color--light);
-  --pf-v6-global--BackgroundColor--100: var(--pf-v6-global--BackgroundColor--dark-100);
-  --pf-v6-global--icon--Color--light: var(--pf-v6-global--icon--Color--light--light);
-  --pf-v6-global--icon--Color--dark: var(--pf-v6-global--icon--Color--dark--light);
-}
-.pf-v6-c-page__sidebar-body.pf-m-menu .pf-v6-c-context-selector .pf-v6-c-button {
-  --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-v6-global--primary-color--dark-100);
-}
-
-.pf-v6-c-page__header-tools-item, .pf-v6-c-page__header-tools-group {
-  --pf-v6-hidden-visible--hidden--Display: none;
-  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
-  display: var(--pf-v6-hidden-visible--Display);
-}
-.pf-m-hidden.pf-v6-c-page__header-tools-item, .pf-m-hidden.pf-v6-c-page__header-tools-group {
-  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
-}
-@media screen and (min-width: 576px) {
-  .pf-m-hidden-on-sm.pf-v6-c-page__header-tools-item, .pf-m-hidden-on-sm.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
-  }
-  .pf-m-visible-on-sm.pf-v6-c-page__header-tools-item, .pf-m-visible-on-sm.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
-  }
-}
-@media screen and (min-width: 768px) {
-  .pf-m-hidden-on-md.pf-v6-c-page__header-tools-item, .pf-m-hidden-on-md.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
-  }
-  .pf-m-visible-on-md.pf-v6-c-page__header-tools-item, .pf-m-visible-on-md.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
-  }
-}
-@media screen and (min-width: 992px) {
-  .pf-m-hidden-on-lg.pf-v6-c-page__header-tools-item, .pf-m-hidden-on-lg.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
-  }
-  .pf-m-visible-on-lg.pf-v6-c-page__header-tools-item, .pf-m-visible-on-lg.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
-  }
-}
-@media screen and (min-width: 1200px) {
-  .pf-m-hidden-on-xl.pf-v6-c-page__header-tools-item, .pf-m-hidden-on-xl.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
-  }
-  .pf-m-visible-on-xl.pf-v6-c-page__header-tools-item, .pf-m-visible-on-xl.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
-  }
-}
-@media screen and (min-width: 1450px) {
-  .pf-m-hidden-on-2xl.pf-v6-c-page__header-tools-item, .pf-m-hidden-on-2xl.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
-  }
-  .pf-m-visible-on-2xl.pf-v6-c-page__header-tools-item, .pf-m-visible-on-2xl.pf-v6-c-page__header-tools-group {
-    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
-  }
-}
-
-:root {
+:where(:root, .pf-v6-c-page) {
   --pf-v6-c-page--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
   --pf-v6-c-page--inset: var(--pf-t--global--spacer--md);
   --pf-v6-c-page--xl--inset: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-page__header--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
-  --pf-v6-c-page__header--ZIndex: var(--pf-t--global--z-index--md);
-  --pf-v6-c-page__header--MinHeight: 4.75rem;
-  --pf-v6-c-page__header-brand--PaddingLeft: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__header-brand--xl--PaddingRight: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-page__header-brand--xl--PaddingLeft: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-page__header-sidebar-toggle__c-button--PaddingTop: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-page__header-sidebar-toggle__c-button--PaddingRight: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-page__header-sidebar-toggle__c-button--PaddingBottom: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-page__header-sidebar-toggle__c-button--PaddingLeft: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-page__header-sidebar-toggle__c-button--MarginRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__header-sidebar-toggle__c-button--MarginLeft: calc(var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingLeft) * -1);
-  --pf-v6-c-page__header-sidebar-toggle__c-button--FontSize: var(--pf-t--global--icon--size--lg);
-  --pf-v6-c-page__header-brand-link--c-brand--MaxHeight: 3.75rem;
-  --pf-v6-c-page__header-nav--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
-  --pf-v6-c-page__header-nav--xl--BackgroundColor: transparent;
-  --pf-v6-c-page__header-nav--xl--PaddingRight: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-page__header-nav--xl--PaddingLeft: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-page__header-tools--MarginRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__header-tools--xl--MarginRight: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-page__header-tools--c-avatar--MarginLeft: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__header-tools-group--MarginLeft: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-page__header-tools-group--Display: flex;
-  --pf-v6-c-page__header-tools-item--Display: block;
-  --pf-v6-c-page__header-tools--c-button--m-selected--before--Width: auto;
-  --pf-v6-c-page__header-tools--c-button--m-selected--before--Height: auto;
+  --pf-v6-c-page--c-masthead--ZIndex: var(--pf-t--global--z-index--md);
   --pf-v6-c-page__sidebar--ZIndex: var(--pf-t--global--z-index--sm);
   --pf-v6-c-page__sidebar--Width: 18.125rem;
   --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
@@ -101,26 +12,22 @@
   --pf-v6-c-page__sidebar--TranslateZ: 0;
   --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
   --pf-v6-c-page__sidebar--xl--TranslateX: 0;
-  --pf-v6-c-page__sidebar--MarginRight: 0;
+  --pf-v6-c-page__sidebar--MarginInlineEnd: 0;
   --pf-v6-c-page__sidebar--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
   --pf-v6-c-page__sidebar--PaddingInlineStart: 0;
-  --pf-v6-c-page__sidebar-header--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
-  --pf-v6-c-page__sidebar-header--BorderBottomColor: var(--pf-t--global--border--color--default);
-  --pf-v6-c-page__sidebar-header--PaddingTop: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-page__sidebar-header--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__sidebar-title--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-page__sidebar-header--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
+  --pf-v6-c-page__sidebar-header--BorderBlockEndColor: var(--pf-t--global--border--color--default);
+  --pf-v6-c-page__sidebar-header--PaddingBlockStart: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-page__sidebar-header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-page__sidebar-title--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-page__sidebar-title--FontSize: var(--pf-t--global--font--size--heading--xs);
   --pf-v6-c-page__sidebar-title--LineHeight: var(--pf-t--global--font--line-height--heading);
   --pf-v6-c-page__sidebar-title--FontFamily: var(--pf-t--global--font--family--heading);
   --pf-v6-c-page__sidebar-title--FontWeight: var(--pf-t--global--font--weight--heading);
-  --pf-v6-c-page__sidebar-body--PaddingRight: 0;
-  --pf-v6-c-page__sidebar-body--PaddingLeft: 0;
-  --pf-v6-c-page__sidebar-body--m-page-insets--PaddingRight: var(--pf-v6-c-page--inset);
-  --pf-v6-c-page__sidebar-body--m-page-insets--PaddingLeft: var(--pf-v6-c-page--inset);
-  --pf-v6-c-page__sidebar-body--m-menu--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
-  --pf-v6-c-page__sidebar-body--m-menu--BorderTopColor: var(--pf-t--global--border--color--default);
-  --pf-v6-c-page__sidebar-body--m-menu--BorderTopWidth: var(--pf-t--global--border--width--button--default);
-  --pf-v6-c-page__sidebar-body--m-menu--c-context-selector--BorderBottomColor: var(--pf-t--global--border--color--default);
+  --pf-v6-c-page__sidebar-body--PaddingInlineEnd: 0;
+  --pf-v6-c-page__sidebar-body--PaddingInlineStart: 0;
+  --pf-v6-c-page__sidebar-body--m-page-insets--PaddingInlineEnd: var(--pf-v6-c-page--inset);
+  --pf-v6-c-page__sidebar-body--m-page-insets--PaddingInlineStart: var(--pf-v6-c-page--inset);
   --pf-v6-c-page__main-container--ZIndex: var(--pf-t--global--z-index--xs);
   --pf-v6-c-page__main-container--MaxHeight: calc(100% - var(--pf-t--global--spacer--lg));
   --pf-v6-c-page__main-container--BackgroundColor: var(--pf-t--global--background--color--primary--default);
@@ -129,16 +36,16 @@
   --pf-v6-c-page__main-container--BorderRadius: var(--pf-t--global--border--radius--large);
   --pf-v6-c-page__main-container--BorderWidth: var(--pf-t--global--spacer--sm);
   --pf-v6-c-page__main-container--BorderColor: var(--pf-v6-c-page__main-container--BackgroundColor);
-  --pf-v6-c-page__main-section--MarginTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__main-section--PaddingTop: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-page__main-section--PaddingRight: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
-  --pf-v6-c-page__main-section--PaddingBottom: 0;
-  --pf-v6-c-page__main-section--PaddingLeft: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
-  --pf-v6-c-page__main-breadcrumb--main-section--PaddingTop: var(--pf-t--global--spacer--md);
+  --pf-v6-c-page__main-section--MarginBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-page__main-section--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
+  --pf-v6-c-page__main-section--PaddingBlockEnd: 0;
+  --pf-v6-c-page__main-section--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
+  --pf-v6-c-page__main-breadcrumb--main-section--PaddingBlockStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-page__main-section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --pf-v6-c-page__main-section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
-  --pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__main-nav--page__main-tabs--PaddingTop: var(--pf-t--global--spacer--md);
+  --pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-page__main-nav--page__main-tabs--PaddingBlockStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-page--section--m-limit-width--MaxWidth: calc(125rem - var(--pf-v6-c-page__sidebar--Width));
   --pf-v6-c-page--section--m-sticky-top--ZIndex: var(--pf-t--global--z-index--md);
   --pf-v6-c-page--section--m-sticky-top--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
@@ -149,50 +56,37 @@
   --pf-v6-c-page--section--m-shadow-top--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
   --pf-v6-c-page--section--m-shadow-top--ZIndex: var(--pf-t--global--z-index--xs);
   --pf-v6-c-page__main-nav--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
-  --pf-v6-c-page__main-nav--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__main-nav--PaddingRight: 0;
-  --pf-v6-c-page__main-nav--PaddingLeft: 0;
-  --pf-v6-c-page__main-nav--m-sticky-top--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__main-nav--xl--PaddingRight: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-page__main-nav--xl--PaddingLeft: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-page__main-nav--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-page__main-nav--PaddingInlineEnd: 0;
+  --pf-v6-c-page__main-nav--PaddingInlineStart: 0;
+  --pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-page__main-nav--xl--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-page__main-nav--xl--PaddingInlineStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-page__main-subnav--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --pf-v6-c-page__main-subnav--PaddingBlockStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-page__main-subnav--PaddingBlockEnd: 0;
   --pf-v6-c-page__main-subnav--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
   --pf-v6-c-page__main-subnav--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
-  --pf-v6-c-page__main-breadcrumb--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-page__main-breadcrumb--PaddingRight: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
-  --pf-v6-c-page__main-breadcrumb--PaddingBottom: 0;
-  --pf-v6-c-page__main-breadcrumb--PaddingLeft: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
+  --pf-v6-c-page__main-breadcrumb--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-page__main-breadcrumb--PaddingInlineEnd: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
+  --pf-v6-c-page__main-breadcrumb--PaddingBlockEnd: 0;
+  --pf-v6-c-page__main-breadcrumb--PaddingInlineStart: calc(var(--pf-t--global--spacer--lg) - var(--pf-v6-c-page__main-container--BorderWidth));
   --pf-v6-c-page__main-breadcrumb--BackgroundColor: var(--pf-t--global--background--color--primary--default);
-  --pf-v6-c-page__main-tabs--PaddingTop: 0;
-  --pf-v6-c-page__main-tabs--PaddingRight: 0;
-  --pf-v6-c-page__main-tabs--PaddingBottom: 0;
+  --pf-v6-c-page__main-tabs--PaddingBlockStart: 0;
+  --pf-v6-c-page__main-tabs--PaddingInlineEnd: 0;
+  --pf-v6-c-page__main-tabs--PaddingBlockEnd: 0;
   --pf-v6-c-page__main-tabs--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --pf-v6-c-page__main-wizard--BackgroundColor: var(--pf-t--global--background--color--primary--default);
-  --pf-v6-c-page__main-wizard--BorderTopColor: var(--pf-t--global--border--color--default);
-  --pf-v6-c-page__main-wizard--BorderTopWidth: var(--pf-t--global--border--width--button--default);
+  --pf-v6-c-page__main-wizard--BorderBlockStartColor: var(--pf-t--global--border--color--default);
+  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: var(--pf-t--global--border--width--button--default);
 }
 @media (min-width: 1200px) {
-  :root {
-    --pf-v6-c-page__header-brand--PaddingLeft: var(--pf-v6-c-page__header-brand--xl--PaddingLeft);
+  :where(:root, .pf-v6-c-page) {
     --pf-v6-c-page--inset: var(--pf-v6-c-page--xl--inset);
   }
 }
 @media screen and (min-width: 1200px) {
-  :root {
-    --pf-v6-c-page__header-nav--BackgroundColor: var(--pf-v6-c-page__header-nav--xl--BackgroundColor);
-    --pf-v6-c-page__header-nav--PaddingRight: var(--pf-v6-c-page__header-nav--xl--PaddingRight);
-    --pf-v6-c-page__header-nav--PaddingLeft: var(--pf-v6-c-page__header-nav--xl--PaddingLeft);
-  }
-}
-@media screen and (min-width: 1200px) {
-  :root {
-    --pf-v6-c-page__header-tools--MarginRight: var(--pf-v6-c-page__header-tools--xl--MarginRight);
-  }
-}
-@media screen and (min-width: 1200px) {
-  :root {
+  :where(:root, .pf-v6-c-page) {
     --pf-v6-c-page__sidebar--TranslateX: var(--pf-v6-c-page__sidebar--xl--TranslateX);
   }
 }
@@ -214,109 +108,11 @@
   }
 }
 
-.pf-v6-c-page__header,
 .pf-v6-c-page > .pf-v6-c-masthead {
-  z-index: var(--pf-v6-c-page__header--ZIndex);
+  z-index: var(--pf-v6-c-page--c-masthead--ZIndex);
   grid-area: header;
 }
 
-.pf-v6-c-page__header {
-  display: grid;
-  grid-template-columns: auto auto;
-  align-items: center;
-  min-width: 0;
-  min-height: var(--pf-v6-c-page__header--MinHeight);
-  background-color: var(--pf-v6-c-page__header--BackgroundColor);
-}
-.pf-v6-c-page__header > * {
-  display: flex;
-  align-items: center;
-}
-@media screen and (min-width: 992px) {
-  .pf-v6-c-page__header {
-    grid-template-columns: auto 1fr auto;
-  }
-}
-.pf-v6-c-page__header .pf-v6-c-masthead {
-  grid-column: span 2;
-  align-self: stretch;
-}
-
-.pf-v6-c-page__header-brand {
-  grid-column: 1/2;
-  padding-inline-start: var(--pf-v6-c-page__header-brand--PaddingLeft);
-}
-@media (min-width: 1200px) {
-  .pf-v6-c-page__header-brand {
-    padding-inline-end: var(--pf-v6-c-page__header-brand--xl--PaddingRight);
-  }
-}
-
-.pf-v6-c-page__header-brand-link {
-  display: flex;
-  flex: 1;
-  align-items: center;
-}
-.pf-v6-c-page__header-brand-link .pf-v6-c-brand {
-  max-height: var(--pf-v6-c-page__header-brand-link--c-brand--MaxHeight);
-}
-
-.pf-v6-c-page__header-brand-toggle .pf-v6-c-button {
-  padding-block-start: var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__header-sidebar-toggle__c-button--PaddingRight);
-  margin-inline-start: var(--pf-v6-c-page__header-sidebar-toggle__c-button--MarginLeft);
-  margin-inline-end: var(--pf-v6-c-page__header-sidebar-toggle__c-button--MarginRight);
-  font-size: var(--pf-v6-c-page__header-sidebar-toggle__c-button--FontSize);
-  line-height: 1;
-}
-
-.pf-v6-c-page__header-nav {
-  grid-row: 2/3;
-  grid-column: 1/-1;
-  align-self: stretch;
-  min-width: 0;
-  padding-inline-start: var(--pf-v6-c-page__header-nav--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__header-nav--PaddingRight);
-  background-color: var(--pf-v6-c-page__header-nav--BackgroundColor);
-}
-@media screen and (min-width: 1200px) {
-  .pf-v6-c-page__header-nav {
-    grid-row: 1/2;
-    grid-column: 2/3;
-  }
-}
-.pf-v6-c-page__header-nav .pf-v6-c-nav {
-  align-self: stretch;
-}
-
-.pf-v6-c-page__header-tools {
-  grid-column: 2/3;
-  margin-inline-start: auto;
-  margin-inline-end: var(--pf-v6-c-page__header-tools--MarginRight);
-}
-.pf-v6-c-page__header-tools .pf-v6-c-avatar {
-  margin-inline-start: var(--pf-v6-c-page__header-tools--c-avatar--MarginLeft);
-}
-@media screen and (min-width: 992px) {
-  .pf-v6-c-page__header-tools {
-    grid-column: 3/4;
-  }
-}
-
-.pf-v6-c-page__header-tools-group {
-  --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-page__header-tools-group--Display);
-  align-items: center;
-}
-.pf-v6-c-page__header-tools-group + .pf-v6-c-page__header-tools-group {
-  margin-inline-start: var(--pf-v6-c-page__header-tools-group--MarginLeft);
-}
-
-.pf-v6-c-page__header-tools-item {
-  --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-page__header-tools-item--Display);
-}
-
 .pf-v6-c-page__sidebar {
   z-index: var(--pf-v6-c-page__sidebar--ZIndex);
   display: flex;
@@ -328,7 +124,7 @@
   padding-block-start: 0;
   padding-block-end: var(--pf-v6-c-page__sidebar--PaddingBlockEnd);
   padding-inline-start: var(--pf-v6-c-page__sidebar--PaddingInlineStart);
-  margin-inline-end: var(--pf-v6-c-page__sidebar--MarginRight);
+  margin-inline-end: var(--pf-v6-c-page__sidebar--MarginInlineEnd);
   overflow-x: hidden;
   overflow-y: auto;
   -webkit-overflow-scrolling: touch;
@@ -355,13 +151,13 @@
 }
 
 .pf-v6-c-page__sidebar-header {
-  padding-block-start: var(--pf-v6-c-page__sidebar-header--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__sidebar-header--PaddingBottom);
-  border-block-end: var(--pf-v6-c-page__sidebar-header--BorderBottomWidth) solid var(--pf-v6-c-page__sidebar-header--BorderBottomColor);
+  padding-block-start: var(--pf-v6-c-page__sidebar-header--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__sidebar-header--PaddingBlockEnd);
+  border-block-end: var(--pf-v6-c-page__sidebar-header--BorderBlockEndWidth) solid var(--pf-v6-c-page__sidebar-header--BorderBlockEndColor);
 }
 
 .pf-v6-c-page__sidebar-title {
-  padding-inline-start: var(--pf-v6-c-page__sidebar-title--PaddingLeft);
+  padding-inline-start: var(--pf-v6-c-page__sidebar-title--PaddingInlineStart);
   font-family: var(--pf-v6-c-page__sidebar-title--FontFamily);
   font-size: var(--pf-v6-c-page__sidebar-title--FontSize);
   font-weight: var(--pf-v6-c-page__sidebar-title--FontWeight);
@@ -369,35 +165,19 @@
 }
 
 .pf-v6-c-page__sidebar-body {
-  padding-inline-start: var(--pf-v6-c-page__sidebar-body--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__sidebar-body--PaddingRight);
+  padding-inline-start: var(--pf-v6-c-page__sidebar-body--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__sidebar-body--PaddingInlineEnd);
 }
 .pf-v6-c-page__sidebar-body:last-child {
   flex-grow: 1;
 }
-.pf-v6-c-page__sidebar-body.pf-m-menu {
-  background-color: var(--pf-v6-c-page__sidebar-body--m-menu--BackgroundColor);
-  border-block-start: var(--pf-v6-c-page__sidebar-body--m-menu--BorderTopWidth) solid var(--pf-v6-c-page__sidebar-body--m-menu--BorderTopColor);
-}
-.pf-v6-c-page__sidebar-body.pf-m-menu + .pf-v6-c-page__sidebar-body.pf-m-menu {
-  --pf-v6-c-page__sidebar-body--m-menu--BorderTopWidth: 0;
-}
-.pf-v6-c-page__sidebar-body.pf-m-menu .pf-v6-c-context-selector {
-  --pf-v6-c-context-selector__toggle--BorderTopColor: transparent;
-  --pf-v6-c-context-selector__toggle--BorderRightColor: transparent;
-  --pf-v6-c-context-selector__toggle--BorderBottomColor: var(--pf-v6-c-page__sidebar-body--m-menu--c-context-selector--BorderBottomColor);
-  --pf-v6-c-context-selector__toggle--BorderLeftColor: transparent;
-  --pf-v6-c-context-selector__menu--Top: 100%;
-  color: var(--pf-v6-global--Color--100);
-  width: 100%;
-}
 .pf-v6-c-page__sidebar-body.pf-m-page-insets {
-  --pf-v6-c-page__sidebar-body--PaddingRight: var(--pf-v6-c-page__sidebar-body--m-page-insets--PaddingRight);
-  --pf-v6-c-page__sidebar-body--PaddingLeft: var(--pf-v6-c-page__sidebar-body--m-page-insets--PaddingLeft);
+  --pf-v6-c-page__sidebar-body--PaddingInlineEnd: var(--pf-v6-c-page__sidebar-body--m-page-insets--PaddingInlineEnd);
+  --pf-v6-c-page__sidebar-body--PaddingInlineStart: var(--pf-v6-c-page__sidebar-body--m-page-insets--PaddingInlineStart);
 }
 .pf-v6-c-page__sidebar-body.pf-m-inset-none {
-  --pf-v6-c-page__sidebar-body--PaddingRight: 0;
-  --pf-v6-c-page__sidebar-body--PaddingLeft: 0;
+  --pf-v6-c-page__sidebar-body--PaddingInlineEnd: 0;
+  --pf-v6-c-page__sidebar-body--PaddingInlineStart: 0;
 }
 .pf-v6-c-page__sidebar-body.pf-m-fill {
   flex-grow: 1;
@@ -634,7 +414,8 @@
 }
 
 .pf-v6-c-page__main-container {
-  align-self: start;
+  display: flex;
+  flex-direction: column;
   max-height: var(--pf-v6-c-page__main-container--MaxHeight);
   margin-block-start: 0;
   margin-inline-start: var(--pf-v6-c-page__main-container--MarginInlineStart);
@@ -667,37 +448,37 @@
 }
 
 .pf-v6-c-page__main-nav {
-  padding-block-start: var(--pf-v6-c-page__main-nav--PaddingTop);
-  padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-nav--PaddingBlockStart);
+  padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
   background-color: var(--pf-v6-c-page__main-nav--BackgroundColor);
 }
 .pf-v6-c-page__main-nav.pf-m-sticky-top, .pf-v6-c-page__main-group.pf-m-sticky-top .pf-v6-c-page__main-nav:last-child {
-  padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBottom);
+  padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
 }
 @media (min-height: 0) {
   .pf-v6-c-page__main-nav.pf-m-sticky-top-on-sm-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-sm-height .pf-v6-c-page__main-nav:last-child {
-    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBottom);
+    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
   }
 }
 @media (min-height: 40rem) {
   .pf-v6-c-page__main-nav.pf-m-sticky-top-on-md-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-md-height .pf-v6-c-page__main-nav:last-child {
-    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBottom);
+    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
   }
 }
 @media (min-height: 48rem) {
   .pf-v6-c-page__main-nav.pf-m-sticky-top-on-lg-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-lg-height .pf-v6-c-page__main-nav:last-child {
-    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBottom);
+    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
   }
 }
 @media (min-height: 60rem) {
   .pf-v6-c-page__main-nav.pf-m-sticky-top-on-xl-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-xl-height .pf-v6-c-page__main-nav:last-child {
-    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBottom);
+    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
   }
 }
 @media (min-height: 80rem) {
   .pf-v6-c-page__main-nav.pf-m-sticky-top-on-2xl-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-2xl-height .pf-v6-c-page__main-nav:last-child {
-    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBottom);
+    padding-block-end: var(--pf-v6-c-page__main-nav--m-sticky-top--PaddingBlockEnd);
   }
 }
 
@@ -710,56 +491,56 @@
 }
 
 .pf-v6-c-page__main-breadcrumb {
-  padding-block-start: var(--pf-v6-c-page__main-breadcrumb--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__main-breadcrumb--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__main-breadcrumb--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-breadcrumb--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineEnd);
   background-color: var(--pf-v6-c-page__main-breadcrumb--BackgroundColor);
 }
 .pf-v6-c-page__main-breadcrumb + .pf-v6-c-page__main-section {
-  --pf-v6-c-page__main-section--PaddingTop: var(--pf-v6-c-page__main-breadcrumb--main-section--PaddingTop);
+  --pf-v6-c-page__main-section--PaddingBlockStart: var(--pf-v6-c-page__main-breadcrumb--main-section--PaddingBlockStart);
 }
 .pf-v6-c-page__main-breadcrumb.pf-m-sticky-top, .pf-v6-c-page__main-group.pf-m-sticky-top .pf-v6-c-page__main-breadcrumb:last-child {
-  --pf-v6-c-page__main-breadcrumb--PaddingBottom: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
+  --pf-v6-c-page__main-breadcrumb--PaddingBlockEnd: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBlockEnd);
 }
 @media (min-height: 0) {
   .pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-sm-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-sm-height .pf-v6-c-page__main-breadcrumb:last-child {
-    --pf-v6-c-page__main-breadcrumb--PaddingBottom: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
+    --pf-v6-c-page__main-breadcrumb--PaddingBlockEnd: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBlockEnd);
   }
 }
 @media (min-height: 40rem) {
   .pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-md-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-md-height .pf-v6-c-page__main-breadcrumb:last-child {
-    --pf-v6-c-page__main-breadcrumb--PaddingBottom: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
+    --pf-v6-c-page__main-breadcrumb--PaddingBlockEnd: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBlockEnd);
   }
 }
 @media (min-height: 48rem) {
   .pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-lg-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-lg-height .pf-v6-c-page__main-breadcrumb:last-child {
-    --pf-v6-c-page__main-breadcrumb--PaddingBottom: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
+    --pf-v6-c-page__main-breadcrumb--PaddingBlockEnd: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBlockEnd);
   }
 }
 @media (min-height: 60rem) {
   .pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-xl-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-xl-height .pf-v6-c-page__main-breadcrumb:last-child {
-    --pf-v6-c-page__main-breadcrumb--PaddingBottom: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
+    --pf-v6-c-page__main-breadcrumb--PaddingBlockEnd: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBlockEnd);
   }
 }
 @media (min-height: 80rem) {
   .pf-v6-c-page__main-breadcrumb.pf-m-sticky-top-on-2xl-height, .pf-v6-c-page__main-group.pf-m-sticky-top-on-2xl-height .pf-v6-c-page__main-breadcrumb:last-child {
-    --pf-v6-c-page__main-breadcrumb--PaddingBottom: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
+    --pf-v6-c-page__main-breadcrumb--PaddingBlockEnd: var(--pf-v6-c-page__main-breadcrumb--m-sticky-top--PaddingBlockEnd);
   }
 }
 
 .pf-v6-c-page__main-tabs {
-  padding-block-start: var(--pf-v6-c-page__main-tabs--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__main-tabs--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__main-tabs--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-tabs--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__main-tabs--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-page__main-tabs--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingInlineEnd);
   background-color: var(--pf-v6-c-page__main-tabs--BackgroundColor);
 }
 .pf-v6-c-page__main-nav + .pf-v6-c-page__main-tabs {
-  --pf-v6-c-page__main-tabs--PaddingTop: var(--pf-v6-c-page__main-nav--page__main-tabs--PaddingTop);
+  --pf-v6-c-page__main-tabs--PaddingBlockStart: var(--pf-v6-c-page__main-nav--page__main-tabs--PaddingBlockStart);
 }
 .pf-v6-c-page__main-breadcrumb + .pf-v6-c-page__main-tabs {
-  --pf-v6-c-page__main-tabs--PaddingTop: var(--pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingTop);
+  --pf-v6-c-page__main-tabs--PaddingBlockStart: var(--pf-v6-c-page__main-breadcrumb--page__main-tabs--PaddingBlockStart);
 }
 
 .pf-v6-c-page__main-section:last-child, .pf-v6-c-page__main-section:only-child, .pf-v6-c-page__main-section.pf-m-fill,
@@ -778,48 +559,48 @@
 }
 
 .pf-v6-c-page__main-section {
-  padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   background-color: var(--pf-v6-c-page__main-section--BackgroundColor);
 }
 .pf-v6-c-page__main-section.pf-m-secondary {
   --pf-v6-c-page__main-section--BackgroundColor: var(--pf-v6-c-page__main-section--m-secondary--BackgroundColor);
 }
 .pf-v6-c-page__main-section.pf-m-padding {
-  padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
 }
 .pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width {
   padding: 0;
 }
 .pf-v6-c-page__main-section.pf-m-padding.pf-m-limit-width .pf-v6-c-page__main-body {
-  padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
 }
 .pf-v6-c-page__main-section.pf-m-no-padding, .pf-v6-c-page__main-section.pf-m-no-padding.pf-m-limit-width .pf-v6-c-page__main-body {
   padding: 0;
 }
 @media (min-width: 576px) {
   .pf-v6-c-page__main-section.pf-m-padding-on-sm {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width {
     padding: 0;
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-no-padding-on-sm, .pf-v6-c-page__main-section.pf-m-no-padding-on-sm.pf-m-limit-width .pf-v6-c-page__main-body {
     padding: 0;
@@ -827,19 +608,19 @@
 }
 @media (min-width: 768px) {
   .pf-v6-c-page__main-section.pf-m-padding-on-md {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width {
     padding: 0;
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-no-padding-on-md, .pf-v6-c-page__main-section.pf-m-no-padding-on-md.pf-m-limit-width .pf-v6-c-page__main-body {
     padding: 0;
@@ -847,19 +628,19 @@
 }
 @media (min-width: 992px) {
   .pf-v6-c-page__main-section.pf-m-padding-on-lg {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width {
     padding: 0;
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-no-padding-on-lg, .pf-v6-c-page__main-section.pf-m-no-padding-on-lg.pf-m-limit-width .pf-v6-c-page__main-body {
     padding: 0;
@@ -867,19 +648,19 @@
 }
 @media (min-width: 1200px) {
   .pf-v6-c-page__main-section.pf-m-padding-on-xl {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width {
     padding: 0;
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-no-padding-on-xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-xl.pf-m-limit-width .pf-v6-c-page__main-body {
     padding: 0;
@@ -887,19 +668,19 @@
 }
 @media (min-width: 1450px) {
   .pf-v6-c-page__main-section.pf-m-padding-on-2xl {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width {
     padding: 0;
   }
   .pf-v6-c-page__main-section.pf-m-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
-    padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+    padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+    padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+    padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+    padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
   }
   .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl, .pf-v6-c-page__main-section.pf-m-no-padding-on-2xl.pf-m-limit-width .pf-v6-c-page__main-body {
     padding: 0;
@@ -910,10 +691,10 @@
   flex: 1 1;
   min-height: 0;
   background-color: var(--pf-v6-c-page__main-wizard--BackgroundColor);
-  border-block-start: var(--pf-v6-c-page__main-wizard--BorderTopWidth) solid var(--pf-v6-c-page__main-wizard--BorderTopColor);
+  border-block-start: var(--pf-v6-c-page__main-wizard--BorderBlockStartWidth) solid var(--pf-v6-c-page__main-wizard--BorderBlockStartColor);
 }
 .pf-v6-c-page__main-wizard:first-child {
-  --pf-v6-c-page__main-wizard--BorderTopWidth: 0;
+  --pf-v6-c-page__main-wizard--BorderBlockStartWidth: 0;
 }
 
 .pf-v6-c-page__main-wizard .pf-v6-c-page__main-body {
@@ -925,27 +706,27 @@
 }
 
 .pf-v6-c-page__main-nav .pf-v6-c-page__main-body {
-  padding-block-start: var(--pf-v6-c-page__main-nav--PaddingTop);
-  padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-nav--PaddingBlockStart);
+  padding-inline-start: var(--pf-v6-c-page__main-nav--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-nav--PaddingInlineEnd);
 }
 .pf-v6-c-page__main-breadcrumb .pf-v6-c-page__main-body {
-  padding-block-start: var(--pf-v6-c-page__main-breadcrumb--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__main-breadcrumb--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__main-breadcrumb--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-breadcrumb--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__main-breadcrumb--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-breadcrumb--PaddingInlineEnd);
 }
 .pf-v6-c-page__main-section .pf-v6-c-page__main-body {
-  padding-block-start: var(--pf-v6-c-page__main-section--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__main-section--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-section--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-section--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__main-section--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-page__main-section--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-section--PaddingInlineEnd);
 }
 .pf-v6-c-page__main-tabs .pf-v6-c-page__main-body {
-  padding-block-start: var(--pf-v6-c-page__main-tabs--PaddingTop);
-  padding-block-end: var(--pf-v6-c-page__main-tabs--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-page__main-tabs--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingRight);
+  padding-block-start: var(--pf-v6-c-page__main-tabs--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-page__main-tabs--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-page__main-tabs--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-page__main-tabs--PaddingInlineEnd);
 }
 
 .pf-v6-c-page__drawer {