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

package/css/components/ModalBox/modal-box.css

@@ -1,4 +1,4 @@
-:root {
+:where(:root, .pf-v6-c-modal-box) {
   --pf-v6-c-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
   --pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--large);
   --pf-v6-c-modal-box--BoxShadow: var(--pf-t--global--box-shadow--lg);
@@ -11,7 +11,7 @@
   --pf-v6-c-modal-box--MaxHeight: calc(100% - var(--pf-t--global--spacer--2xl));
   --pf-v6-c-modal-box--m-align-top--spacer: var(--pf-t--global--spacer--sm);
   --pf-v6-c-modal-box--m-align-top--xl--spacer: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-modal-box--m-align-top--Top: var(--pf-v6-c-modal-box--m-align-top--spacer);
+  --pf-v6-c-modal-box--m-align-top--InsetBlockStart: var(--pf-v6-c-modal-box--m-align-top--spacer);
   --pf-v6-c-modal-box--m-align-top--MaxHeight: calc(100% - min(var(--pf-v6-c-modal-box--m-align-top--spacer), var(--pf-t--global--spacer--2xl)) - var(--pf-v6-c-modal-box--m-align-top--spacer));
   --pf-v6-c-modal-box--m-align-top--MaxWidth: calc(100% - min(var(--pf-v6-c-modal-box--m-align-top--spacer) * 2, var(--pf-t--global--spacer--xl)));
   --pf-v6-c-modal-box--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
@@ -19,36 +19,36 @@
   --pf-v6-c-modal-box--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
   --pf-v6-c-modal-box--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
   --pf-v6-c-modal-box--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
-  --pf-v6-c-modal-box__header--PaddingTop: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__header--PaddingRight: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__header--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__header--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-modal-box__header--Gap: var(--pf-t--global--spacer--md);
   --pf-v6-c-modal-box__header-main--Gap: var(--pf-t--global--spacer--md);
   --pf-v6-c-modal-box__title--LineHeight: var(--pf-t--global--font--line-height--heading);
   --pf-v6-c-modal-box__title--FontFamily: var(--pf-t--global--font--family--heading);
   --pf-v6-c-modal-box__title--FontSize: var(--pf-t--global--font--size--heading--md);
-  --pf-v6-c-modal-box__title-icon--MarginRight: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-modal-box__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-modal-box__title-icon--Color: var(--pf-t--global--icon--color--regular);
   --pf-v6-c-modal-box__description--FontSize: var(--pf-t--global--font--size--body--sm);
   --pf-v6-c-modal-box__description--Color: var(--pf-t--global--text--color--subtle);
   --pf-v6-c-modal-box__body--MinHeight: calc(var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body));
-  --pf-v6-c-modal-box__body--PaddingTop: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__body--PaddingRight: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__body--PaddingLeft: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__body--last-child--PaddingBottom: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__header--body--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-modal-box__close--Top: var(--pf-v6-c-modal-box__header--PaddingTop);
-  --pf-v6-c-modal-box__close--Right: var(--pf-v6-c-modal-box__header--PaddingRight);
-  --pf-v6-c-modal-box__close--sibling--MarginRight: calc(var(--pf-t--global--spacer--xl) + var(--pf-t--global--spacer--sm));
-  --pf-v6-c-modal-box__footer--PaddingTop: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__footer--PaddingRight: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__footer--PaddingBottom: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__footer--PaddingLeft: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-modal-box__footer--c-button--MarginRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-modal-box__footer--c-button--sm--MarginRight: calc(var(--pf-v6-c-modal-box__footer--c-button--MarginRight) / 2);
+  --pf-v6-c-modal-box__body--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__body--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__body--PaddingInlineStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__body--last-child--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__header--body--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-modal-box__close--InsetBlockStart: var(--pf-v6-c-modal-box__header--PaddingBlockStart);
+  --pf-v6-c-modal-box__close--InsetInlineEnd: var(--pf-v6-c-modal-box__header--PaddingInlineEnd);
+  --pf-v6-c-modal-box__close--sibling--MarginInlineEnd: calc(var(--pf-t--global--spacer--xl) + var(--pf-t--global--spacer--sm));
+  --pf-v6-c-modal-box__footer--PaddingBlockStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__footer--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__footer--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__footer--PaddingInlineStart: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__footer--c-button--MarginInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-modal-box__footer--c-button--sm--MarginInlineEnd: calc(var(--pf-v6-c-modal-box__footer--c-button--MarginInlineEnd) / 2);
 }
 @media (min-width: 1200px) {
-  :root {
+  :where(:root, .pf-v6-c-modal-box) {
     --pf-v6-c-modal-box--m-align-top--spacer: var(--pf-v6-c-modal-box--m-align-top--xl--spacer);
   }
 }
@@ -76,7 +76,7 @@
   --pf-v6-c-modal-box--Width: var(--pf-v6-c-modal-box--m-lg--lg--MaxWidth);
 }
 .pf-v6-c-modal-box.pf-m-align-top {
-  inset-block-start: var(--pf-v6-c-modal-box--m-align-top--Top);
+  inset-block-start: var(--pf-v6-c-modal-box--m-align-top--InsetBlockStart);
   align-self: flex-start;
   max-width: var(--pf-v6-c-modal-box--m-align-top--MaxWidth);
   max-height: var(--pf-v6-c-modal-box--m-align-top--MaxHeight);
@@ -103,11 +103,11 @@
 
 .pf-v6-c-modal-box__close {
   position: absolute;
-  inset-block-start: var(--pf-v6-c-modal-box__close--Top);
-  inset-inline-end: var(--pf-v6-c-modal-box__close--Right);
+  inset-block-start: var(--pf-v6-c-modal-box__close--InsetBlockStart);
+  inset-inline-end: var(--pf-v6-c-modal-box__close--InsetInlineEnd);
 }
 .pf-v6-c-modal-box__close + * {
-  margin-inline-end: var(--pf-v6-c-modal-box__close--sibling--MarginRight);
+  margin-inline-end: var(--pf-v6-c-modal-box__close--sibling--MarginInlineEnd);
 }
 
 .pf-v6-c-modal-box__header {
@@ -115,16 +115,16 @@
   flex-direction: column;
   flex-shrink: 0;
   gap: var(--pf-v6-c-modal-box__header--Gap);
-  padding-block-start: var(--pf-v6-c-modal-box__header--PaddingTop);
-  padding-inline-start: var(--pf-v6-c-modal-box__header--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-modal-box__header--PaddingRight);
+  padding-block-start: var(--pf-v6-c-modal-box__header--PaddingBlockStart);
+  padding-inline-start: var(--pf-v6-c-modal-box__header--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-modal-box__header--PaddingInlineEnd);
 }
 .pf-v6-c-modal-box__header.pf-m-help {
   display: flex;
   flex-direction: row;
 }
 .pf-v6-c-modal-box__header + .pf-v6-c-modal-box__body {
-  --pf-v6-c-modal-box__body--PaddingTop: var(--pf-v6-c-modal-box__header--body--PaddingTop);
+  --pf-v6-c-modal-box__body--PaddingBlockStart: var(--pf-v6-c-modal-box__header--body--PaddingBlockStart);
 }
 
 .pf-v6-c-modal-box__header-main {
@@ -153,12 +153,12 @@
 }
 
 .pf-v6-c-modal-box__title-icon {
-  margin-inline-end: var(--pf-v6-c-modal-box__title-icon--MarginRight);
+  margin-inline-end: var(--pf-v6-c-modal-box__title-icon--MarginInlineEnd);
   color: var(--pf-v6-c-modal-box__title-icon--Color);
 }
 
 .pf-v6-c-modal-box__description {
-  padding-block-start: var(--pf-v6-c-modal-box__description--PaddingTop);
+  padding-block-start: var(--pf-v6-c-modal-box__description--PaddingBlockStart);
   font-size: var(--pf-v6-c-modal-box__description--FontSize);
   color: var(--pf-v6-c-modal-box__description--Color);
 }
@@ -166,9 +166,9 @@
 .pf-v6-c-modal-box__body {
   flex: 1 1 auto;
   min-height: var(--pf-v6-c-modal-box__body--MinHeight);
-  padding-block-start: var(--pf-v6-c-modal-box__body--PaddingTop);
-  padding-inline-start: var(--pf-v6-c-modal-box__body--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-modal-box__body--PaddingRight);
+  padding-block-start: var(--pf-v6-c-modal-box__body--PaddingBlockStart);
+  padding-inline-start: var(--pf-v6-c-modal-box__body--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-modal-box__body--PaddingInlineEnd);
   overflow-x: hidden;
   overflow-y: auto;
   overscroll-behavior: contain;
@@ -176,23 +176,23 @@
   -webkit-overflow-scrolling: touch;
 }
 .pf-v6-c-modal-box__body:last-child {
-  padding-block-end: var(--pf-v6-c-modal-box__body--last-child--PaddingBottom);
+  padding-block-end: var(--pf-v6-c-modal-box__body--last-child--PaddingBlockEnd);
 }
 
 .pf-v6-c-modal-box__footer {
   display: flex;
   flex: 0 0 auto;
   align-items: center;
-  padding-block-start: var(--pf-v6-c-modal-box__footer--PaddingTop);
-  padding-block-end: var(--pf-v6-c-modal-box__footer--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-modal-box__footer--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-modal-box__footer--PaddingRight);
+  padding-block-start: var(--pf-v6-c-modal-box__footer--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-modal-box__footer--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-modal-box__footer--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-modal-box__footer--PaddingInlineEnd);
 }
 .pf-v6-c-modal-box__footer > .pf-v6-c-button:not(:last-child) {
-  margin-inline-end: var(--pf-v6-c-modal-box__footer--c-button--MarginRight);
+  margin-inline-end: var(--pf-v6-c-modal-box__footer--c-button--MarginInlineEnd);
 }
 @media screen and (min-width: 576px) {
   .pf-v6-c-modal-box__footer > .pf-v6-c-button:not(:last-child) {
-    --pf-v6-c-modal-box__footer--c-button--MarginRight: var(--pf-v6-c-modal-box__footer--c-button--sm--MarginRight);
+    --pf-v6-c-modal-box__footer--c-button--MarginInlineEnd: var(--pf-v6-c-modal-box__footer--c-button--sm--MarginInlineEnd);
   }
 }

package/css/components/MultipleFileUpload/multiple-file-upload.css

@@ -1,5 +1,4 @@
-:root,
-:where(.pf-v6-c-multiple-file-upload) {
+:where(:root, .pf-v6-c-multiple-file-upload) {
   --pf-v6-c-multiple-file-upload--GridTemplateColumns: 1fr;
   --pf-v6-c-multiple-file-upload--Gap: var(--pf-t--global--spacer--md);
   --pf-v6-c-multiple-file-upload__main--TextAlign: center;
@@ -9,10 +8,10 @@
     "title"
     "upload"
     "info";
-  --pf-v6-c-multiple-file-upload__main--PaddingTop: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-multiple-file-upload__main--PaddingRight: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-multiple-file-upload__main--PaddingBottom: var(--pf-t--global--spacer--xl);
-  --pf-v6-c-multiple-file-upload__main--PaddingLeft: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-multiple-file-upload__main--PaddingBlockStart: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-multiple-file-upload__main--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-multiple-file-upload__main--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-multiple-file-upload__main--PaddingInlineStart: var(--pf-t--global--spacer--xl);
   --pf-v6-c-multiple-file-upload__main--BorderWidth: var(--pf-t--global--border--width--regular);
   --pf-v6-c-multiple-file-upload__main--BorderStyle: dashed;
   --pf-v6-c-multiple-file-upload__main--BorderColor: var(--pf-t--global--border--color--default);
@@ -27,15 +26,15 @@
   --pf-v6-c-multiple-file-upload__title-icon--Color: var(--pf-t--global--icon--color--regular);
   --pf-v6-c-multiple-file-upload__title-icon--FontSize: var(--pf-t--global--icon--size--xl);
   --pf-v6-c-multiple-file-upload__title-text-separator--Display: block;
-  --pf-v6-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-multiple-file-upload__title-text-separator--MarginBottom: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-multiple-file-upload__title-text-separator--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-t--global--font--family--body);
   --pf-v6-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-t--global--font--size--body--lg);
   --pf-v6-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-t--global--font--weight--body);
   --pf-v6-c-multiple-file-upload__info--FontSize: var(--pf-t--global--font--size--body--default);
   --pf-v6-c-multiple-file-upload__info--Color: var(--pf-t--global--text--color--subtle);
-  --pf-v6-c-multiple-file-upload__info--MarginTop: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-multiple-file-upload__info--MarginBlockStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-multiple-file-upload--m-drag-over__main--BorderStyle: dashed;
   --pf-v6-c-multiple-file-upload--m-drag-over__main--BorderColor: var(--pf-t--global--border--color--clicked);
   --pf-v6-c-multiple-file-upload--m-horizontal--GridTemplateColumns: fit-content(100%);
@@ -45,26 +44,26 @@
     "title upload"
     "info upload";
   --pf-v6-c-multiple-file-upload--m-horizontal__main--Gap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--lg);
-  --pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBottom: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
   --pf-v6-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns: auto 1fr;
   --pf-v6-c-multiple-file-upload--m-horizontal__title--Gap: var(--pf-t--global--spacer--sm);
   --pf-v6-c-multiple-file-upload--m-horizontal__title-icon--FontSize: var(--pf-t--global--font--size--heading--xs);
   --pf-v6-c-multiple-file-upload--m-horizontal__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
   --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--Display: inline;
-  --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop: 0;
+  --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginBlockStart: 0;
   --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily: var(--pf-t--global--font--family--heading);
   --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize: var(--pf-t--global--font--size--heading--xs);
   --pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight: var(--pf-t--global--font--weight--heading);
-  --pf-v6-c-multiple-file-upload--m-horizontal__info--MarginTop: 0;
-  --pf-v6-c-multiple-file-upload__status--PaddingTop: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-multiple-file-upload__status--PaddingBottom: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-multiple-file-upload__status--PaddingLeft: var(--pf-t--global--spacer--md);
-  --pf-v6-c-multiple-file-upload__status--PaddingRight: var(--pf-t--global--spacer--md);
+  --pf-v6-c-multiple-file-upload--m-horizontal__info--MarginBlockStart: 0;
+  --pf-v6-c-multiple-file-upload__status--PaddingBlockStart: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-multiple-file-upload__status--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-multiple-file-upload__status--PaddingInlineStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-multiple-file-upload__status--PaddingInlineEnd: var(--pf-t--global--spacer--md);
   --pf-v6-c-multiple-file-upload__status-progress--GridTemplateColumns: auto 1fr;
   --pf-v6-c-multiple-file-upload__status-progress--Gap: var(--pf-t--global--spacer--sm);
   --pf-v6-c-multiple-file-upload__status-progress-icon--Color: var(--pf-t--global--icon--color--regular);
-  --pf-v6-c-multiple-file-upload__status-item--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-multiple-file-upload__status-item--PaddingBottom: var(--pf-t--global--spacer--md);
+  --pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd: var(--pf-t--global--spacer--md);
   --pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns: auto 1fr auto;
   --pf-v6-c-multiple-file-upload__status-item--Gap: var(--pf-t--global--spacer--sm);
   --pf-v6-c-multiple-file-upload__status-item--BorderWidth: var(--pf-t--global--border--width--regular);
@@ -87,17 +86,17 @@
   --pf-v6-c-multiple-file-upload__main--GridTemplateColumns: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateColumns);
   --pf-v6-c-multiple-file-upload__main--GridTemplateAreas: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--GridTemplateAreas);
   --pf-v6-c-multiple-file-upload__main--Gap: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--Gap);
-  --pf-v6-c-multiple-file-upload__main--PaddingBottom: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBottom);
+  --pf-v6-c-multiple-file-upload__main--PaddingBlockEnd: var(--pf-v6-c-multiple-file-upload--m-horizontal__main--PaddingBlockEnd);
   --pf-v6-c-multiple-file-upload__title--GridTemplateColumns: var(--pf-v6-c-multiple-file-upload--m-horizontal__title--GridTemplateColumns);
   --pf-v6-c-multiple-file-upload__title--Gap: var(--pf-v6-c-multiple-file-upload--m-horizontal__title--Gap);
   --pf-v6-c-multiple-file-upload__title-icon--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-icon--FontSize);
   --pf-v6-c-multiple-file-upload__title-text--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text--FontSize);
   --pf-v6-c-multiple-file-upload__title-text-separator--FontFamily: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontFamily);
   --pf-v6-c-multiple-file-upload__title-text-separator--Display: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--Display);
-  --pf-v6-c-multiple-file-upload__title-text-separator--MarginTop: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginTop);
+  --pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--MarginBlockStart);
   --pf-v6-c-multiple-file-upload__title-text-separator--FontSize: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontSize);
   --pf-v6-c-multiple-file-upload__title-text-separator--FontWeight: var(--pf-v6-c-multiple-file-upload--m-horizontal__title-text-separator--FontWeight);
-  --pf-v6-c-multiple-file-upload__info--MarginTop: var(--pf-v6-c-multiple-file-upload--m-horizontal__info--MarginTop);
+  --pf-v6-c-multiple-file-upload__info--MarginBlockStart: var(--pf-v6-c-multiple-file-upload--m-horizontal__info--MarginBlockStart);
 }
 .pf-v6-c-multiple-file-upload.pf-m-drag-over {
   --pf-v6-c-multiple-file-upload__main--BorderStyle: var(--pf-v6-c-multiple-file-upload--m-drag-over__main--BorderStyle);
@@ -111,10 +110,10 @@
   grid-template-columns: var(--pf-v6-c-multiple-file-upload__main--GridTemplateColumns);
   gap: var(--pf-v6-c-multiple-file-upload__main--Gap);
   align-items: center;
-  padding-block-start: var(--pf-v6-c-multiple-file-upload__main--PaddingTop);
-  padding-block-end: var(--pf-v6-c-multiple-file-upload__main--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-multiple-file-upload__main--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-multiple-file-upload__main--PaddingRight);
+  padding-block-start: var(--pf-v6-c-multiple-file-upload__main--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-multiple-file-upload__main--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-multiple-file-upload__main--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-multiple-file-upload__main--PaddingInlineEnd);
   text-align: var(--pf-v6-c-multiple-file-upload__main--TextAlign);
   border: var(--pf-v6-c-multiple-file-upload__main--BorderWidth) var(--pf-v6-c-multiple-file-upload__main--BorderStyle) var(--pf-v6-c-multiple-file-upload__main--BorderColor);
   border-radius: var(--pf-v6-c-multiple-file-upload__main--BorderRadius);
@@ -141,8 +140,8 @@
 
 .pf-v6-c-multiple-file-upload__title-text-separator {
   display: var(--pf-v6-c-multiple-file-upload__title-text-separator--Display);
-  margin-block-start: var(--pf-v6-c-multiple-file-upload__title-text-separator--MarginTop);
-  margin-block-end: var(--pf-v6-c-multiple-file-upload__title-text-separator--MarginBottom);
+  margin-block-start: var(--pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockStart);
+  margin-block-end: var(--pf-v6-c-multiple-file-upload__title-text-separator--MarginBlockEnd);
   font-family: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontFamily);
   font-size: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontSize);
   font-weight: var(--pf-v6-c-multiple-file-upload__title-text-separator--FontWeight);
@@ -155,16 +154,16 @@
 
 .pf-v6-c-multiple-file-upload__info {
   grid-area: info;
-  margin-block-start: var(--pf-v6-c-multiple-file-upload__info--MarginTop);
+  margin-block-start: var(--pf-v6-c-multiple-file-upload__info--MarginBlockStart);
   font-size: var(--pf-v6-c-multiple-file-upload__info--FontSize);
   color: var(--pf-v6-c-multiple-file-upload__info--Color);
 }
 
 .pf-v6-c-multiple-file-upload__status {
-  padding-block-start: var(--pf-v6-c-multiple-file-upload__status--PaddingTop);
-  padding-block-end: var(--pf-v6-c-multiple-file-upload__status--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-multiple-file-upload__status--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-multiple-file-upload__status--PaddingRight);
+  padding-block-start: var(--pf-v6-c-multiple-file-upload__status--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-multiple-file-upload__status--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-multiple-file-upload__status--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-multiple-file-upload__status--PaddingInlineEnd);
 }
 
 .pf-v6-c-multiple-file-upload__status,
@@ -186,8 +185,8 @@
   display: grid;
   grid-template-columns: var(--pf-v6-c-multiple-file-upload__status-item--GridTemplateColumns);
   gap: var(--pf-v6-c-multiple-file-upload__status-item--Gap);
-  padding-block-start: var(--pf-v6-c-multiple-file-upload__status-item--PaddingTop);
-  padding-block-end: var(--pf-v6-c-multiple-file-upload__status-item--PaddingBottom);
+  padding-block-start: var(--pf-v6-c-multiple-file-upload__status-item--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-multiple-file-upload__status-item--PaddingBlockEnd);
   border-block-end: var(--pf-v6-c-multiple-file-upload__status-item--BorderWidth) solid var(--pf-v6-c-multiple-file-upload__status-item--BorderColor);
 }
 

package/css/components/Nav/nav.css

@@ -1,5 +1,4 @@
-:where(:root),
-:where(.pf-v6-c-nav) {
+:where(:root, .pf-v6-c-nav) {
   --pf-v6-c-nav__link--PaddingBlockStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-nav__link--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-nav__link--PaddingInlineStart: var(--pf-t--global--spacer--md);

package/css/components/NotificationBadge/notification-badge.css

@@ -1,15 +1,15 @@
-:root {
+:where(:root, .pf-v6-c-notification-badge) {
   --pf-v6-c-notification-badge--BackgroundColor: transparent;
   --pf-v6-c-notification-badge--MinWidth: 40px;
   --pf-v6-c-notification-badge--Gap: var(--pf-t--global--spacer--xs);
-  --pf-v6-c-notification-badge--PaddingTop: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-notification-badge--PaddingRight: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-notification-badge--PaddingBottom: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-notification-badge--PaddingLeft: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-notification-badge--MarginTop: calc(-1 * var(--pf-t--global--spacer--sm));
-  --pf-v6-c-notification-badge--MarginRight: calc(-1 * var(--pf-t--global--spacer--sm));
-  --pf-v6-c-notification-badge--MarginBottom: calc(-1 * var(--pf-t--global--spacer--sm));
-  --pf-v6-c-notification-badge--MarginLeft: calc(-1 * var(--pf-t--global--spacer--sm));
+  --pf-v6-c-notification-badge--PaddingBlockStart: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-notification-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-notification-badge--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-notification-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-notification-badge--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--sm));
+  --pf-v6-c-notification-badge--MarginInlineEnd: calc(-1 * var(--pf-t--global--spacer--sm));
+  --pf-v6-c-notification-badge--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--sm));
+  --pf-v6-c-notification-badge--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--sm));
   --pf-v6-c-notification-badge--before--BorderColor: transparent;
   --pf-v6-c-notification-badge--BorderRadius: var(--pf-t--global--border--radius--small);
   --pf-v6-c-notification-badge--before--BorderWidth: var(--pf-t--global--border--width--control--default);
@@ -35,14 +35,14 @@
   gap: var(--pf-v6-c-notification-badge--Gap);
   align-items: center;
   justify-content: center;
-  padding-block-start: var(--pf-v6-c-notification-badge--PaddingTop);
-  padding-block-end: var(--pf-v6-c-notification-badge--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-notification-badge--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-notification-badge--PaddingRight);
-  margin-block-start: var(--pf-v6-c-notification-badge--MarginTop);
-  margin-block-end: var(--pf-v6-c-notification-badge--MarginBottom);
-  margin-inline-start: var(--pf-v6-c-notification-badge--MarginLeft);
-  margin-inline-end: var(--pf-v6-c-notification-badge--MarginRight);
+  padding-block-start: var(--pf-v6-c-notification-badge--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-notification-badge--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-notification-badge--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-notification-badge--PaddingInlineEnd);
+  margin-block-start: var(--pf-v6-c-notification-badge--MarginBlockStart);
+  margin-block-end: var(--pf-v6-c-notification-badge--MarginBlockEnd);
+  margin-inline-start: var(--pf-v6-c-notification-badge--MarginInlineStart);
+  margin-inline-end: var(--pf-v6-c-notification-badge--MarginInlineEnd);
   background-color: var(--pf-v6-c-notification-badge--BackgroundColor);
   border-radius: var(--pf-v6-c-notification-badge--BorderRadius);
 }

package/css/components/NotificationDrawer/notification-drawer.css

@@ -1,17 +1,16 @@
-:root,
-.pf-v6-c-notification-drawer {
+:where(:root, .pf-v6-c-notification-drawer) {
   --pf-v6-c-notification-drawer--BackgroundColor: var(--pf-t--global--background--color--floating--default);
-  --pf-v6-c-notification-drawer__header--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__header--PaddingRight: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-notification-drawer__header--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__header--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-notification-drawer__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-notification-drawer__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-notification-drawer__header--BackgroundColor: var(--pf-t--global--background--color--floating--default);
   --pf-v6-c-notification-drawer__header--ZIndex: var(--pf-t--global--z-index--sm);
   --pf-v6-c-notification-drawer__header-title--FontSize: var(--pf-t--global--font--size--heading--md);
   --pf-v6-c-notification-drawer__header-title--FontWeight: var(--pf-t--global--font--weight--heading--bold);
   --pf-v6-c-notification-drawer__header-title--LineHeight: var(--pf-t--global--font--line-height--heading);
   --pf-v6-c-notification-drawer__header-title--FontFamily: var(--pf-t--global--font--family--heading);
-  --pf-v6-c-notification-drawer__header-status--MarginLeft: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__header-status--MarginInlineStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-notification-drawer__header-status--FontWeight: var(--pf-t--global--font--weight--body--bold);
   --pf-v6-c-notification-drawer__header-status--FontSize: var(--pf-t--global--font--size--body--default);
   --pf-v6-c-notification-drawer__header-status--Color: var(--pf-t--global--text--color--subtle);
@@ -21,10 +20,10 @@
   --pf-v6-c-notification-drawer__list--Gap: var(--pf-t--global--spacer--sm);
   --pf-v6-c-notification-drawer__list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-notification-drawer__list--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-notification-drawer__list-item--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__list-item--PaddingRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__list-item--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__list-item--PaddingLeft: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__list-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__list-item--PaddingInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__list-item--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__list-item--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-notification-drawer__list-item--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --pf-v6-c-notification-drawer__list-item--BorderWidth: var(--pf-t--global--border--width--box--status--default);
   --pf-v6-c-notification-drawer__list-item--BorderRadius: var(--pf-t--global--border--radius--medium);
@@ -42,32 +41,32 @@
   --pf-v6-c-notification-drawer__list-item--m-read--BorderWidth: var(--pf-t--global--border--width--box--status--read);
   --pf-v6-c-notification-drawer__list-item--m-read--BorderColor: var(--pf-t--global--border--color--default);
   --pf-v6-c-notification-drawer__list-item--m-hoverable--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
-  --pf-v6-c-notification-drawer__list-item-header--MarginBottom: var(--pf-t--global--spacer--xs);
+  --pf-v6-c-notification-drawer__list-item-header--MarginBlockEnd: var(--pf-t--global--spacer--xs);
   --pf-v6-c-notification-drawer__list-item-header-icon--Color: inherit;
-  --pf-v6-c-notification-drawer__list-item-header-icon--MarginRight: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-notification-drawer__list-item-header-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-notification-drawer__list-item-header-title--FontFamily: var(--pf-t--global--font--family--heading);
   --pf-v6-c-notification-drawer__list-item-header-title--FontSize: var(--pf-t--global--font--size--heading--xs);
   --pf-v6-c-notification-drawer__list-item-header-title--FontWeight: var(--pf-t--global--font--weight--heading--bold);
   --pf-v6-c-notification-drawer__list-item-header-title--LineHeight: var(--pf-t--global--font--line-height--heading);
   --pf-v6-c-notification-drawer__list-item-header-title--max-lines: 1;
-  --pf-v6-c-notification-drawer__list-item-description--MarginBottom: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-notification-drawer__list-item-description--MarginBlockEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-notification-drawer__list-item-timestamp--Color: var(--pf-t--global--text--color--subtle);
   --pf-v6-c-notification-drawer__list-item-timestamp--FontSize: var(--pf-t--global--font--size--body--default);
-  --pf-v6-c-notification-drawer__group--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
-  --pf-v6-c-notification-drawer__group--m-expanded--group--BorderBottomColor: var(--pf-t--global--border--color--default);
+  --pf-v6-c-notification-drawer__group--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
+  --pf-v6-c-notification-drawer__group--m-expanded--group--BorderBlockEndColor: var(--pf-t--global--border--color--default);
   --pf-v6-c-notification-drawer__group--m-expanded--MinHeight: 0;
   --pf-v6-c-notification-drawer__group--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__group-toggle--PaddingTop: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__group-toggle--PaddingRight: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-notification-drawer__group-toggle--PaddingBottom: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__group-toggle--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-notification-drawer__group-toggle--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__group-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-notification-drawer__group-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__group-toggle--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-notification-drawer__group-toggle--BackgroundColor: var(--pf-t--global--background--color--floating--default);
   --pf-v6-c-notification-drawer__group-toggle--OutlineOffset: -0.25rem;
-  --pf-v6-c-notification-drawer__group-toggle-title--MarginRight: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__group-toggle-title--MarginInlineEnd: var(--pf-t--global--spacer--md);
   --pf-v6-c-notification-drawer__group-toggle-title--FontSize: var(--pf-t--global--font--size--body--lg);
   --pf-v6-c-notification-drawer__group-toggle-title--max-lines: 1;
-  --pf-v6-c-notification-drawer__group-toggle-count--MarginRight: var(--pf-t--global--spacer--md);
-  --pf-v6-c-notification-drawer__group-toggle-icon--MarginRight: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__group-toggle-count--MarginInlineEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-notification-drawer__group-toggle-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
   --pf-v6-c-notification-drawer__group-toggle-icon--Color: var(--pf-t--global--icon--color--regular);
   --pf-v6-c-notification-drawer__group-toggle-icon--Transition: .2s ease-in 0s;
   --pf-v6-c-notification-drawer__group--m-expanded__group-toggle-icon--Rotate: 90deg;
@@ -86,10 +85,10 @@
   display: flex;
   flex-shrink: 0;
   align-items: baseline;
-  padding-block-start: var(--pf-v6-c-notification-drawer__header--PaddingTop);
-  padding-block-end: var(--pf-v6-c-notification-drawer__header--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-notification-drawer__header--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-notification-drawer__header--PaddingRight);
+  padding-block-start: var(--pf-v6-c-notification-drawer__header--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-notification-drawer__header--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-notification-drawer__header--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-notification-drawer__header--PaddingInlineEnd);
   background-color: var(--pf-v6-c-notification-drawer__header--BackgroundColor);
 }
 
@@ -101,7 +100,7 @@
 }
 
 .pf-v6-c-notification-drawer__header-status {
-  margin-inline-start: var(--pf-v6-c-notification-drawer__header-status--MarginLeft);
+  margin-inline-start: var(--pf-v6-c-notification-drawer__header-status--MarginInlineStart);
   font-size: var(--pf-v6-c-notification-drawer__header-status--FontSize);
   font-weight: var(--pf-v6-c-notification-drawer__header-status--FontWeight);
   color: var(--pf-v6-c-notification-drawer__header-status--Color);
@@ -132,10 +131,10 @@
   position: relative;
   display: grid;
   grid-template-columns: 1fr auto;
-  padding-block-start: var(--pf-v6-c-notification-drawer__list-item--PaddingTop);
-  padding-block-end: var(--pf-v6-c-notification-drawer__list-item--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-notification-drawer__list-item--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-notification-drawer__list-item--PaddingRight);
+  padding-block-start: var(--pf-v6-c-notification-drawer__list-item--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-notification-drawer__list-item--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-notification-drawer__list-item--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-notification-drawer__list-item--PaddingInlineEnd);
   background-color: var(--pf-v6-c-notification-drawer__list-item--BackgroundColor);
   border: var(--pf-v6-c-notification-drawer__list-item--BorderWidth) solid var(--pf-v6-c-notification-drawer__list-item--BorderColor);
   border-radius: var(--pf-v6-c-notification-drawer__list-item--BorderRadius);
@@ -178,11 +177,11 @@
   grid-row: 1/2;
   grid-column: 1/2;
   align-items: baseline;
-  margin-block-end: var(--pf-v6-c-notification-drawer__list-item-header--MarginBottom);
+  margin-block-end: var(--pf-v6-c-notification-drawer__list-item-header--MarginBlockEnd);
 }
 
 .pf-v6-c-notification-drawer__list-item-header-icon {
-  margin-inline-end: var(--pf-v6-c-notification-drawer__list-item-header-icon--MarginRight);
+  margin-inline-end: var(--pf-v6-c-notification-drawer__list-item-header-icon--MarginInlineEnd);
   color: var(--pf-v6-c-notification-drawer__list-item-header-icon--Color);
 }
 
@@ -208,7 +207,7 @@
 .pf-v6-c-notification-drawer__list-item-description {
   grid-row: 2/3;
   grid-column: 1/2;
-  margin-block-end: var(--pf-v6-c-notification-drawer__list-item-description--MarginBottom);
+  margin-block-end: var(--pf-v6-c-notification-drawer__list-item-description--MarginBlockEnd);
   word-break: break-word;
 }
 
@@ -225,7 +224,7 @@
 }
 
 .pf-v6-c-notification-drawer__group {
-  border-block-end: var(--pf-v6-c-notification-drawer__group--BorderBottomWidth) solid var(--pf-v6-c-notification-drawer__group--m-expanded--group--BorderBottomColor);
+  border-block-end: var(--pf-v6-c-notification-drawer__group--BorderBlockEndWidth) solid var(--pf-v6-c-notification-drawer__group--m-expanded--group--BorderBlockEndColor);
 }
 .pf-v6-c-notification-drawer__group.pf-m-expanded {
   min-height: var(--pf-v6-c-notification-drawer__group--m-expanded--MinHeight);
@@ -236,10 +235,10 @@
   display: flex;
   align-items: baseline;
   width: 100%;
-  padding-block-start: var(--pf-v6-c-notification-drawer__group-toggle--PaddingTop);
-  padding-block-end: var(--pf-v6-c-notification-drawer__group-toggle--PaddingBottom);
-  padding-inline-start: var(--pf-v6-c-notification-drawer__group-toggle--PaddingLeft);
-  padding-inline-end: var(--pf-v6-c-notification-drawer__group-toggle--PaddingRight);
+  padding-block-start: var(--pf-v6-c-notification-drawer__group-toggle--PaddingBlockStart);
+  padding-block-end: var(--pf-v6-c-notification-drawer__group-toggle--PaddingBlockEnd);
+  padding-inline-start: var(--pf-v6-c-notification-drawer__group-toggle--PaddingInlineStart);
+  padding-inline-end: var(--pf-v6-c-notification-drawer__group-toggle--PaddingInlineEnd);
   background-color: var(--pf-v6-c-notification-drawer__group-toggle--BackgroundColor);
   border: none;
   outline-offset: var(--pf-v6-c-notification-drawer__group-toggle--OutlineOffset);
@@ -251,7 +250,7 @@
   -webkit-line-clamp: var(--pf-v6-c-notification-drawer__group-toggle-title--max-lines);
   overflow: hidden;
   flex: 1;
-  margin-inline-end: var(--pf-v6-c-notification-drawer__group-toggle-title--MarginRight);
+  margin-inline-end: var(--pf-v6-c-notification-drawer__group-toggle-title--MarginInlineEnd);
   font-size: var(--pf-v6-c-notification-drawer__group-toggle-title--FontSize);
   text-align: start;
   word-break: break-word;
@@ -259,11 +258,11 @@
 
 .pf-v6-c-notification-drawer__group-toggle-count {
   margin-inline-start: auto;
-  margin-inline-end: var(--pf-v6-c-notification-drawer__group-toggle-count--MarginRight);
+  margin-inline-end: var(--pf-v6-c-notification-drawer__group-toggle-count--MarginInlineEnd);
 }
 
 .pf-v6-c-notification-drawer__group-toggle-icon {
-  margin-inline-end: var(--pf-v6-c-notification-drawer__group-toggle-icon--MarginRight);
+  margin-inline-end: var(--pf-v6-c-notification-drawer__group-toggle-icon--MarginInlineEnd);
   color: var(--pf-v6-c-notification-drawer__group-toggle-icon--Color);
   transition: var(--pf-v6-c-notification-drawer__group-toggle-icon--Transition);
 }

package/css/components/NumberInput/number-input.css

@@ -1,14 +1,5 @@
-.pf-v6-c-number-input .pf-v6-c-form-control > :is(input) {
-  appearance: textfield;
-}
-.pf-v6-c-number-input .pf-v6-c-form-control > :is(input)::-webkit-inner-spin-button, .pf-v6-c-number-input .pf-v6-c-form-control > :is(input)::-webkit-outer-spin-button {
-  margin: 0;
-  appearance: none;
-}
-
-:root,
-.pf-v6-c-number-input {
-  --pf-v6-c-number-input__unit--c-input-group--MarginLeft: var(--pf-t--global--spacer--sm);
+:where(:root, .pf-v6-c-number-input) {
+  --pf-v6-c-number-input__unit--c-input-group--MarginInlineStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-number-input__icon--FontSize: var(--pf-t--global--font--size--xs);
   --pf-v6-c-number-input--c-form-control--width-base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-t--global--border--width--box--default) * 2);
   --pf-v6-c-number-input--c-form-control--width-icon: var(--pf-t--global--spacer--xl);
@@ -30,11 +21,16 @@
 }
 .pf-v6-c-number-input .pf-v6-c-form-control > :is(input) {
   text-align: end;
+  appearance: textfield;
+}
+.pf-v6-c-number-input .pf-v6-c-form-control > :is(input)::-webkit-inner-spin-button, .pf-v6-c-number-input .pf-v6-c-form-control > :is(input)::-webkit-outer-spin-button {
+  margin: 0;
+  appearance: none;
 }
 
 .pf-v6-c-input-group + .pf-v6-c-number-input__unit,
 .pf-v6-c-number-input__unit + .pf-v6-c-input-group {
-  margin-inline-start: var(--pf-v6-c-number-input__unit--c-input-group--MarginLeft);
+  margin-inline-start: var(--pf-v6-c-number-input__unit--c-input-group--MarginInlineStart);
 }
 
 .pf-v6-c-number-input__icon {

package/css/components/OverflowMenu/overflow-menu.css

@@ -1,4 +1,4 @@
-:root {
+:where(:root, .pf-v6-c-overflow-menu) {
   --pf-v6-c-overflow-menu--ColumnGap: var(--pf-t--global--spacer--md);
   --pf-v6-c-overflow-menu__group--ColumnGap: var(--pf-t--global--spacer--md);
   --pf-v6-c-overflow-menu__group--m-button-group--ColumnGap: var(--pf-t--global--spacer--sm);