@patternfly/react-table 6.5.0-prerelease.11 → 6.5.0-prerelease.12

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.
@@ -1976,6 +1976,74 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
1976
1976
  --pf-v6-c-table--m-tree-view-grid__tbody--cell--PaddingInlineStart: calc(var(--pf-v6-c-table__tree-view-main--nested-indent--base) * 9 + var(--pf-v6-c-table__tree-view-main--indent--base));
1977
1977
  }
1978
1978
  }
1979
+ .pf-v6-c-table {
1980
+ --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
1981
+ --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
1982
+ --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
1983
+ --pf-v6-c-table__sticky-cell--InsetInlineEnd: auto;
1984
+ --pf-v6-c-table__sticky-cell--InsetInlineStart: auto;
1985
+ --pf-v6-c-table__sticky-cell--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1986
+ --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
1987
+ --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
1988
+ --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
1989
+ --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
1990
+ --pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd: 0;
1991
+ --pf-v6-c-table__sticky-cell--m-left--InsetInlineStart: 0;
1992
+ --pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex: calc(var(--pf-v6-c-table__sticky-cell--ZIndex) + 1);
1993
+ }
1994
+
1995
+ .pf-v6-c-table .pf-v6-c-table__sticky-cell {
1996
+ position: sticky;
1997
+ inset-inline-start: var(--pf-v6-c-table__sticky-cell--InsetInlineStart);
1998
+ inset-inline-end: var(--pf-v6-c-table__sticky-cell--InsetInlineEnd);
1999
+ z-index: var(--pf-v6-c-table__sticky-cell--ZIndex);
2000
+ min-width: var(--pf-v6-c-table__sticky-cell--MinWidth);
2001
+ }
2002
+
2003
+ .pf-v6-c-table__sticky-cell {
2004
+ --pf-v6-c-table--cell--Overflow: visible;
2005
+ --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex);
2006
+ background-color: var(--pf-v6-c-table__sticky-cell--BackgroundColor);
2007
+ background-clip: padding-box;
2008
+ }
2009
+
2010
+ .pf-v6-c-table__sticky-cell.pf-m-border-right::before {
2011
+ --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth);
2012
+ --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor);
2013
+ }
2014
+
2015
+ .pf-v6-c-table__sticky-cell.pf-m-border-left::before {
2016
+ --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth);
2017
+ --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor);
2018
+ }
2019
+
2020
+ .pf-v6-c-table__sticky-cell.pf-m-right, .pf-v6-c-table__sticky-cell.pf-m-inline-end {
2021
+ --pf-v6-c-table__sticky-cell--InsetInlineEnd: var(--pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd);
2022
+ }
2023
+
2024
+ .pf-v6-c-table__sticky-cell.pf-m-left, .pf-v6-c-table__sticky-cell.pf-m-inline-start {
2025
+ --pf-v6-c-table__sticky-cell--InsetInlineStart: var(--pf-v6-c-table__sticky-cell--m-left--InsetInlineStart);
2026
+ }
2027
+
2028
+ .pf-v6-c-scroll-outer-wrapper {
2029
+ --pf-v6-c-scroll-outer-wrapper--MinHeight: 25rem;
2030
+ --pf-v6-c-scroll-outer-wrapper--MaxHeight: 100%;
2031
+ display: flex;
2032
+ flex-direction: column;
2033
+ max-width: 100%;
2034
+ min-height: var(--pf-v6-c-scroll-outer-wrapper--MinHeight);
2035
+ max-height: var(--pf-v6-c-scroll-outer-wrapper--MaxHeight);
2036
+ overflow: hidden;
2037
+ }
2038
+
2039
+ .pf-v6-c-scroll-inner-wrapper {
2040
+ display: flex;
2041
+ flex-direction: column;
2042
+ max-width: 100%;
2043
+ max-height: 100%;
2044
+ overflow: auto;
2045
+ }
2046
+
1979
2047
  .pf-v6-c-table {
1980
2048
  --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
1981
2049
  --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
@@ -3652,300 +3720,471 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3652
3720
  --pf-v6-c-table--cell--Width: auto;
3653
3721
  }
3654
3722
  }
3655
- .pf-v6-c-table {
3656
- --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
3657
- --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
3658
- --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
3659
- --pf-v6-c-table__sticky-cell--InsetInlineEnd: auto;
3660
- --pf-v6-c-table__sticky-cell--InsetInlineStart: auto;
3661
- --pf-v6-c-table__sticky-cell--BackgroundColor: var(--pf-t--global--background--color--primary--default);
3662
- --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
3663
- --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
3664
- --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
3665
- --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
3666
- --pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd: 0;
3667
- --pf-v6-c-table__sticky-cell--m-left--InsetInlineStart: 0;
3668
- --pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex: calc(var(--pf-v6-c-table__sticky-cell--ZIndex) + 1);
3723
+ .pf-v6-c-inline-edit {
3724
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
3725
+ --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
3726
+ --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
3727
+ --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
3728
+ --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
3729
+ --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
3669
3730
  }
3670
3731
 
3671
- .pf-v6-c-table .pf-v6-c-table__sticky-cell {
3672
- position: sticky;
3673
- inset-inline-start: var(--pf-v6-c-table__sticky-cell--InsetInlineStart);
3674
- inset-inline-end: var(--pf-v6-c-table__sticky-cell--InsetInlineEnd);
3675
- z-index: var(--pf-v6-c-table__sticky-cell--ZIndex);
3676
- min-width: var(--pf-v6-c-table__sticky-cell--MinWidth);
3732
+ .pf-v6-c-inline-edit__group {
3733
+ display: flex;
3734
+ align-items: baseline;
3677
3735
  }
3678
3736
 
3679
- .pf-v6-c-table__sticky-cell {
3680
- --pf-v6-c-table--cell--Overflow: visible;
3681
- --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex);
3682
- background-color: var(--pf-v6-c-table__sticky-cell--BackgroundColor);
3683
- background-clip: padding-box;
3737
+ .pf-v6-c-inline-edit__group > * {
3738
+ margin-inline-end: var(--pf-v6-c-inline-edit__group--item--MarginInlineEnd);
3684
3739
  }
3685
3740
 
3686
- .pf-v6-c-table__sticky-cell.pf-m-border-right::before {
3687
- --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth);
3688
- --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor);
3741
+ .pf-v6-c-inline-edit__group.pf-m-icon-group {
3742
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd);
3689
3743
  }
3690
3744
 
3691
- .pf-v6-c-table__sticky-cell.pf-m-border-left::before {
3692
- --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth);
3693
- --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor);
3745
+ .pf-v6-c-inline-edit__group.pf-m-footer {
3746
+ margin-block-start: var(--pf-v6-c-inline-edit__group--m-footer--MarginBlockStart);
3694
3747
  }
3695
3748
 
3696
- .pf-v6-c-table__sticky-cell.pf-m-right, .pf-v6-c-table__sticky-cell.pf-m-inline-end {
3697
- --pf-v6-c-table__sticky-cell--InsetInlineEnd: var(--pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd);
3749
+ .pf-v6-c-inline-edit__group.pf-m-column {
3750
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
3751
+ flex-direction: column;
3698
3752
  }
3699
3753
 
3700
- .pf-v6-c-table__sticky-cell.pf-m-left, .pf-v6-c-table__sticky-cell.pf-m-inline-start {
3701
- --pf-v6-c-table__sticky-cell--InsetInlineStart: var(--pf-v6-c-table__sticky-cell--m-left--InsetInlineStart);
3754
+ .pf-v6-c-inline-edit__group > :last-child {
3755
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
3702
3756
  }
3703
3757
 
3704
- .pf-v6-c-scroll-outer-wrapper {
3705
- --pf-v6-c-scroll-outer-wrapper--MinHeight: 25rem;
3706
- --pf-v6-c-scroll-outer-wrapper--MaxHeight: 100%;
3707
- display: flex;
3708
- flex-direction: column;
3709
- max-width: 100%;
3710
- min-height: var(--pf-v6-c-scroll-outer-wrapper--MinHeight);
3711
- max-height: var(--pf-v6-c-scroll-outer-wrapper--MaxHeight);
3712
- overflow: hidden;
3758
+ .pf-v6-c-inline-edit__input {
3759
+ flex: 1;
3713
3760
  }
3714
3761
 
3715
- .pf-v6-c-scroll-inner-wrapper {
3716
- display: flex;
3717
- flex-direction: column;
3718
- max-width: 100%;
3719
- max-height: 100%;
3720
- overflow: auto;
3762
+ .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain {
3763
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color);
3721
3764
  }
3722
3765
 
3723
- .pf-v6-c-form {
3724
- --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
3725
- --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3726
- --pf-v6-c-form__group--m-action--MarginBlockStart: var(--pf-t--global--spacer--xl);
3727
- --pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth: 9.375rem;
3728
- --pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
3729
- --pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth: 1fr;
3730
- --pf-v6-c-form--m-limit-width--MaxWidth: 55rem;
3731
- --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: calc((((((var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body)) + (2 * var(--pf-t--global--border--width--control--default))) - var(--pf-t--global--font--size--body--default)) / 2) + var(--pf-t--global--font--size--body--default)) - ((((var(--pf-t--global--font--size--body--sm) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--sm)) / 2) + var(--pf-t--global--font--size--body--sm)) + var(--pf-t--global--border--width--control--default));
3732
- --pf-v6-c-form__group-label--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3733
- --pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart: 0;
3734
- --pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY: calc(((((var(--pf-t--global--font--size--body--sm) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--sm)) / 2) + var(--pf-t--global--font--size--body--sm)) - ((((var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--default)) / 2) + var(--pf-t--global--font--size--body--default)));
3735
- --pf-v6-c-form__label--FontSize: var(--pf-t--global--font--size--body--default);
3736
- --pf-v6-c-form__label--LineHeight: var(--pf-t--global--font--line-height--body);
3737
- --pf-v6-c-form__label--m-disabled--Color: var(--pf-t--global--text--color--disabled);
3738
- --pf-v6-c-form__label--hover--Cursor: pointer;
3739
- --pf-v6-c-form__label--m-disabled--hover--Cursor: not-allowed;
3740
- --pf-v6-c-form__label-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
3741
- --pf-v6-c-form__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
3742
- --pf-v6-c-form__label-required--FontSize: var(--pf-t--global--font--size--body--default);
3743
- --pf-v6-c-form__label-required--Color: var(--pf-t--global--color--status--danger--default);
3744
- --pf-v6-c-form__group-label-help--FontSize: var(--pf-t--global--font--size--body--default);
3745
- --pf-v6-c-form__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--horizontal);
3746
- --pf-v6-c-form__group-label-info--FontSize: var(--pf-t--global--font--size--body--sm);
3747
- --pf-v6-c-form--m-horizontal__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3748
- --pf-v6-c-form__group-control--m-inline--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
3749
- --pf-v6-c-form__group-control__helper-text--MarginBlockEnd: var(--pf-t--global--spacer--xs);
3750
- --pf-v6-c-form__group-control--m-stack--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3751
- --pf-v6-c-form__group-control--m-stack__helper-text--MarginBlockStart: calc(var(--pf-v6-c-form__group-control--m-stack--Gap) * -1 + var(--pf-v6-c-form__helper-text--MarginBlockStart--base));
3752
- --pf-v6-c-form__actions--child--MarginBlockStart: var(--pf-t--global--spacer--sm);
3753
- --pf-v6-c-form__actions--child--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3754
- --pf-v6-c-form__actions--child--MarginBlockEnd: var(--pf-t--global--spacer--sm);
3755
- --pf-v6-c-form__actions--child--MarginInlineStart: var(--pf-t--global--spacer--sm);
3756
- --pf-v6-c-form__actions--MarginBlockStart: calc(var(--pf-v6-c-form__actions--child--MarginBlockStart) * -1);
3757
- --pf-v6-c-form__actions--MarginInlineEnd: calc(var(--pf-v6-c-form__actions--child--MarginInlineEnd) * -1);
3758
- --pf-v6-c-form__actions--MarginBlockEnd: calc(var(--pf-v6-c-form__actions--child--MarginBlockEnd) * -1);
3759
- --pf-v6-c-form__actions--MarginInlineStart: calc(var(--pf-v6-c-form__actions--child--MarginInlineStart) * -1);
3760
- --pf-v6-c-form__helper-text--MarginBlockStart--base: var(--pf-t--global--spacer--xs);
3761
- --pf-v6-c-form__helper-text--MarginBlockStart: var(--pf-v6-c-form__helper-text--MarginBlockStart--base);
3762
- --pf-v6-c-form__section--MarginBlockStart: var(--pf-t--global--spacer--xl);
3763
- --pf-v6-c-form__section--Gap: var(--pf-v6-c-form--GridGap);
3764
- --pf-v6-c-form__section-title--FontSize: var(--pf-t--global--font--size--heading--xs);
3765
- --pf-v6-c-form__section-title--FontWeight: var(--pf-t--global--font--weight--heading--default);
3766
- --pf-v6-c-form__section-title--MarginBlockEnd: calc(var(--pf-t--global--spacer--sm) * -1);
3767
- --pf-v6-c-form__field-group--border-width-base: var(--pf-t--global--border--width--divider--default);
3768
- --pf-v6-c-form__field-group--BorderBlockStartWidth: var(--pf-v6-c-form__field-group--border-width-base);
3769
- --pf-v6-c-form__field-group--BorderBlockStartColor: var(--pf-t--global--border--color--default);
3770
- --pf-v6-c-form__field-group--BorderBlockEndWidth: var(--pf-v6-c-form__field-group--border-width-base);
3771
- --pf-v6-c-form__field-group--BorderBlockEndColor: var(--pf-t--global--border--color--default);
3772
- --pf-v6-c-form__field-group--field-group--MarginBlockStart: calc(var(--pf-v6-c-form--GridGap) * -1);
3773
- --pf-v6-c-form__field-group--GridTemplateColumns--toggle: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-form__field-group-toggle-icon--MinWidth) + var(--pf-t--global--spacer--xs));
3774
- --pf-v6-c-form__field-group-toggle--PaddingBlockStart: var(--pf-v6-c-form__field-group-header--PaddingBlockStart);
3775
- --pf-v6-c-form__field-group-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
3776
- --pf-v6-c-form__field-group__field-group__field-group-toggle--PaddingBlockStart: var(--pf-t--global--spacer--lg);
3777
- --pf-v6-c-form__field-group-header-toggle--BorderWidth--base: var(--pf-t--global--border--width--divider--default);
3778
- --pf-v6-c-form__field-group__field-group--field-group__field-group-toggle--after--BorderBlockStartWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
3779
- --pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
3780
- --pf-v6-c-form__field-group-toggle-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
3781
- --pf-v6-c-form__field-group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
3782
- --pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
3783
- --pf-v6-c-form__field-group-toggle-icon--MinWidth: var(--pf-t--global--font--size--body--default);
3784
- --pf-v6-c-form__field-group-toggle-icon--Rotate: 0;
3785
- --pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate: 90deg;
3786
- --pf-v6-c-form__field-group-header--PaddingBlockStart: var(--pf-t--global--spacer--md);
3787
- --pf-v6-c-form__field-group-header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
3788
- --pf-v6-c-form__field-group-header--GridColumn: 1 / 3;
3789
- --pf-v6-c-form__field-group__field-group__field-group-header--PaddingBlockStart: var(--pf-t--global--spacer--lg);
3790
- --pf-v6-c-form__field-group__field-group__field-group-header--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
3791
- --pf-v6-c-form__field-group-toggle--field-group-header--GridColumn: 2 / 3;
3792
- --pf-v6-c-form__field-group__field-group--field-group__field-group-header--after--BorderBlockStartWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
3793
- --pf-v6-c-form__field-group-header-description--MarginBlockStart: var(--pf-t--global--spacer--xs);
3794
- --pf-v6-c-form__field-group-header-description--Color: var(--pf-t--global--text--color--subtle);
3795
- --pf-v6-c-form__field-group-header-actions--MarginInlineStart: var(--pf-t--global--spacer--sm);
3796
- --pf-v6-c-form__field-group-header-actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
3797
- --pf-v6-c-form__field-group-header-actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
3798
- --pf-v6-c-form__field-group-body--PaddingBlockStart: var(--pf-t--global--spacer--lg);
3799
- --pf-v6-c-form__field-group-body--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
3800
- --pf-v6-c-form__field-group-body--Gap: var(--pf-v6-c-form--GridGap);
3801
- --pf-v6-c-form__field-group-body--GridColumn: 2 / 3;
3802
- --pf-v6-c-form__field-group__field-group__field-group-body--GridColumn: 1 / 3;
3803
- --pf-v6-c-form__field-group__field-group__field-group-toggle--field-group-body--GridColumn: 2 / 3;
3804
- --pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd: calc(var(--pf-v6-c-form__field-group-body--PaddingBlockEnd) * -1);
3805
- --pf-v6-c-form__field-group-body--TranslateY: 0;
3806
- --pf-v6-c-form__field-group--m-expanded__field-group-body--TranslateY: 0;
3807
- --pf-v6-c-form__field-group-body--TransitionDuration--expand--slide: 0s;
3808
- --pf-v6-c-form__field-group-body--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
3809
- --pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide: 0s;
3810
- --pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
3766
+ .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain:hover {
3767
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color);
3811
3768
  }
3812
3769
 
3813
- @media screen and (prefers-reduced-motion: no-preference) {
3814
- .pf-v6-c-form {
3815
- --pf-v6-c-form__field-group-body--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
3816
- --pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
3817
- --pf-v6-c-form__field-group-body--TranslateY: -.5rem;
3818
- }
3770
+ .pf-v6-c-inline-edit__input,
3771
+ .pf-v6-c-inline-edit__action,
3772
+ .pf-v6-c-inline-edit__group.pf-m-action-group {
3773
+ display: none;
3819
3774
  }
3820
- .pf-v6-c-form {
3821
- display: grid;
3822
- gap: var(--pf-v6-c-form--GridGap);
3775
+
3776
+ .pf-v6-c-inline-edit__action.pf-m-enable-editable {
3777
+ display: inline-block;
3823
3778
  }
3824
3779
 
3825
- .pf-v6-c-form.pf-m-horizontal.pf-m-align-right .pf-v6-c-form__label {
3826
- text-align: end;
3780
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__input,
3781
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__input {
3782
+ display: block;
3827
3783
  }
3828
3784
 
3829
- @media screen and (min-width: 48rem) {
3830
- .pf-v6-c-form.pf-m-horizontal {
3831
- --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
3832
- }
3833
- .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group {
3834
- display: grid;
3835
- grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
3836
- grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
3837
- }
3838
- .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label {
3839
- padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
3840
- }
3841
- .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label.pf-m-no-padding-top {
3842
- --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart);
3843
- transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
3844
- }
3845
- .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label.pf-m-info {
3846
- --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
3847
- flex-direction: column;
3848
- align-items: flex-start;
3849
- }
3850
- .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label-main {
3851
- flex-grow: 0;
3852
- }
3853
- .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-control {
3854
- grid-column: 2;
3855
- }
3785
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action,
3786
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action {
3787
+ display: inline-block;
3856
3788
  }
3857
- @media screen and (min-width: 0) {
3858
- .pf-v6-c-form.pf-m-horizontal-on-xs {
3859
- --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
3860
- }
3861
- .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group {
3862
- display: grid;
3863
- grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
3864
- grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
3865
- }
3866
- .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label {
3867
- padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
3868
- }
3869
- .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label.pf-m-no-padding-top {
3870
- --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart);
3871
- transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
3872
- }
3873
- .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label.pf-m-info {
3874
- --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
3875
- flex-direction: column;
3876
- align-items: flex-start;
3877
- }
3878
- .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label-main {
3879
- flex-grow: 0;
3880
- }
3881
- .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-control {
3882
- grid-column: 2;
3883
- }
3789
+
3790
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group,
3791
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group {
3792
+ display: inline-flex;
3884
3793
  }
3885
- @media (min-width: 36rem) {
3886
- .pf-v6-c-form.pf-m-horizontal-on-sm {
3887
- --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
3794
+
3795
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__value,
3796
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable,
3797
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__value,
3798
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable {
3799
+ display: none;
3800
+ }
3801
+
3802
+ .pf-v6-c-inline-edit__label + .pf-v6-c-inline-edit__action.pf-m-enable > .pf-v6-c-button {
3803
+ margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
3804
+ margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
3805
+ }
3806
+
3807
+ .pf-v6-c-inline-edit__label.pf-m-bold {
3808
+ font-weight: var(--pf-v6-c-inline-edit__label--m-bold--FontWeight);
3809
+ }
3810
+
3811
+ .pf-v6-c-inline-edit__editable-text br {
3812
+ display: none;
3813
+ }
3814
+
3815
+ .pf-v6-u-screen-reader {
3816
+ position: fixed;
3817
+ inset-block-start: 0;
3818
+ inset-inline-start: 0;
3819
+ overflow: hidden;
3820
+ clip: rect(0, 0, 0, 0);
3821
+ white-space: nowrap;
3822
+ border: 0;
3823
+ }
3824
+
3825
+ .pf-v6-u-visible {
3826
+ position: static;
3827
+ overflow: visible;
3828
+ clip: auto;
3829
+ white-space: normal;
3830
+ border: inherit;
3831
+ }
3832
+
3833
+ .pf-v6-u-hidden {
3834
+ display: none !important;
3835
+ }
3836
+
3837
+ @media screen and (min-width: 36rem) {
3838
+ .pf-v6-u-screen-reader-on-sm {
3839
+ position: fixed;
3840
+ inset-block-start: 0;
3841
+ inset-inline-start: 0;
3842
+ overflow: hidden;
3843
+ clip: rect(0, 0, 0, 0);
3844
+ white-space: nowrap;
3845
+ border: 0;
3888
3846
  }
3889
- .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group {
3890
- display: grid;
3891
- grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
3892
- grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
3847
+ }
3848
+ @media screen and (min-width: 36rem) {
3849
+ .pf-v6-u-visible-on-sm {
3850
+ position: static;
3851
+ overflow: visible;
3852
+ clip: auto;
3853
+ white-space: normal;
3854
+ border: inherit;
3893
3855
  }
3894
- .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label {
3895
- padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
3856
+ }
3857
+ @media screen and (min-width: 36rem) {
3858
+ .pf-v6-u-hidden-on-sm {
3859
+ display: none !important;
3896
3860
  }
3897
- .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label.pf-m-no-padding-top {
3898
- --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart);
3899
- transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
3861
+ }
3862
+ @media screen and (min-width: 48rem) {
3863
+ .pf-v6-u-screen-reader-on-md {
3864
+ position: fixed;
3865
+ inset-block-start: 0;
3866
+ inset-inline-start: 0;
3867
+ overflow: hidden;
3868
+ clip: rect(0, 0, 0, 0);
3869
+ white-space: nowrap;
3870
+ border: 0;
3900
3871
  }
3901
- .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label.pf-m-info {
3902
- --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
3903
- flex-direction: column;
3904
- align-items: flex-start;
3872
+ }
3873
+ @media screen and (min-width: 48rem) {
3874
+ .pf-v6-u-visible-on-md {
3875
+ position: static;
3876
+ overflow: visible;
3877
+ clip: auto;
3878
+ white-space: normal;
3879
+ border: inherit;
3905
3880
  }
3906
- .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label-main {
3907
- flex-grow: 0;
3881
+ }
3882
+ @media screen and (min-width: 48rem) {
3883
+ .pf-v6-u-hidden-on-md {
3884
+ display: none !important;
3908
3885
  }
3909
- .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-control {
3910
- grid-column: 2;
3886
+ }
3887
+ @media screen and (min-width: 62rem) {
3888
+ .pf-v6-u-screen-reader-on-lg {
3889
+ position: fixed;
3890
+ inset-block-start: 0;
3891
+ inset-inline-start: 0;
3892
+ overflow: hidden;
3893
+ clip: rect(0, 0, 0, 0);
3894
+ white-space: nowrap;
3895
+ border: 0;
3911
3896
  }
3912
3897
  }
3913
- @media (min-width: 48rem) {
3914
- .pf-v6-c-form.pf-m-horizontal-on-md {
3915
- --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
3898
+ @media screen and (min-width: 62rem) {
3899
+ .pf-v6-u-visible-on-lg {
3900
+ position: static;
3901
+ overflow: visible;
3902
+ clip: auto;
3903
+ white-space: normal;
3904
+ border: inherit;
3916
3905
  }
3917
- .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group {
3918
- display: grid;
3919
- grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
3920
- grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
3906
+ }
3907
+ @media screen and (min-width: 62rem) {
3908
+ .pf-v6-u-hidden-on-lg {
3909
+ display: none !important;
3921
3910
  }
3922
- .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label {
3923
- padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
3911
+ }
3912
+ @media screen and (min-width: 75rem) {
3913
+ .pf-v6-u-screen-reader-on-xl {
3914
+ position: fixed;
3915
+ inset-block-start: 0;
3916
+ inset-inline-start: 0;
3917
+ overflow: hidden;
3918
+ clip: rect(0, 0, 0, 0);
3919
+ white-space: nowrap;
3920
+ border: 0;
3924
3921
  }
3925
- .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label.pf-m-no-padding-top {
3926
- --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart);
3927
- transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
3922
+ }
3923
+ @media screen and (min-width: 75rem) {
3924
+ .pf-v6-u-visible-on-xl {
3925
+ position: static;
3926
+ overflow: visible;
3927
+ clip: auto;
3928
+ white-space: normal;
3929
+ border: inherit;
3928
3930
  }
3929
- .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label.pf-m-info {
3930
- --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
3931
- flex-direction: column;
3932
- align-items: flex-start;
3931
+ }
3932
+ @media screen and (min-width: 75rem) {
3933
+ .pf-v6-u-hidden-on-xl {
3934
+ display: none !important;
3933
3935
  }
3934
- .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label-main {
3935
- flex-grow: 0;
3936
+ }
3937
+ @media screen and (min-width: 90.625rem) {
3938
+ .pf-v6-u-screen-reader-on-2xl {
3939
+ position: fixed;
3940
+ inset-block-start: 0;
3941
+ inset-inline-start: 0;
3942
+ overflow: hidden;
3943
+ clip: rect(0, 0, 0, 0);
3944
+ white-space: nowrap;
3945
+ border: 0;
3936
3946
  }
3937
- .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-control {
3938
- grid-column: 2;
3947
+ }
3948
+ @media screen and (min-width: 90.625rem) {
3949
+ .pf-v6-u-visible-on-2xl {
3950
+ position: static;
3951
+ overflow: visible;
3952
+ clip: auto;
3953
+ white-space: normal;
3954
+ border: inherit;
3939
3955
  }
3940
3956
  }
3941
- @media (min-width: 62rem) {
3942
- .pf-v6-c-form.pf-m-horizontal-on-lg {
3943
- --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
3957
+ @media screen and (min-width: 90.625rem) {
3958
+ .pf-v6-u-hidden-on-2xl {
3959
+ display: none !important;
3944
3960
  }
3945
- .pf-v6-c-form.pf-m-horizontal-on-lg .pf-v6-c-form__group {
3946
- display: grid;
3947
- grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
3948
- grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
3961
+ }
3962
+ .pf-v6-c-form {
3963
+ --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
3964
+ --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3965
+ --pf-v6-c-form__group--m-action--MarginBlockStart: var(--pf-t--global--spacer--xl);
3966
+ --pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth: 9.375rem;
3967
+ --pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap: var(--pf-t--global--spacer--gap--group--horizontal);
3968
+ --pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth: 1fr;
3969
+ --pf-v6-c-form--m-limit-width--MaxWidth: 55rem;
3970
+ --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: calc((((((var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body)) + (2 * var(--pf-t--global--border--width--control--default))) - var(--pf-t--global--font--size--body--default)) / 2) + var(--pf-t--global--font--size--body--default)) - ((((var(--pf-t--global--font--size--body--sm) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--sm)) / 2) + var(--pf-t--global--font--size--body--sm)) + var(--pf-t--global--border--width--control--default));
3971
+ --pf-v6-c-form__group-label--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
3972
+ --pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart: 0;
3973
+ --pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY: calc(((((var(--pf-t--global--font--size--body--sm) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--sm)) / 2) + var(--pf-t--global--font--size--body--sm)) - ((((var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body)) - var(--pf-t--global--font--size--body--default)) / 2) + var(--pf-t--global--font--size--body--default)));
3974
+ --pf-v6-c-form__label--FontSize: var(--pf-t--global--font--size--body--default);
3975
+ --pf-v6-c-form__label--LineHeight: var(--pf-t--global--font--line-height--body);
3976
+ --pf-v6-c-form__label--m-disabled--Color: var(--pf-t--global--text--color--disabled);
3977
+ --pf-v6-c-form__label--hover--Cursor: pointer;
3978
+ --pf-v6-c-form__label--m-disabled--hover--Cursor: not-allowed;
3979
+ --pf-v6-c-form__label-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
3980
+ --pf-v6-c-form__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
3981
+ --pf-v6-c-form__label-required--FontSize: var(--pf-t--global--font--size--body--default);
3982
+ --pf-v6-c-form__label-required--Color: var(--pf-t--global--color--status--danger--default);
3983
+ --pf-v6-c-form__group-label-help--FontSize: var(--pf-t--global--font--size--body--default);
3984
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--horizontal);
3985
+ --pf-v6-c-form__group-label-info--FontSize: var(--pf-t--global--font--size--body--sm);
3986
+ --pf-v6-c-form--m-horizontal__group-label--m-info--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3987
+ --pf-v6-c-form__group-control--m-inline--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
3988
+ --pf-v6-c-form__group-control__helper-text--MarginBlockEnd: var(--pf-t--global--spacer--xs);
3989
+ --pf-v6-c-form__group-control--m-stack--Gap: var(--pf-t--global--spacer--gap--group--vertical);
3990
+ --pf-v6-c-form__group-control--m-stack__helper-text--MarginBlockStart: calc(var(--pf-v6-c-form__group-control--m-stack--Gap) * -1 + var(--pf-v6-c-form__helper-text--MarginBlockStart--base));
3991
+ --pf-v6-c-form__actions--child--MarginBlockStart: var(--pf-t--global--spacer--sm);
3992
+ --pf-v6-c-form__actions--child--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3993
+ --pf-v6-c-form__actions--child--MarginBlockEnd: var(--pf-t--global--spacer--sm);
3994
+ --pf-v6-c-form__actions--child--MarginInlineStart: var(--pf-t--global--spacer--sm);
3995
+ --pf-v6-c-form__actions--MarginBlockStart: calc(var(--pf-v6-c-form__actions--child--MarginBlockStart) * -1);
3996
+ --pf-v6-c-form__actions--MarginInlineEnd: calc(var(--pf-v6-c-form__actions--child--MarginInlineEnd) * -1);
3997
+ --pf-v6-c-form__actions--MarginBlockEnd: calc(var(--pf-v6-c-form__actions--child--MarginBlockEnd) * -1);
3998
+ --pf-v6-c-form__actions--MarginInlineStart: calc(var(--pf-v6-c-form__actions--child--MarginInlineStart) * -1);
3999
+ --pf-v6-c-form__helper-text--MarginBlockStart--base: var(--pf-t--global--spacer--xs);
4000
+ --pf-v6-c-form__helper-text--MarginBlockStart: var(--pf-v6-c-form__helper-text--MarginBlockStart--base);
4001
+ --pf-v6-c-form__section--MarginBlockStart: var(--pf-t--global--spacer--xl);
4002
+ --pf-v6-c-form__section--Gap: var(--pf-v6-c-form--GridGap);
4003
+ --pf-v6-c-form__section-title--FontSize: var(--pf-t--global--font--size--heading--xs);
4004
+ --pf-v6-c-form__section-title--FontWeight: var(--pf-t--global--font--weight--heading--default);
4005
+ --pf-v6-c-form__section-title--MarginBlockEnd: calc(var(--pf-t--global--spacer--sm) * -1);
4006
+ --pf-v6-c-form__field-group--border-width-base: var(--pf-t--global--border--width--divider--default);
4007
+ --pf-v6-c-form__field-group--BorderBlockStartWidth: var(--pf-v6-c-form__field-group--border-width-base);
4008
+ --pf-v6-c-form__field-group--BorderBlockStartColor: var(--pf-t--global--border--color--default);
4009
+ --pf-v6-c-form__field-group--BorderBlockEndWidth: var(--pf-v6-c-form__field-group--border-width-base);
4010
+ --pf-v6-c-form__field-group--BorderBlockEndColor: var(--pf-t--global--border--color--default);
4011
+ --pf-v6-c-form__field-group--field-group--MarginBlockStart: calc(var(--pf-v6-c-form--GridGap) * -1);
4012
+ --pf-v6-c-form__field-group--GridTemplateColumns--toggle: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-form__field-group-toggle-icon--MinWidth) + var(--pf-t--global--spacer--xs));
4013
+ --pf-v6-c-form__field-group-toggle--PaddingBlockStart: var(--pf-v6-c-form__field-group-header--PaddingBlockStart);
4014
+ --pf-v6-c-form__field-group-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
4015
+ --pf-v6-c-form__field-group__field-group__field-group-toggle--PaddingBlockStart: var(--pf-t--global--spacer--lg);
4016
+ --pf-v6-c-form__field-group-header-toggle--BorderWidth--base: var(--pf-t--global--border--width--divider--default);
4017
+ --pf-v6-c-form__field-group__field-group--field-group__field-group-toggle--after--BorderBlockStartWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
4018
+ --pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
4019
+ --pf-v6-c-form__field-group-toggle-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
4020
+ --pf-v6-c-form__field-group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
4021
+ --pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
4022
+ --pf-v6-c-form__field-group-toggle-icon--MinWidth: var(--pf-t--global--font--size--body--default);
4023
+ --pf-v6-c-form__field-group-toggle-icon--Rotate: 0;
4024
+ --pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate: 90deg;
4025
+ --pf-v6-c-form__field-group-header--PaddingBlockStart: var(--pf-t--global--spacer--md);
4026
+ --pf-v6-c-form__field-group-header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
4027
+ --pf-v6-c-form__field-group-header--GridColumn: 1 / 3;
4028
+ --pf-v6-c-form__field-group__field-group__field-group-header--PaddingBlockStart: var(--pf-t--global--spacer--lg);
4029
+ --pf-v6-c-form__field-group__field-group__field-group-header--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
4030
+ --pf-v6-c-form__field-group-toggle--field-group-header--GridColumn: 2 / 3;
4031
+ --pf-v6-c-form__field-group__field-group--field-group__field-group-header--after--BorderBlockStartWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
4032
+ --pf-v6-c-form__field-group-header-description--MarginBlockStart: var(--pf-t--global--spacer--xs);
4033
+ --pf-v6-c-form__field-group-header-description--Color: var(--pf-t--global--text--color--subtle);
4034
+ --pf-v6-c-form__field-group-header-actions--MarginInlineStart: var(--pf-t--global--spacer--sm);
4035
+ --pf-v6-c-form__field-group-header-actions--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
4036
+ --pf-v6-c-form__field-group-header-actions--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
4037
+ --pf-v6-c-form__field-group-body--PaddingBlockStart: var(--pf-t--global--spacer--lg);
4038
+ --pf-v6-c-form__field-group-body--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
4039
+ --pf-v6-c-form__field-group-body--Gap: var(--pf-v6-c-form--GridGap);
4040
+ --pf-v6-c-form__field-group-body--GridColumn: 2 / 3;
4041
+ --pf-v6-c-form__field-group__field-group__field-group-body--GridColumn: 1 / 3;
4042
+ --pf-v6-c-form__field-group__field-group__field-group-toggle--field-group-body--GridColumn: 2 / 3;
4043
+ --pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd: calc(var(--pf-v6-c-form__field-group-body--PaddingBlockEnd) * -1);
4044
+ --pf-v6-c-form__field-group-body--TranslateY: 0;
4045
+ --pf-v6-c-form__field-group--m-expanded__field-group-body--TranslateY: 0;
4046
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--slide: 0s;
4047
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--fade: var(--pf-t--global--motion--duration--fade--default);
4048
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide: 0s;
4049
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--fade: var(--pf-t--global--motion--duration--fade--short);
4050
+ }
4051
+
4052
+ @media screen and (prefers-reduced-motion: no-preference) {
4053
+ .pf-v6-c-form {
4054
+ --pf-v6-c-form__field-group-body--TransitionDuration--expand--slide: var(--pf-t--global--motion--duration--fade--default);
4055
+ --pf-v6-c-form__field-group-body--TransitionDuration--collapse--slide: var(--pf-t--global--motion--duration--fade--short);
4056
+ --pf-v6-c-form__field-group-body--TranslateY: -.5rem;
4057
+ }
4058
+ }
4059
+ .pf-v6-c-form {
4060
+ display: grid;
4061
+ gap: var(--pf-v6-c-form--GridGap);
4062
+ }
4063
+
4064
+ .pf-v6-c-form.pf-m-horizontal.pf-m-align-right .pf-v6-c-form__label {
4065
+ text-align: end;
4066
+ }
4067
+
4068
+ @media screen and (min-width: 48rem) {
4069
+ .pf-v6-c-form.pf-m-horizontal {
4070
+ --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
4071
+ }
4072
+ .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group {
4073
+ display: grid;
4074
+ grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
4075
+ grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
4076
+ }
4077
+ .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label {
4078
+ padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
4079
+ }
4080
+ .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label.pf-m-no-padding-top {
4081
+ --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart);
4082
+ transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4083
+ }
4084
+ .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label.pf-m-info {
4085
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4086
+ flex-direction: column;
4087
+ align-items: flex-start;
4088
+ }
4089
+ .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-label-main {
4090
+ flex-grow: 0;
4091
+ }
4092
+ .pf-v6-c-form.pf-m-horizontal .pf-v6-c-form__group-control {
4093
+ grid-column: 2;
4094
+ }
4095
+ }
4096
+ @media screen and (min-width: 0) {
4097
+ .pf-v6-c-form.pf-m-horizontal-on-xs {
4098
+ --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
4099
+ }
4100
+ .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group {
4101
+ display: grid;
4102
+ grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
4103
+ grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
4104
+ }
4105
+ .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label {
4106
+ padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
4107
+ }
4108
+ .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label.pf-m-no-padding-top {
4109
+ --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart);
4110
+ transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4111
+ }
4112
+ .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label.pf-m-info {
4113
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4114
+ flex-direction: column;
4115
+ align-items: flex-start;
4116
+ }
4117
+ .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-label-main {
4118
+ flex-grow: 0;
4119
+ }
4120
+ .pf-v6-c-form.pf-m-horizontal-on-xs .pf-v6-c-form__group-control {
4121
+ grid-column: 2;
4122
+ }
4123
+ }
4124
+ @media (min-width: 36rem) {
4125
+ .pf-v6-c-form.pf-m-horizontal-on-sm {
4126
+ --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
4127
+ }
4128
+ .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group {
4129
+ display: grid;
4130
+ grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
4131
+ grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
4132
+ }
4133
+ .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label {
4134
+ padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
4135
+ }
4136
+ .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label.pf-m-no-padding-top {
4137
+ --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart);
4138
+ transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4139
+ }
4140
+ .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label.pf-m-info {
4141
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4142
+ flex-direction: column;
4143
+ align-items: flex-start;
4144
+ }
4145
+ .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-label-main {
4146
+ flex-grow: 0;
4147
+ }
4148
+ .pf-v6-c-form.pf-m-horizontal-on-sm .pf-v6-c-form__group-control {
4149
+ grid-column: 2;
4150
+ }
4151
+ }
4152
+ @media (min-width: 48rem) {
4153
+ .pf-v6-c-form.pf-m-horizontal-on-md {
4154
+ --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
4155
+ }
4156
+ .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group {
4157
+ display: grid;
4158
+ grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
4159
+ grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
4160
+ }
4161
+ .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label {
4162
+ padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
4163
+ }
4164
+ .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label.pf-m-no-padding-top {
4165
+ --pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart: var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--PaddingBlockStart);
4166
+ transform: translateY(var(--pf-v6-c-form--m-horizontal__group-label--m-no-padding--md--TranslateY));
4167
+ }
4168
+ .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label.pf-m-info {
4169
+ --pf-v6-c-form__group-label--m-info--Gap: var(--pf-v6-c-form--m-horizontal__group-label--m-info--Gap);
4170
+ flex-direction: column;
4171
+ align-items: flex-start;
4172
+ }
4173
+ .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-label-main {
4174
+ flex-grow: 0;
4175
+ }
4176
+ .pf-v6-c-form.pf-m-horizontal-on-md .pf-v6-c-form__group-control {
4177
+ grid-column: 2;
4178
+ }
4179
+ }
4180
+ @media (min-width: 62rem) {
4181
+ .pf-v6-c-form.pf-m-horizontal-on-lg {
4182
+ --pf-v6-c-form__group-label--PaddingBlockEnd: 0;
4183
+ }
4184
+ .pf-v6-c-form.pf-m-horizontal-on-lg .pf-v6-c-form__group {
4185
+ display: grid;
4186
+ grid-template-columns: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnWidth) var(--pf-v6-c-form--m-horizontal__group-control--md--GridColumnWidth);
4187
+ grid-column-gap: var(--pf-v6-c-form--m-horizontal__group-label--md--GridColumnGap);
3949
4188
  }
3950
4189
  .pf-v6-c-form.pf-m-horizontal-on-lg .pf-v6-c-form__group-label {
3951
4190
  padding-block-start: var(--pf-v6-c-form--m-horizontal__group-label--md--PaddingBlockStart);
@@ -4297,245 +4536,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4297
4536
  margin-block-end: var(--pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd);
4298
4537
  }
4299
4538
 
4300
- .pf-v6-c-inline-edit {
4301
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
4302
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4303
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
4304
- --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
4305
- --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
4306
- --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
4307
- }
4308
-
4309
- .pf-v6-c-inline-edit__group {
4310
- display: flex;
4311
- align-items: baseline;
4312
- }
4313
-
4314
- .pf-v6-c-inline-edit__group > * {
4315
- margin-inline-end: var(--pf-v6-c-inline-edit__group--item--MarginInlineEnd);
4316
- }
4317
-
4318
- .pf-v6-c-inline-edit__group.pf-m-icon-group {
4319
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd);
4320
- }
4321
-
4322
- .pf-v6-c-inline-edit__group.pf-m-footer {
4323
- margin-block-start: var(--pf-v6-c-inline-edit__group--m-footer--MarginBlockStart);
4324
- }
4325
-
4326
- .pf-v6-c-inline-edit__group.pf-m-column {
4327
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
4328
- flex-direction: column;
4329
- }
4330
-
4331
- .pf-v6-c-inline-edit__group > :last-child {
4332
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
4333
- }
4334
-
4335
- .pf-v6-c-inline-edit__input {
4336
- flex: 1;
4337
- }
4338
-
4339
- .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain {
4340
- --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color);
4341
- }
4342
-
4343
- .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain:hover {
4344
- --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color);
4345
- }
4346
-
4347
- .pf-v6-c-inline-edit__input,
4348
- .pf-v6-c-inline-edit__action,
4349
- .pf-v6-c-inline-edit__group.pf-m-action-group {
4350
- display: none;
4351
- }
4352
-
4353
- .pf-v6-c-inline-edit__action.pf-m-enable-editable {
4354
- display: inline-block;
4355
- }
4356
-
4357
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__input,
4358
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__input {
4359
- display: block;
4360
- }
4361
-
4362
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action,
4363
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action {
4364
- display: inline-block;
4365
- }
4366
-
4367
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group,
4368
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group {
4369
- display: inline-flex;
4370
- }
4371
-
4372
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__value,
4373
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable,
4374
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__value,
4375
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable {
4376
- display: none;
4377
- }
4378
-
4379
- .pf-v6-c-inline-edit__label + .pf-v6-c-inline-edit__action.pf-m-enable > .pf-v6-c-button {
4380
- margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
4381
- margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
4382
- }
4383
-
4384
- .pf-v6-c-inline-edit__label.pf-m-bold {
4385
- font-weight: var(--pf-v6-c-inline-edit__label--m-bold--FontWeight);
4386
- }
4387
-
4388
- .pf-v6-c-inline-edit__editable-text br {
4389
- display: none;
4390
- }
4391
-
4392
- .pf-v6-u-screen-reader {
4393
- position: fixed;
4394
- inset-block-start: 0;
4395
- inset-inline-start: 0;
4396
- overflow: hidden;
4397
- clip: rect(0, 0, 0, 0);
4398
- white-space: nowrap;
4399
- border: 0;
4400
- }
4401
-
4402
- .pf-v6-u-visible {
4403
- position: static;
4404
- overflow: visible;
4405
- clip: auto;
4406
- white-space: normal;
4407
- border: inherit;
4408
- }
4409
-
4410
- .pf-v6-u-hidden {
4411
- display: none !important;
4412
- }
4413
-
4414
- @media screen and (min-width: 36rem) {
4415
- .pf-v6-u-screen-reader-on-sm {
4416
- position: fixed;
4417
- inset-block-start: 0;
4418
- inset-inline-start: 0;
4419
- overflow: hidden;
4420
- clip: rect(0, 0, 0, 0);
4421
- white-space: nowrap;
4422
- border: 0;
4423
- }
4424
- }
4425
- @media screen and (min-width: 36rem) {
4426
- .pf-v6-u-visible-on-sm {
4427
- position: static;
4428
- overflow: visible;
4429
- clip: auto;
4430
- white-space: normal;
4431
- border: inherit;
4432
- }
4433
- }
4434
- @media screen and (min-width: 36rem) {
4435
- .pf-v6-u-hidden-on-sm {
4436
- display: none !important;
4437
- }
4438
- }
4439
- @media screen and (min-width: 48rem) {
4440
- .pf-v6-u-screen-reader-on-md {
4441
- position: fixed;
4442
- inset-block-start: 0;
4443
- inset-inline-start: 0;
4444
- overflow: hidden;
4445
- clip: rect(0, 0, 0, 0);
4446
- white-space: nowrap;
4447
- border: 0;
4448
- }
4449
- }
4450
- @media screen and (min-width: 48rem) {
4451
- .pf-v6-u-visible-on-md {
4452
- position: static;
4453
- overflow: visible;
4454
- clip: auto;
4455
- white-space: normal;
4456
- border: inherit;
4457
- }
4458
- }
4459
- @media screen and (min-width: 48rem) {
4460
- .pf-v6-u-hidden-on-md {
4461
- display: none !important;
4462
- }
4463
- }
4464
- @media screen and (min-width: 62rem) {
4465
- .pf-v6-u-screen-reader-on-lg {
4466
- position: fixed;
4467
- inset-block-start: 0;
4468
- inset-inline-start: 0;
4469
- overflow: hidden;
4470
- clip: rect(0, 0, 0, 0);
4471
- white-space: nowrap;
4472
- border: 0;
4473
- }
4474
- }
4475
- @media screen and (min-width: 62rem) {
4476
- .pf-v6-u-visible-on-lg {
4477
- position: static;
4478
- overflow: visible;
4479
- clip: auto;
4480
- white-space: normal;
4481
- border: inherit;
4482
- }
4483
- }
4484
- @media screen and (min-width: 62rem) {
4485
- .pf-v6-u-hidden-on-lg {
4486
- display: none !important;
4487
- }
4488
- }
4489
- @media screen and (min-width: 75rem) {
4490
- .pf-v6-u-screen-reader-on-xl {
4491
- position: fixed;
4492
- inset-block-start: 0;
4493
- inset-inline-start: 0;
4494
- overflow: hidden;
4495
- clip: rect(0, 0, 0, 0);
4496
- white-space: nowrap;
4497
- border: 0;
4498
- }
4499
- }
4500
- @media screen and (min-width: 75rem) {
4501
- .pf-v6-u-visible-on-xl {
4502
- position: static;
4503
- overflow: visible;
4504
- clip: auto;
4505
- white-space: normal;
4506
- border: inherit;
4507
- }
4508
- }
4509
- @media screen and (min-width: 75rem) {
4510
- .pf-v6-u-hidden-on-xl {
4511
- display: none !important;
4512
- }
4513
- }
4514
- @media screen and (min-width: 90.625rem) {
4515
- .pf-v6-u-screen-reader-on-2xl {
4516
- position: fixed;
4517
- inset-block-start: 0;
4518
- inset-inline-start: 0;
4519
- overflow: hidden;
4520
- clip: rect(0, 0, 0, 0);
4521
- white-space: nowrap;
4522
- border: 0;
4523
- }
4524
- }
4525
- @media screen and (min-width: 90.625rem) {
4526
- .pf-v6-u-visible-on-2xl {
4527
- position: static;
4528
- overflow: visible;
4529
- clip: auto;
4530
- white-space: normal;
4531
- border: inherit;
4532
- }
4533
- }
4534
- @media screen and (min-width: 90.625rem) {
4535
- .pf-v6-u-hidden-on-2xl {
4536
- display: none !important;
4537
- }
4538
- }
4539
4539
  .pf-v6-c-tooltip {
4540
4540
  --pf-v6-c-tooltip--MaxWidth: 18.75rem;
4541
4541
  --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
@@ -5600,1743 +5600,1818 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5600
5600
  scale: 1.5;
5601
5601
  }
5602
5602
  }
5603
- .pf-v6-c-action-list {
5604
- --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
5605
- --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default);
5606
- --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
5607
- --pf-v6-c-action-list--m-vertical--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
5608
- --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
5609
- --pf-v6-c-action-list--m-vertical--m-icons--RowGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
5603
+ .pf-v6-c-check {
5604
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
5605
+ --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
5606
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
5607
+ --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
5608
+ --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
5609
+ --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
5610
+ --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
5611
+ --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
5612
+ --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
5613
+ --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
5614
+ --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
5615
+ --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
5616
+ --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
5617
+ --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
5610
5618
  }
5611
5619
 
5612
- .pf-v6-c-action-list,
5613
- .pf-v6-c-action-list__group {
5614
- display: flex;
5615
- align-items: start;
5620
+ .pf-v6-c-check {
5621
+ display: grid;
5622
+ grid-template-columns: auto 1fr;
5623
+ grid-gap: var(--pf-v6-c-check--GridGap);
5624
+ accent-color: var(--pf-v6-c-check--AccentColor);
5616
5625
  }
5617
5626
 
5618
- .pf-v6-c-action-list {
5619
- row-gap: var(--pf-v6-c-action-list--RowGap);
5620
- column-gap: var(--pf-v6-c-action-list--ColumnGap);
5627
+ .pf-v6-c-check.pf-m-standalone {
5628
+ display: inline-grid;
5629
+ grid-template-columns: auto;
5630
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
5621
5631
  }
5622
5632
 
5623
- .pf-v6-c-action-list.pf-m-icons {
5624
- --pf-v6-c-action-list__group--ColumnGap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
5625
- --pf-v6-c-action-list--m-vertical--RowGap: var(--pf-v6-c-action-list--m-vertical--m-icons--RowGap);
5626
- column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
5633
+ .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
5634
+ align-self: center;
5635
+ transform: none;
5627
5636
  }
5628
5637
 
5629
- .pf-v6-c-action-list.pf-m-vertical, .pf-v6-c-action-list.pf-m-vertical .pf-v6-c-action-list__group {
5630
- flex-direction: column;
5638
+ .pf-v6-c-check__input {
5639
+ align-self: start;
5640
+ font-size: var(--pf-v6-c-check__label--FontSize);
5641
+ line-height: var(--pf-v6-c-check__label--LineHeight);
5642
+ transform: translateY(var(--pf-v6-c-check__input--TranslateY));
5631
5643
  }
5632
5644
 
5633
- .pf-v6-c-action-list.pf-m-vertical {
5634
- row-gap: var(--pf-v6-c-action-list--m-vertical--RowGap);
5645
+ .pf-v6-c-check__label {
5646
+ font-size: var(--pf-v6-c-check__label--FontSize);
5647
+ font-weight: var(--pf-v6-c-check__label--FontWeight);
5648
+ line-height: var(--pf-v6-c-check__label--LineHeight);
5649
+ color: var(--pf-v6-c-check__label--Color);
5635
5650
  }
5636
5651
 
5637
- .pf-v6-c-action-list__group {
5638
- row-gap: var(--pf-v6-c-action-list__group--RowGap, var(--pf-v6-c-action-list--RowGap));
5639
- column-gap: var(--pf-v6-c-action-list__group--ColumnGap);
5652
+ .pf-v6-c-check__description {
5653
+ grid-column: 2;
5654
+ font-size: var(--pf-v6-c-check__description--FontSize);
5655
+ color: var(--pf-v6-c-check__description--Color);
5640
5656
  }
5641
5657
 
5642
- .pf-v6-c-action-list__group.pf-m-icons {
5643
- column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
5658
+ .pf-v6-c-check__body {
5659
+ grid-column: 2;
5644
5660
  }
5645
5661
 
5646
- .pf-v6-c-divider {
5647
- --pf-v6-c-divider--Display: flex;
5648
- --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
5649
- --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
5650
- --pf-v6-c-divider--before--FlexBasis: 100%;
5662
+ .pf-v6-c-check__label,
5663
+ .pf-v6-c-check__input {
5664
+ justify-self: start;
5651
5665
  }
5652
5666
 
5653
- .pf-v6-c-divider {
5654
- flex-direction: row;
5655
- width: 100%;
5656
- height: var(--pf-v6-c-divider--Size);
5657
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
5658
- --pf-v6-hidden-visible--hidden--Display: none;
5659
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5660
- display: var(--pf-v6-hidden-visible--Display);
5661
- flex-shrink: 0;
5662
- align-items: stretch;
5663
- align-self: stretch;
5664
- justify-content: center;
5665
- border: 0;
5667
+ label.pf-v6-c-check, .pf-v6-c-check__label,
5668
+ .pf-v6-c-check__input {
5669
+ cursor: pointer;
5666
5670
  }
5667
5671
 
5668
- .pf-v6-c-divider.pf-m-hidden {
5669
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5672
+ .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
5673
+ .pf-v6-c-check__input:disabled,
5674
+ .pf-v6-c-check__input.pf-m-disabled {
5675
+ --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
5676
+ cursor: not-allowed;
5670
5677
  }
5671
5678
 
5672
- @media screen and (min-width: 36rem) {
5673
- .pf-v6-c-divider.pf-m-hidden-on-sm {
5674
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5675
- }
5676
- .pf-v6-c-divider.pf-m-visible-on-sm {
5677
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5678
- }
5679
- }
5680
- @media screen and (min-width: 48rem) {
5681
- .pf-v6-c-divider.pf-m-hidden-on-md {
5682
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5683
- }
5684
- .pf-v6-c-divider.pf-m-visible-on-md {
5685
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5686
- }
5687
- }
5688
- @media screen and (min-width: 62rem) {
5689
- .pf-v6-c-divider.pf-m-hidden-on-lg {
5690
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5691
- }
5692
- .pf-v6-c-divider.pf-m-visible-on-lg {
5693
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5694
- }
5695
- }
5696
- @media screen and (min-width: 75rem) {
5697
- .pf-v6-c-divider.pf-m-hidden-on-xl {
5698
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5699
- }
5700
- .pf-v6-c-divider.pf-m-visible-on-xl {
5701
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5702
- }
5703
- }
5704
- @media screen and (min-width: 90.625rem) {
5705
- .pf-v6-c-divider.pf-m-hidden-on-2xl {
5706
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5707
- }
5708
- .pf-v6-c-divider.pf-m-visible-on-2xl {
5709
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5710
- }
5679
+ .pf-v6-c-check__label-required {
5680
+ margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
5681
+ font-size: var(--pf-v6-c-check__label-required--FontSize);
5682
+ color: var(--pf-v6-c-check__label-required--Color);
5711
5683
  }
5712
- .pf-v6-c-divider::before {
5713
- flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
5714
- content: "";
5715
- background-color: var(--pf-v6-c-divider--Color);
5716
- border-block-start: var(--pf-v6-c-divider--Size) solid transparent;
5717
- border-inline-start: var(--pf-v6-c-divider--Size) solid transparent;
5684
+
5685
+ .pf-v6-c-menu-toggle {
5686
+ --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5687
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5688
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5689
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
5690
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5691
+ --pf-v6-c-menu-toggle--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5692
+ --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
5693
+ --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
5694
+ --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
5695
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
5696
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
5697
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
5698
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
5699
+ --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
5700
+ --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
5701
+ --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5702
+ --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
5703
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
5704
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5705
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
5706
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
5707
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5708
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
5709
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
5710
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--control--clicked);
5711
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
5712
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5713
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5714
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
5715
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
5716
+ --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
5717
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5718
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
5719
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
5720
+ --pf-v6-c-menu-toggle__icon--TransitionDelay: 0s;
5721
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: 0s;
5722
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: none;
5723
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDelay: 0s;
5724
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: 0s;
5725
+ --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: none;
5726
+ --pf-v6-c-menu-toggle__icon--Rotate: 0deg;
5727
+ --pf-v6-c-menu-toggle--hover__icon--Rotate: 0deg;
5728
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
5729
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5730
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5731
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5732
+ --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
5733
+ --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
5734
+ --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
5735
+ --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
5736
+ --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
5737
+ --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5738
+ --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
5739
+ --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
5740
+ --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5741
+ --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
5742
+ --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
5743
+ --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
5744
+ --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
5745
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
5746
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
5747
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5748
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5749
+ --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
5750
+ --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
5751
+ --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
5752
+ --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
5753
+ --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5754
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
5755
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
5756
+ --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
5757
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
5758
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5759
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
5760
+ --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
5761
+ --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
5762
+ --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5763
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
5764
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
5765
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
5766
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
5767
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5768
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5769
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
5770
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5771
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
5772
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
5773
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
5774
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
5775
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
5776
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
5777
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
5778
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5779
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--alt);
5780
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5781
+ --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
5782
+ --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
5783
+ --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5784
+ --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
5785
+ --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
5786
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
5787
+ --pf-v6-c-menu-toggle__button--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5788
+ --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
5789
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5790
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5791
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5792
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5793
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5794
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5795
+ --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
5796
+ --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5797
+ --pf-v6-c-menu-toggle--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast);
5798
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
5799
+ --pf-v6-c-menu-toggle--m-plain--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
5800
+ --pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
5801
+ --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
5802
+ --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5803
+ --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5804
+ --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
5805
+ --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5806
+ --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
5807
+ --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
5808
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5809
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5810
+ --pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
5811
+ --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
5812
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
5813
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
5814
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5815
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5816
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
5817
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
5818
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
5819
+ --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
5820
+ --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
5821
+ --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
5822
+ --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
5823
+ --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5824
+ --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5825
+ --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
5826
+ --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
5827
+ --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
5828
+ --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
5829
+ --pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
5830
+ --pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
5831
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
5832
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
5833
+ --pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate: 60deg;
5718
5834
  }
5719
5835
 
5720
- .pf-v6-c-divider.pf-m-horizontal {
5721
- flex-direction: row;
5836
+ .pf-v6-c-menu-toggle {
5837
+ position: relative;
5838
+ display: inline-flex;
5839
+ gap: var(--pf-v6-c-menu-toggle--Gap);
5840
+ align-items: center;
5841
+ justify-content: center;
5842
+ min-width: var(--pf-v6-c-menu-toggle--MinWidth);
5843
+ max-width: 100%;
5844
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
5845
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
5846
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
5847
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5848
+ font-size: var(--pf-v6-c-menu-toggle--FontSize);
5849
+ line-height: var(--pf-v6-c-menu-toggle--LineHeight);
5850
+ color: var(--pf-v6-c-menu-toggle--Color);
5851
+ cursor: pointer;
5852
+ background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
5853
+ border: 0;
5854
+ transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
5855
+ transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
5856
+ transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
5857
+ }
5858
+
5859
+ .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
5860
+ border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5861
+ }
5862
+
5863
+ .pf-v6-c-menu-toggle::before {
5864
+ position: absolute;
5865
+ inset-block-start: 0;
5866
+ inset-block-end: 0;
5867
+ inset-inline-start: 0;
5868
+ inset-inline-end: 0;
5869
+ z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
5870
+ pointer-events: none;
5871
+ content: "";
5872
+ border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
5873
+ transition: inherit;
5874
+ }
5875
+
5876
+ .pf-v6-c-menu-toggle.pf-m-primary {
5877
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
5878
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
5879
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
5880
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
5881
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
5882
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
5883
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
5884
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
5885
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
5886
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
5887
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
5888
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
5889
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
5890
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
5891
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
5892
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
5893
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
5894
+ }
5895
+
5896
+ .pf-v6-c-menu-toggle.pf-m-secondary {
5897
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
5898
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
5899
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
5900
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
5901
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
5902
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
5903
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
5904
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
5905
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
5906
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
5907
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
5908
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
5909
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
5910
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
5911
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
5912
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
5913
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
5914
+ }
5915
+
5916
+ .pf-v6-c-menu-toggle.pf-m-full-height {
5917
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
5918
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
5919
+ --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
5920
+ align-items: center;
5921
+ height: 100%;
5922
+ }
5923
+
5924
+ .pf-v6-c-menu-toggle.pf-m-full-width {
5722
5925
  width: 100%;
5723
- height: var(--pf-v6-c-divider--Size);
5724
5926
  }
5725
5927
 
5726
- .pf-v6-c-divider.pf-m-vertical {
5727
- flex-direction: column;
5728
- width: var(--pf-v6-c-divider--Size);
5729
- height: inherit;
5928
+ .pf-v6-c-menu-toggle.pf-m-plain {
5929
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
5930
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
5931
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
5932
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
5933
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
5934
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
5935
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
5936
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
5937
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
5938
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
5939
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
5940
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5941
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5942
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
5943
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
5944
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
5730
5945
  }
5731
5946
 
5732
- .pf-v6-c-divider.pf-m-inset-none {
5733
- --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
5947
+ .pf-v6-c-menu-toggle.pf-m-plain.pf-m-circle {
5948
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius);
5734
5949
  }
5735
5950
 
5736
- .pf-v6-c-divider.pf-m-inset-xs {
5737
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5951
+ .pf-v6-c-menu-toggle.pf-m-plain::before {
5952
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
5953
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
5738
5954
  }
5739
5955
 
5740
- .pf-v6-c-divider.pf-m-inset-sm {
5741
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5956
+ .pf-v6-c-menu-toggle:is(:hover, :focus) {
5957
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
5958
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
5959
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
5960
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--hover--BorderWidth);
5961
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
5962
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
5963
+ --pf-v6-c-menu-toggle__icon--TransitionDelay: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDelay);
5964
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDuration);
5965
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: var(--pf-v6-c-menu-toggle--hover__icon--TransitionProperty);
5966
+ --pf-v6-c-menu-toggle__icon--Rotate: var(--pf-v6-c-menu-toggle--hover__icon--Rotate);
5742
5967
  }
5743
5968
 
5744
- .pf-v6-c-divider.pf-m-inset-md {
5745
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5969
+ .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
5970
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
5971
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
5972
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
5973
+ --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth);
5974
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
5975
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
5746
5976
  }
5747
5977
 
5748
- .pf-v6-c-divider.pf-m-inset-lg {
5749
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5978
+ .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
5979
+ border: 0;
5750
5980
  }
5751
5981
 
5752
- .pf-v6-c-divider.pf-m-inset-xl {
5753
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5982
+ .pf-v6-c-menu-toggle.pf-m-small {
5983
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
5984
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
5985
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
5986
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
5987
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
5988
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
5989
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset);
5990
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset);
5754
5991
  }
5755
5992
 
5756
- .pf-v6-c-divider.pf-m-inset-2xl {
5757
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5993
+ .pf-v6-c-menu-toggle.pf-m-success {
5994
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
5995
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
5758
5996
  }
5759
5997
 
5760
- .pf-v6-c-divider.pf-m-inset-3xl {
5761
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5998
+ .pf-v6-c-menu-toggle.pf-m-warning {
5999
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
6000
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
5762
6001
  }
5763
6002
 
5764
- @media (min-width: 36rem) {
5765
- .pf-v6-c-divider.pf-m-horizontal-on-sm {
5766
- flex-direction: row;
5767
- width: 100%;
5768
- height: var(--pf-v6-c-divider--Size);
5769
- }
6003
+ .pf-v6-c-menu-toggle.pf-m-danger {
6004
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
6005
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
5770
6006
  }
5771
- @media (min-width: 36rem) {
5772
- .pf-v6-c-divider.pf-m-vertical-on-sm {
5773
- flex-direction: column;
5774
- width: var(--pf-v6-c-divider--Size);
5775
- height: inherit;
6007
+
6008
+ @media screen and (prefers-reduced-motion: no-preference) {
6009
+ .pf-v6-c-menu-toggle.pf-m-danger {
6010
+ transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
6011
+ animation-name: pf-v6-c-menu-toggle-m-danger-motion;
6012
+ animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
6013
+ animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
6014
+ animation-fill-mode: both;
5776
6015
  }
5777
6016
  }
5778
- @media (min-width: 36rem) {
5779
- .pf-v6-c-divider.pf-m-inset-none-on-sm {
5780
- --pf-v6-c-divider--before--FlexBasis: 100%;
5781
- }
5782
- .pf-v6-c-divider.pf-m-inset-xs-on-sm {
5783
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5784
- }
5785
- .pf-v6-c-divider.pf-m-inset-sm-on-sm {
5786
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5787
- }
5788
- .pf-v6-c-divider.pf-m-inset-md-on-sm {
5789
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5790
- }
5791
- .pf-v6-c-divider.pf-m-inset-lg-on-sm {
5792
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5793
- }
5794
- .pf-v6-c-divider.pf-m-inset-xl-on-sm {
5795
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5796
- }
5797
- .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
5798
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6017
+ .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
6018
+ animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
6019
+ animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
6020
+ animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
6021
+ }
6022
+
6023
+ @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
6024
+ from {
6025
+ opacity: 0;
5799
6026
  }
5800
- .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
5801
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6027
+ to {
6028
+ opacity: 1;
5802
6029
  }
5803
6030
  }
5804
- @media (min-width: 48rem) {
5805
- .pf-v6-c-divider.pf-m-horizontal-on-md {
5806
- flex-direction: row;
5807
- width: 100%;
5808
- height: var(--pf-v6-c-divider--Size);
5809
- }
6031
+ .pf-v6-c-menu-toggle.pf-m-settings {
6032
+ --pf-v6-c-menu-toggle__icon--TransitionProperty: rotate;
6033
+ --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration);
6034
+ --pf-v6-c-menu-toggle__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction);
6035
+ --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: rotate;
6036
+ --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration);
6037
+ --pf-v6-c-menu-toggle--hover__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction);
6038
+ --pf-v6-c-menu-toggle--hover__icon--Rotate: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate);
5810
6039
  }
5811
- @media (min-width: 48rem) {
5812
- .pf-v6-c-divider.pf-m-vertical-on-md {
5813
- flex-direction: column;
5814
- width: var(--pf-v6-c-divider--Size);
5815
- height: inherit;
5816
- }
6040
+
6041
+ .pf-v6-c-menu-toggle.pf-m-placeholder {
6042
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
5817
6043
  }
5818
- @media (min-width: 48rem) {
5819
- .pf-v6-c-divider.pf-m-inset-none-on-md {
5820
- --pf-v6-c-divider--before--FlexBasis: 100%;
5821
- }
5822
- .pf-v6-c-divider.pf-m-inset-xs-on-md {
5823
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5824
- }
5825
- .pf-v6-c-divider.pf-m-inset-sm-on-md {
5826
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5827
- }
5828
- .pf-v6-c-divider.pf-m-inset-md-on-md {
5829
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5830
- }
5831
- .pf-v6-c-divider.pf-m-inset-lg-on-md {
5832
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5833
- }
5834
- .pf-v6-c-divider.pf-m-inset-xl-on-md {
5835
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5836
- }
5837
- .pf-v6-c-divider.pf-m-inset-2xl-on-md {
5838
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5839
- }
5840
- .pf-v6-c-divider.pf-m-inset-3xl-on-md {
5841
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5842
- }
6044
+
6045
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
6046
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
6047
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
6048
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
6049
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
6050
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
5843
6051
  }
5844
- @media (min-width: 62rem) {
5845
- .pf-v6-c-divider.pf-m-horizontal-on-lg {
5846
- flex-direction: row;
5847
- width: 100%;
5848
- height: var(--pf-v6-c-divider--Size);
5849
- }
6052
+
6053
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
6054
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
6055
+ pointer-events: none;
5850
6056
  }
5851
- @media (min-width: 62rem) {
5852
- .pf-v6-c-divider.pf-m-vertical-on-lg {
5853
- flex-direction: column;
5854
- width: var(--pf-v6-c-divider--Size);
5855
- height: inherit;
5856
- }
6057
+
6058
+ @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
6059
+ syntax: "<length>";
6060
+ inherits: false;
6061
+ initial-value: 0;
5857
6062
  }
5858
- @media (min-width: 62rem) {
5859
- .pf-v6-c-divider.pf-m-inset-none-on-lg {
5860
- --pf-v6-c-divider--before--FlexBasis: 100%;
5861
- }
5862
- .pf-v6-c-divider.pf-m-inset-xs-on-lg {
5863
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5864
- }
5865
- .pf-v6-c-divider.pf-m-inset-sm-on-lg {
5866
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5867
- }
5868
- .pf-v6-c-divider.pf-m-inset-md-on-lg {
5869
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5870
- }
5871
- .pf-v6-c-divider.pf-m-inset-lg-on-lg {
5872
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5873
- }
5874
- .pf-v6-c-divider.pf-m-inset-xl-on-lg {
5875
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5876
- }
5877
- .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
5878
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5879
- }
5880
- .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
5881
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6063
+ @media (prefers-reduced-motion: no-preference) {
6064
+ @keyframes pf-v6-c-menu-toggle-m-danger-motion {
6065
+ 33% {
6066
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
6067
+ }
6068
+ 66% {
6069
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
6070
+ }
5882
6071
  }
5883
6072
  }
5884
- @media (min-width: 75rem) {
5885
- .pf-v6-c-divider.pf-m-horizontal-on-xl {
5886
- flex-direction: row;
5887
- width: 100%;
5888
- height: var(--pf-v6-c-divider--Size);
5889
- }
6073
+ .pf-v6-c-menu-toggle.pf-m-split-button {
6074
+ --pf-v6-c-menu-toggle--Gap: 0;
6075
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
6076
+ padding: 0;
5890
6077
  }
5891
- @media (min-width: 75rem) {
5892
- .pf-v6-c-divider.pf-m-vertical-on-xl {
5893
- flex-direction: column;
5894
- width: var(--pf-v6-c-divider--Size);
5895
- height: inherit;
5896
- }
6078
+
6079
+ .pf-v6-c-menu-toggle.pf-m-split-button > * {
6080
+ position: relative;
6081
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
6082
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
6083
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
6084
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5897
6085
  }
5898
- @media (min-width: 75rem) {
5899
- .pf-v6-c-divider.pf-m-inset-none-on-xl {
5900
- --pf-v6-c-divider--before--FlexBasis: 100%;
5901
- }
5902
- .pf-v6-c-divider.pf-m-inset-xs-on-xl {
5903
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5904
- }
5905
- .pf-v6-c-divider.pf-m-inset-sm-on-xl {
5906
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5907
- }
5908
- .pf-v6-c-divider.pf-m-inset-md-on-xl {
5909
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5910
- }
5911
- .pf-v6-c-divider.pf-m-inset-lg-on-xl {
5912
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5913
- }
5914
- .pf-v6-c-divider.pf-m-inset-xl-on-xl {
5915
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5916
- }
5917
- .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
5918
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5919
- }
5920
- .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
5921
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5922
- }
6086
+
6087
+ .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
6088
+ border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6089
+ border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5923
6090
  }
5924
- @media (min-width: 90.625rem) {
5925
- .pf-v6-c-divider.pf-m-horizontal-on-2xl {
5926
- flex-direction: row;
5927
- width: 100%;
5928
- height: var(--pf-v6-c-divider--Size);
5929
- }
6091
+
6092
+ .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
6093
+ border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6094
+ border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5930
6095
  }
5931
- @media (min-width: 90.625rem) {
5932
- .pf-v6-c-divider.pf-m-vertical-on-2xl {
5933
- flex-direction: column;
5934
- width: var(--pf-v6-c-divider--Size);
5935
- height: inherit;
5936
- }
6096
+
6097
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
6098
+ --pf-v6-c-check__label--Color: currentcolor;
6099
+ --pf-v6-c-check__label--disabled--Color: currentcolor;
6100
+ align-items: center;
6101
+ align-self: stretch;
5937
6102
  }
5938
- @media (min-width: 90.625rem) {
5939
- .pf-v6-c-divider.pf-m-inset-none-on-2xl {
5940
- --pf-v6-c-divider--before--FlexBasis: 100%;
5941
- }
5942
- .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
5943
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5944
- }
5945
- .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
5946
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5947
- }
5948
- .pf-v6-c-divider.pf-m-inset-md-on-2xl {
5949
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5950
- }
5951
- .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
5952
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5953
- }
5954
- .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
5955
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5956
- }
5957
- .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
5958
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5959
- }
5960
- .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
5961
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5962
- }
6103
+
6104
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
6105
+ --pf-v6-c-check__input--TranslateY: 0;
6106
+ align-self: center;
5963
6107
  }
5964
- .pf-v6-c-popover {
5965
- --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
5966
- --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
5967
- --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
5968
- --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
5969
- --pf-v6-c-popover--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
5970
- --pf-v6-c-popover--BorderColor: var(--pf-t--global--border--color--high-contrast);
5971
- --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
5972
- --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5973
- --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
5974
- --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
5975
- --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
5976
- --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
5977
- --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5978
- --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
5979
- --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
5980
- --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
5981
- --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
5982
- --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
5983
- --pf-v6-c-popover__arrow--Width: 0.9375rem;
5984
- --pf-v6-c-popover__arrow--Height: 0.9375rem;
5985
- --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
5986
- --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5987
- --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
5988
- --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
5989
- --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
5990
- --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
5991
- --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
5992
- --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
5993
- --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
5994
- --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
5995
- --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
5996
- --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
5997
- --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
5998
- --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
5999
- --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
6000
- --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
6001
- --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
6002
- --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
6003
- --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
6004
- --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6005
- --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
6006
- --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
6007
- --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
6008
- --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
6009
- --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
6010
- --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
6011
- --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
6012
- --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
6013
- --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
6108
+
6109
+ .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
6110
+ border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor);
6014
6111
  }
6015
6112
 
6016
- .pf-v6-c-popover {
6017
- position: relative;
6018
- min-width: var(--pf-v6-c-popover--MinWidth);
6019
- max-width: var(--pf-v6-c-popover--MaxWidth);
6020
- font-size: var(--pf-v6-c-popover--FontSize);
6021
- border: var(--pf-v6-c-popover--BorderWidth) solid var(--pf-v6-c-popover--BorderColor);
6022
- border-radius: var(--pf-v6-c-popover--BorderRadius);
6023
- box-shadow: var(--pf-v6-c-popover--BoxShadow);
6113
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
6114
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
6024
6115
  }
6025
6116
 
6026
- .pf-v6-c-popover.pf-m-no-padding {
6027
- --pf-v6-c-popover__content--PaddingBlockStart: 0px;
6028
- --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
6029
- --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
6030
- --pf-v6-c-popover__content--PaddingInlineStart: 0px;
6117
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
6118
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
6119
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
6031
6120
  }
6032
6121
 
6033
- .pf-v6-c-popover.pf-m-width-auto {
6034
- --pf-v6-c-popover--MinWidth: auto;
6035
- --pf-v6-c-popover--MaxWidth: none;
6122
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
6123
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
6124
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor);
6036
6125
  }
6037
6126
 
6038
- .pf-v6-c-popover:is(.pf-m-top,
6039
- .pf-m-top-left,
6040
- .pf-m-top-right) {
6041
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
6042
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
6043
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
6044
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6045
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
6046
- }
6047
-
6048
- .pf-v6-c-popover:is(.pf-m-bottom,
6049
- .pf-m-bottom-left,
6050
- .pf-m-bottom-right) {
6051
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
6052
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
6053
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
6054
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
6055
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
6056
- }
6057
-
6058
- .pf-v6-c-popover:is(.pf-m-left,
6059
- .pf-m-left-top,
6060
- .pf-m-left-bottom) {
6061
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
6062
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
6063
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6064
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
6065
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
6066
- }
6067
-
6068
- .pf-v6-c-popover:is(.pf-m-right,
6069
- .pf-m-right-top,
6070
- .pf-m-right-bottom) {
6071
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
6072
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
6073
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
6074
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
6075
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
6076
- }
6077
-
6078
- .pf-v6-c-popover:is(.pf-m-left-top,
6079
- .pf-m-right-top) {
6080
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
6081
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6082
- }
6083
-
6084
- .pf-v6-c-popover:is(.pf-m-left-bottom,
6085
- .pf-m-right-bottom) {
6086
- --pf-v6-c-popover__arrow--InsetBlockStart: auto;
6087
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
6088
- }
6089
-
6090
- .pf-v6-c-popover:is(.pf-m-top-left,
6091
- .pf-m-bottom-left) {
6092
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
6093
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6094
- }
6095
-
6096
- .pf-v6-c-popover:is(.pf-m-top-right,
6097
- .pf-m-bottom-right) {
6098
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
6099
- --pf-v6-c-popover__arrow--InsetInlineStart: auto;
6100
- }
6101
-
6102
- .pf-v6-c-popover.pf-m-danger {
6103
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
6104
- }
6105
-
6106
- .pf-v6-c-popover.pf-m-warning {
6107
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
6127
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
6128
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor);
6108
6129
  }
6109
6130
 
6110
- .pf-v6-c-popover.pf-m-success {
6111
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
6131
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
6132
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
6112
6133
  }
6113
6134
 
6114
- .pf-v6-c-popover.pf-m-custom {
6115
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
6135
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
6136
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):first-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
6137
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
6138
+ padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
6116
6139
  }
6117
6140
 
6118
- .pf-v6-c-popover.pf-m-info {
6119
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
6141
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
6142
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):last-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
6143
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
6144
+ padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
6120
6145
  }
6121
6146
 
6122
- .pf-v6-c-popover__content {
6123
- position: relative;
6124
- padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
6125
- padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
6126
- padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
6127
- padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6128
- background-color: var(--pf-v6-c-popover__content--BackgroundColor);
6129
- border-radius: var(--pf-v6-c-popover__content--BorderRadius);
6147
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
6148
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
6130
6149
  }
6131
6150
 
6132
- .pf-v6-c-popover__close {
6133
- position: absolute;
6134
- inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
6135
- inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
6151
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
6152
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
6153
+ color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
6154
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
6136
6155
  }
6137
6156
 
6138
- .pf-v6-c-popover__close + * {
6139
- padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
6157
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
6158
+ content: none;
6140
6159
  }
6141
6160
 
6142
- .pf-v6-c-popover__arrow {
6143
- position: absolute;
6144
- top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
6145
- right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
6146
- bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
6147
- left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
6148
- width: var(--pf-v6-c-popover__arrow--Width);
6149
- height: var(--pf-v6-c-popover__arrow--Height);
6150
- pointer-events: none;
6151
- background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
6152
- border: var(--pf-v6-c-popover--BorderWidth) solid var(--pf-v6-c-popover--BorderColor);
6153
- box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
6154
- transform: translateX(var(--pf-v6-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-popover__arrow--Rotate, 0));
6161
+ .pf-v6-c-menu-toggle.pf-m-typeahead {
6162
+ --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
6163
+ --pf-v6-c-menu-toggle--Gap: 0;
6164
+ align-items: stretch;
6165
+ padding: 0;
6155
6166
  }
6156
6167
 
6157
- .pf-v6-c-popover__header {
6158
- margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
6168
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
6169
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
6159
6170
  }
6160
6171
 
6161
- .pf-v6-c-popover__title {
6172
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
6173
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
6162
6174
  display: flex;
6163
- flex: 0 0 auto;
6164
- }
6165
-
6166
- .pf-v6-c-popover__title-icon {
6167
- margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
6168
- font-size: var(--pf-v6-c-popover__title-icon--FontSize);
6169
- color: var(--pf-v6-c-popover__title-icon--Color);
6170
- }
6171
-
6172
- .pf-v6-c-popover__title-text {
6173
- min-width: 0;
6174
- font-size: var(--pf-v6-c-popover__title-text--FontSize);
6175
- font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
6176
- color: var(--pf-v6-c-popover__title-text--Color);
6177
- overflow-wrap: break-word;
6175
+ align-items: stretch;
6178
6176
  }
6179
6177
 
6180
- .pf-v6-c-popover__body {
6181
- word-wrap: break-word;
6178
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
6179
+ --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
6180
+ flex: 1;
6182
6181
  }
6183
6182
 
6184
- .pf-v6-c-popover__footer {
6185
- margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
6183
+ .pf-v6-c-menu-toggle__button {
6184
+ gap: var(--pf-v6-c-menu-toggle__button--Gap);
6185
+ align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
6186
+ min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
6187
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
6188
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
6189
+ color: inherit;
6190
+ background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
6191
+ border: 0;
6186
6192
  }
6187
6193
 
6188
- .pf-v6-c-check {
6189
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
6190
- --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
6191
- --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
6192
- --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
6193
- --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
6194
- --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
6195
- --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
6196
- --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
6197
- --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
6198
- --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
6199
- --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
6200
- --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
6201
- --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
6202
- --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
6194
+ .pf-v6-c-menu-toggle__button.pf-m-text {
6195
+ display: inline-flex;
6196
+ align-items: baseline;
6203
6197
  }
6204
6198
 
6205
- .pf-v6-c-check {
6206
- display: grid;
6207
- grid-template-columns: auto 1fr;
6208
- grid-gap: var(--pf-v6-c-check--GridGap);
6209
- accent-color: var(--pf-v6-c-check--AccentColor);
6199
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check.pf-m-standalone, .pf-v6-c-menu-toggle__button:has(> .pf-v6-c-menu-toggle__controls:only-child) {
6200
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
6201
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
6210
6202
  }
6211
6203
 
6212
- .pf-v6-c-check.pf-m-standalone {
6213
- display: inline-grid;
6214
- grid-template-columns: auto;
6215
- min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
6204
+ .pf-v6-c-menu-toggle__text {
6205
+ overflow: hidden;
6206
+ text-overflow: ellipsis;
6207
+ white-space: nowrap;
6208
+ min-width: 0;
6216
6209
  }
6217
6210
 
6218
- .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
6219
- align-self: center;
6220
- transform: none;
6211
+ .pf-v6-c-menu-toggle__count {
6212
+ display: flex;
6213
+ flex-wrap: nowrap;
6221
6214
  }
6222
6215
 
6223
- .pf-v6-c-check__input {
6224
- align-self: start;
6225
- font-size: var(--pf-v6-c-check__label--FontSize);
6226
- line-height: var(--pf-v6-c-check__label--LineHeight);
6227
- transform: translateY(var(--pf-v6-c-check__input--TranslateY));
6216
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
6217
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
6218
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar svg, .pf-v6-c-menu-toggle:not(.pf-m-plain) .pf-v6-c-menu-toggle__icon {
6219
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
6220
+ margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
6228
6221
  }
6229
6222
 
6230
- .pf-v6-c-check__label {
6231
- font-size: var(--pf-v6-c-check__label--FontSize);
6232
- font-weight: var(--pf-v6-c-check__label--FontWeight);
6233
- line-height: var(--pf-v6-c-check__label--LineHeight);
6234
- color: var(--pf-v6-c-check__label--Color);
6223
+ .pf-v6-c-menu-toggle__icon {
6224
+ flex-shrink: 0;
6225
+ transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
6226
+ transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
6227
+ transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
6228
+ rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
6235
6229
  }
6236
6230
 
6237
- .pf-v6-c-check__description {
6238
- grid-column: 2;
6239
- font-size: var(--pf-v6-c-check__description--FontSize);
6240
- color: var(--pf-v6-c-check__description--Color);
6231
+ .pf-v6-c-menu-toggle__icon :where(picture, img) {
6232
+ vertical-align: middle;
6241
6233
  }
6242
6234
 
6243
- .pf-v6-c-check__body {
6244
- grid-column: 2;
6235
+ .pf-v6-c-menu-toggle__controls {
6236
+ display: flex;
6237
+ gap: var(--pf-v6-c-menu-toggle__controls--Gap);
6238
+ align-items: center;
6239
+ justify-content: center;
6240
+ margin-inline-start: auto;
6245
6241
  }
6246
6242
 
6247
- .pf-v6-c-check__label,
6248
- .pf-v6-c-check__input {
6249
- justify-self: start;
6243
+ .pf-v6-c-menu-toggle__toggle-icon {
6244
+ min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
6245
+ color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
6250
6246
  }
6251
6247
 
6252
- label.pf-v6-c-check, .pf-v6-c-check__label,
6253
- .pf-v6-c-check__input {
6254
- cursor: pointer;
6248
+ .pf-v6-c-menu-toggle__status-icon {
6249
+ color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
6255
6250
  }
6256
6251
 
6257
- .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
6258
- .pf-v6-c-check__input:disabled,
6259
- .pf-v6-c-check__input.pf-m-disabled {
6260
- --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
6261
- cursor: not-allowed;
6262
- }
6263
-
6264
- .pf-v6-c-check__label-required {
6265
- margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
6266
- font-size: var(--pf-v6-c-check__label-required--FontSize);
6267
- color: var(--pf-v6-c-check__label-required--Color);
6268
- }
6269
-
6270
- .pf-v6-c-radio {
6271
- --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
6272
- --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
6273
- --pf-v6-c-radio--m-standalone--MinHeight: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
6274
- --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
6275
- --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
6276
- --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body--default);
6277
- --pf-v6-c-radio__label--FontSize: var(--pf-t--global--font--size--body--default);
6278
- --pf-v6-c-radio__label--LineHeight: var(--pf-t--global--font--line-height--body);
6279
- --pf-v6-c-radio__description--FontSize: var(--pf-t--global--font--size--body--sm);
6280
- --pf-v6-c-radio__description--Color: var(--pf-t--global--text--color--subtle);
6281
- --pf-v6-c-radio__input--first-child--MarginInlineStart: 0.0625rem;
6282
- --pf-v6-c-radio__input--last-child--MarginInlineEnd: 0.0625rem;
6283
- --pf-v6-c-radio__body--MarginBlockStart: var(--pf-t--global--spacer--sm);
6284
- --pf-v6-c-radio__input--TranslateY: calc((var(--pf-v6-c-radio__label--LineHeight) * var(--pf-v6-c-radio__label--FontSize) / 2 ) - 50%);
6252
+ .pf-v6-c-form-control {
6253
+ --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
6254
+ --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
6255
+ --pf-v6-c-form-control--FontSize: var(--pf-t--global--font--size--body--default);
6256
+ --pf-v6-c-form-control--LineHeight: var(--pf-t--global--font--line-height--body);
6257
+ --pf-v6-c-form-control--Resize: none;
6258
+ --pf-v6-c-form-control--OutlineOffset: -6px;
6259
+ --pf-v6-c-form-control--BorderRadius: var(--pf-t--global--border--radius--small);
6260
+ --pf-v6-c-form-control--before--BorderWidth: var(--pf-t--global--border--width--control--default);
6261
+ --pf-v6-c-form-control--before--BorderStyle: solid;
6262
+ --pf-v6-c-form-control--before--BorderColor: var(--pf-t--global--border--color--default);
6263
+ --pf-v6-c-form-control--before--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
6264
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6265
+ --pf-v6-c-form-control--after--BorderStyle: solid;
6266
+ --pf-v6-c-form-control--after--BorderColor: transparent;
6267
+ --pf-v6-c-form-control--after--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
6268
+ --pf-v6-c-form-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
6269
+ --pf-v6-c-form-control--Width: 100%;
6270
+ --pf-v6-c-form-control--inset--base: var(--pf-t--global--spacer--control--horizontal--default);
6271
+ --pf-v6-c-form-control--PaddingBlockStart--base: var(--pf-t--global--spacer--control--vertical--default);
6272
+ --pf-v6-c-form-control--PaddingBlockEnd--base: var(--pf-t--global--spacer--control--vertical--default);
6273
+ --pf-v6-c-form-control--PaddingInlineEnd--base: var(--pf-v6-c-form-control--inset--base);
6274
+ --pf-v6-c-form-control--PaddingInlineStart--base: var(--pf-v6-c-form-control--inset--base);
6275
+ --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
6276
+ --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
6277
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6278
+ --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
6279
+ --pf-v6-c-form-control__utilities--input--PaddingInlineEnd: var(--pf-v6-c-form-control__input--PaddingInlineEnd);
6280
+ --pf-v6-c-form-control__utilities--select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--PaddingInlineEnd);
6281
+ --pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd: var(--pf-v6-c-form-control__textarea--PaddingInlineEnd);
6282
+ --pf-v6-c-form-control__input--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
6283
+ --pf-v6-c-form-control__input--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
6284
+ --pf-v6-c-form-control__input--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6285
+ --pf-v6-c-form-control__input--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
6286
+ --pf-v6-c-form-control__select--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
6287
+ --pf-v6-c-form-control__select--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
6288
+ --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6289
+ --pf-v6-c-form-control__select--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
6290
+ --pf-v6-c-form-control__textarea--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
6291
+ --pf-v6-c-form-control__textarea--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
6292
+ --pf-v6-c-form-control__textarea--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6293
+ --pf-v6-c-form-control__textarea--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
6294
+ --pf-v6-c-form-control--hover--after--BorderWidth: var(--pf-t--global--border--width--control--hover);
6295
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-t--global--border--color--hover);
6296
+ --pf-v6-c-form-control--m-success--hover--after--BorderColor: var(--pf-t--global--border--color--status--success--hover);
6297
+ --pf-v6-c-form-control--m-warning--hover--after--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
6298
+ --pf-v6-c-form-control--m-error--hover--after--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
6299
+ --pf-v6-c-form-control--m-expanded--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
6300
+ --pf-v6-c-form-control--m-expanded--after--BorderColor: var(--pf-t--global--border--color--clicked);
6301
+ --pf-v6-c-form-control--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
6302
+ --pf-v6-c-form-control--m-placeholder--child--Color: var(--pf-t--global--text--color--regular);
6303
+ --pf-v6-c-form-control--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
6304
+ --pf-v6-c-form-control--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
6305
+ --pf-v6-c-form-control--m-disabled--after--BorderColor: transparent;
6306
+ --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-t--global--background--color--control--read-only);
6307
+ --pf-v6-c-form-control--m-readonly--BorderColor: var(--pf-t--global--border--color--control--read-only);
6308
+ --pf-v6-c-form-control--m-readonly--hover--after--BorderColor: revert;
6309
+ --pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor: transparent;
6310
+ --pf-v6-c-form-control--m-readonly--m-plain--BorderColor: transparent;
6311
+ --pf-v6-c-form-control--m-readonly--m-plain--inset--base: 0;
6312
+ --pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset: 0;
6313
+ --pf-v6-c-form-control--icon--width: var(--pf-v6-c-form-control--FontSize);
6314
+ --pf-v6-c-form-control--m-success--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6315
+ --pf-v6-c-form-control--m-success--after--BorderColor: var(--pf-t--global--border--color--status--success--default);
6316
+ --pf-v6-c-form-control--m-success--PaddingInlineEnd: initial;
6317
+ --pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd: initial;
6318
+ --pf-v6-c-form-control__input--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
6319
+ --pf-v6-c-form-control__select--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
6320
+ --pf-v6-c-form-control__textarea--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
6321
+ --pf-v6-c-form-control--m-warning--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6322
+ --pf-v6-c-form-control--m-warning--after--BorderColor: var(--pf-t--global--border--color--status--warning--default);
6323
+ --pf-v6-c-form-control--m-warning--PaddingInlineEnd: initial;
6324
+ --pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd: initial;
6325
+ --pf-v6-c-form-control__input--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
6326
+ --pf-v6-c-form-control__select--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
6327
+ --pf-v6-c-form-control__textarea--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
6328
+ --pf-v6-c-form-control--m-error--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6329
+ --pf-v6-c-form-control--m-error--after--BorderColor: var(--pf-t--global--border--color--status--danger--default);
6330
+ --pf-v6-c-form-control--m-error--PaddingInlineEnd: initial;
6331
+ --pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd: initial;
6332
+ --pf-v6-c-form-control--m-error--icon--width: var(--pf-v6-c-form-control--FontSize);
6333
+ --pf-v6-c-form-control__input--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
6334
+ --pf-v6-c-form-control__select--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
6335
+ --pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
6336
+ --pf-v6-c-form-control--m-icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
6337
+ --pf-v6-c-form-control--m-icon--icon--width: var(--pf-v6-c-form-control--FontSize);
6338
+ --pf-v6-c-form-control--m-icon--icon--spacer: calc(var(--pf-t--global--spacer--control--horizontal--default) / 2);
6339
+ --pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--icon--width) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
6340
+ --pf-v6-c-form-control--textarea--Width: var(--pf-v6-c-form-control--Width);
6341
+ --pf-v6-c-form-control--textarea--Height: auto;
6342
+ --pf-v6-c-form-control--textarea--PaddingBlockStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
6343
+ --pf-v6-c-form-control--textarea--PaddingBlockEnd--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
6344
+ --pf-v6-c-form-control--textarea--PaddingInlineEnd--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
6345
+ --pf-v6-c-form-control--textarea--PaddingInlineStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
6346
+ --pf-v6-c-form-control__icon--Color: var(--pf-t--global--icon--color--regular);
6347
+ --pf-v6-c-form-control__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
6348
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
6349
+ --pf-v6-c-form-control--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
6350
+ --pf-v6-c-form-control--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
6351
+ --pf-v6-c-form-control--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
6352
+ --pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
6353
+ --pf-v6-c-form-control__utilities--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart);
6354
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6355
+ --pf-v6-c-form-control__utilities--textarea--PaddingBlockStart: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
6356
+ --pf-v6-c-form-control__toggle-icon--PaddingInlineStart: 0;
6357
+ --pf-v6-c-form-control__toggle-icon--PaddingInlineEnd: 0;
6358
+ --pf-v6-c-form-control__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
6359
+ --pf-v6-c-form-control__toggle-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
6360
+ --pf-v6-c-form-control--m-disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
6285
6361
  }
6286
6362
 
6287
- .pf-v6-c-radio {
6363
+ .pf-v6-c-form-control {
6364
+ position: relative;
6288
6365
  display: grid;
6289
- grid-template-columns: auto 1fr;
6290
- grid-gap: var(--pf-v6-c-radio--GridGap);
6291
- align-items: baseline;
6292
- accent-color: var(--pf-v6-c-radio--AccentColor);
6293
- }
6294
-
6295
- .pf-v6-c-radio.pf-m-standalone {
6296
- display: inline-grid;
6297
- grid-template-columns: auto;
6298
- min-height: var(--pf-v6-c-radio--m-standalone--MinHeight);
6299
- }
6300
-
6301
- .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
6302
- align-self: center;
6303
- transform: none;
6304
- }
6305
-
6306
- .pf-v6-c-radio__input {
6307
- align-self: start;
6308
- font-size: var(--pf-v6-c-radio__label--FontSize);
6309
- line-height: var(--pf-v6-c-radio__label--LineHeight);
6310
- transform: translateY(var(--pf-v6-c-radio__input--TranslateY));
6311
- }
6312
-
6313
- .pf-v6-c-radio__input:first-child {
6314
- margin-inline-start: var(--pf-v6-c-radio__input--first-child--MarginInlineStart);
6315
- }
6316
-
6317
- .pf-v6-c-radio__input:last-child {
6318
- margin-inline-end: var(--pf-v6-c-radio__input--last-child--MarginInlineEnd);
6319
- }
6320
-
6321
- .pf-v6-c-radio__label {
6322
- font-size: var(--pf-v6-c-radio__label--FontSize);
6323
- font-weight: var(--pf-v6-c-radio__label--FontWeight);
6324
- line-height: var(--pf-v6-c-radio__label--LineHeight);
6325
- color: var(--pf-v6-c-radio__label--Color);
6366
+ grid-template-columns: 1fr auto;
6367
+ column-gap: var(--pf-v6-c-form-control--ColumnGap);
6368
+ align-items: start;
6369
+ width: var(--pf-v6-c-form-control--Width);
6370
+ font-size: var(--pf-v6-c-form-control--FontSize);
6371
+ line-height: var(--pf-v6-c-form-control--LineHeight);
6372
+ resize: var(--pf-v6-c-form-control--Resize);
6373
+ background-color: var(--pf-v6-c-form-control--BackgroundColor);
6374
+ border-radius: var(--pf-v6-c-form-control--BorderRadius);
6326
6375
  }
6327
6376
 
6328
- .pf-v6-c-radio__description {
6329
- grid-column: 2;
6330
- font-size: var(--pf-v6-c-radio__description--FontSize);
6331
- color: var(--pf-v6-c-radio__description--Color);
6377
+ .pf-v6-c-form-control::before, .pf-v6-c-form-control::after {
6378
+ position: absolute;
6379
+ inset: 0;
6380
+ pointer-events: none;
6381
+ content: "";
6332
6382
  }
6333
6383
 
6334
- .pf-v6-c-radio__body {
6335
- grid-column: 2;
6336
- margin-block-start: var(--pf-v6-c-radio__body--MarginBlockStart);
6384
+ .pf-v6-c-form-control::before {
6385
+ border-color: var(--pf-v6-c-form-control--before--BorderColor);
6386
+ border-style: var(--pf-v6-c-form-control--before--BorderStyle);
6387
+ border-width: var(--pf-v6-c-form-control--before--BorderWidth);
6388
+ border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
6337
6389
  }
6338
6390
 
6339
- .pf-v6-c-radio__label,
6340
- .pf-v6-c-radio__input {
6341
- justify-self: start;
6391
+ .pf-v6-c-form-control::after {
6392
+ border: var(--pf-v6-c-form-control--after--BorderWidth) var(--pf-v6-c-form-control--after--BorderStyle) var(--pf-v6-c-form-control--after--BorderColor);
6393
+ border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
6342
6394
  }
6343
6395
 
6344
- label.pf-v6-c-radio, .pf-v6-c-radio__label,
6345
- .pf-v6-c-radio__input {
6346
- cursor: pointer;
6396
+ .pf-v6-c-form-control > :is(input, select, textarea) {
6397
+ grid-row: 1/2;
6398
+ grid-column: 1/-1;
6399
+ padding-block-start: var(--pf-v6-c-form-control--PaddingBlockStart);
6400
+ padding-block-end: var(--pf-v6-c-form-control--PaddingBlockEnd);
6401
+ padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
6402
+ padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
6403
+ color: var(--pf-v6-c-form-control--Color);
6404
+ appearance: none;
6405
+ background-color: transparent;
6406
+ border: none;
6407
+ border-radius: var(--pf-v6-c-form-control--BorderRadius);
6408
+ outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
6347
6409
  }
6348
6410
 
6349
- .pf-v6-c-radio__label:disabled, .pf-v6-c-radio__label.pf-m-disabled,
6350
- .pf-v6-c-radio__input:disabled,
6351
- .pf-v6-c-radio__input.pf-m-disabled {
6352
- --pf-v6-c-radio__label--Color: var(--pf-v6-c-radio__label--disabled--Color);
6353
- cursor: not-allowed;
6411
+ .pf-v6-c-form-control > ::placeholder {
6412
+ color: var(--pf-v6-c-form-control--m-placeholder--Color);
6354
6413
  }
6355
6414
 
6356
- .pf-v6-c-menu-toggle {
6357
- --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
6358
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
6359
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
6360
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
6361
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
6362
- --pf-v6-c-menu-toggle--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
6363
- --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
6364
- --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
6365
- --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
6366
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
6367
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
6368
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
6369
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--control--default);
6370
- --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
6371
- --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
6372
- --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
6373
- --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
6374
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
6375
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
6376
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
6377
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
6378
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
6379
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
6380
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
6381
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--control--clicked);
6382
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
6383
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
6384
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
6385
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
6386
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
6387
- --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
6388
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
6389
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
6390
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
6391
- --pf-v6-c-menu-toggle__icon--TransitionDelay: 0s;
6392
- --pf-v6-c-menu-toggle__icon--TransitionDuration: 0s;
6393
- --pf-v6-c-menu-toggle__icon--TransitionProperty: none;
6394
- --pf-v6-c-menu-toggle--hover__icon--TransitionDelay: 0s;
6395
- --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: 0s;
6396
- --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: none;
6397
- --pf-v6-c-menu-toggle__icon--Rotate: 0deg;
6398
- --pf-v6-c-menu-toggle--hover__icon--Rotate: 0deg;
6399
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
6400
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
6401
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
6402
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
6403
- --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
6404
- --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
6405
- --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
6406
- --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
6407
- --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
6408
- --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
6409
- --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
6410
- --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
6411
- --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
6412
- --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
6413
- --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
6414
- --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
6415
- --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
6416
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
6417
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
6418
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
6419
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
6420
- --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
6421
- --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
6422
- --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
6423
- --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
6424
- --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
6425
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
6426
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
6427
- --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
6428
- --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
6429
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
6430
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
6431
- --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
6432
- --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
6433
- --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
6434
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
6435
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
6436
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
6437
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
6438
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
6439
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
6440
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
6441
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
6442
- --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
6443
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
6444
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
6445
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
6446
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
6447
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
6448
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
6449
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
6450
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--alt);
6451
- --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
6452
- --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
6453
- --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
6454
- --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
6455
- --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
6456
- --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
6457
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
6458
- --pf-v6-c-menu-toggle__button--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
6459
- --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
6460
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
6461
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
6462
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
6463
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
6464
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
6465
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
6466
- --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
6467
- --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
6468
- --pf-v6-c-menu-toggle--m-plain--BorderColor: var(--pf-t--global--border--color--high-contrast);
6469
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-t--global--border--width--action--plain--default);
6470
- --pf-v6-c-menu-toggle--m-plain--hover--BorderWidth: var(--pf-t--global--border--width--action--plain--hover);
6471
- --pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth: var(--pf-t--global--border--width--action--plain--clicked);
6472
- --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
6473
- --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
6474
- --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
6475
- --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
6476
- --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
6477
- --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
6478
- --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
6479
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
6480
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
6481
- --pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
6482
- --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
6483
- --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
6484
- --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
6485
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
6486
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
6487
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
6488
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
6489
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
6490
- --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
6491
- --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
6492
- --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
6493
- --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
6494
- --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
6495
- --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
6496
- --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
6497
- --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
6498
- --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
6499
- --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
6500
- --pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
6501
- --pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate);
6502
- --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
6503
- --pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
6504
- --pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate: 60deg;
6415
+ .pf-v6-c-form-control > :is(input, select) {
6416
+ text-overflow: ellipsis;
6505
6417
  }
6506
6418
 
6507
- .pf-v6-c-menu-toggle {
6508
- position: relative;
6509
- display: inline-flex;
6510
- gap: var(--pf-v6-c-menu-toggle--Gap);
6511
- align-items: center;
6512
- justify-content: center;
6513
- min-width: var(--pf-v6-c-menu-toggle--MinWidth);
6514
- max-width: 100%;
6515
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
6516
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
6517
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
6518
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
6519
- font-size: var(--pf-v6-c-menu-toggle--FontSize);
6520
- line-height: var(--pf-v6-c-menu-toggle--LineHeight);
6521
- color: var(--pf-v6-c-menu-toggle--Color);
6522
- cursor: pointer;
6523
- background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
6524
- border: 0;
6525
- transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
6526
- transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
6527
- transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
6419
+ .pf-v6-c-form-control > select {
6420
+ background-color: var(--pf-v6-c-form-control--BackgroundColor);
6528
6421
  }
6529
6422
 
6530
- .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
6531
- border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6423
+ .pf-v6-c-form-control > select * {
6424
+ color: var(--pf-v6-c-form-control--Color);
6532
6425
  }
6533
6426
 
6534
- .pf-v6-c-menu-toggle::before {
6535
- position: absolute;
6536
- inset-block-start: 0;
6537
- inset-block-end: 0;
6538
- inset-inline-start: 0;
6539
- inset-inline-end: 0;
6540
- z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
6541
- pointer-events: none;
6542
- content: "";
6543
- border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
6544
- transition: inherit;
6427
+ .pf-v6-c-form-control:has(input) {
6428
+ --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__input--PaddingBlockStart);
6429
+ --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__input--PaddingBlockEnd);
6430
+ --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__input--PaddingInlineStart);
6431
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control__input--PaddingInlineEnd);
6432
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd);
6545
6433
  }
6546
6434
 
6547
- .pf-v6-c-menu-toggle.pf-m-primary {
6548
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
6549
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
6550
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
6551
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
6552
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
6553
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
6554
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
6555
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
6556
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
6557
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
6558
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
6559
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
6560
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
6561
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
6562
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
6563
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
6564
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
6435
+ .pf-v6-c-form-control.pf-m-textarea {
6436
+ padding-block-start: var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset);
6437
+ padding-block-end: var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset);
6438
+ padding-inline-start: var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset);
6439
+ padding-inline-end: var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset);
6565
6440
  }
6566
6441
 
6567
- .pf-v6-c-menu-toggle.pf-m-secondary {
6568
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
6569
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
6570
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
6571
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
6572
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
6573
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
6574
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
6575
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
6576
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
6577
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
6578
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
6579
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
6580
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
6581
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
6582
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
6583
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
6584
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
6442
+ .pf-v6-c-form-control.pf-m-textarea.pf-m-success, .pf-v6-c-form-control.pf-m-textarea.pf-m-warning, .pf-v6-c-form-control.pf-m-textarea.pf-m-error {
6443
+ --pf-v6-c-form-control--m-status--PaddingInlineEnd--offset: calc(var(--pf-v6-c-form-control__icon--FontSize) + var(--pf-v6-c-form-control--ColumnGap));
6585
6444
  }
6586
6445
 
6587
- .pf-v6-c-menu-toggle.pf-m-full-height {
6588
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
6589
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
6590
- --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
6591
- align-items: center;
6592
- height: 100%;
6446
+ .pf-v6-c-form-control.pf-m-textarea:has(textarea) {
6447
+ --pf-v6-c-form-control--PaddingBlockStart: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
6448
+ --pf-v6-c-form-control--PaddingBlockEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockEnd) - var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset));
6449
+ --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineStart) - var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset));
6450
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineEnd) - var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset) + var(--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset, 0px));
6451
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd);
6593
6452
  }
6594
6453
 
6595
- .pf-v6-c-menu-toggle.pf-m-full-width {
6596
- width: 100%;
6454
+ .pf-v6-c-form-control.pf-m-textarea > textarea {
6455
+ outline-offset: 0;
6456
+ scrollbar-gutter: stable;
6597
6457
  }
6598
6458
 
6599
- .pf-v6-c-menu-toggle.pf-m-plain {
6600
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
6601
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
6602
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
6603
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
6604
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
6605
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
6606
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
6607
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
6608
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
6609
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
6610
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
6611
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
6612
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
6613
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
6614
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
6615
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
6459
+ .pf-v6-c-form-control.pf-m-textarea .pf-v6-c-form-control__utilities {
6460
+ padding-block-start: var(--pf-v6-c-form-control__utilities--textarea--PaddingBlockStart);
6616
6461
  }
6617
6462
 
6618
- .pf-v6-c-menu-toggle.pf-m-plain.pf-m-circle {
6619
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--m-circle--BorderRadius);
6463
+ .pf-v6-c-form-control.pf-m-readonly {
6464
+ --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
6465
+ --pf-v6-c-form-control--before--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
6620
6466
  }
6621
6467
 
6622
- .pf-v6-c-menu-toggle.pf-m-plain::before {
6623
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--BorderWidth);
6624
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
6468
+ .pf-v6-c-form-control.pf-m-readonly:hover {
6469
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
6625
6470
  }
6626
6471
 
6627
- .pf-v6-c-menu-toggle:is(:hover, :focus) {
6628
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
6629
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
6630
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
6631
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--hover--BorderWidth);
6632
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
6633
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
6634
- --pf-v6-c-menu-toggle__icon--TransitionDelay: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDelay);
6635
- --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--hover__icon--TransitionDuration);
6636
- --pf-v6-c-menu-toggle__icon--TransitionProperty: var(--pf-v6-c-menu-toggle--hover__icon--TransitionProperty);
6637
- --pf-v6-c-menu-toggle__icon--Rotate: var(--pf-v6-c-menu-toggle--hover__icon--Rotate);
6472
+ .pf-v6-c-form-control.pf-m-readonly:not(.pf-m-success, .pf-m-warning, .pf-m-error) {
6473
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
6638
6474
  }
6639
6475
 
6640
- .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
6641
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
6642
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
6643
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
6644
- --pf-v6-c-menu-toggle--m-plain--BorderWidth: var(--pf-v6-c-menu-toggle--m-plain--expanded--BorderWidth);
6645
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
6646
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
6476
+ .pf-v6-c-form-control.pf-m-readonly.pf-m-plain {
6477
+ --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor);
6478
+ --pf-v6-c-form-control--m-readonly--BorderColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BorderColor);
6479
+ --pf-v6-c-form-control--inset--base: var(--pf-v6-c-form-control--m-readonly--m-plain--inset--base);
6480
+ --pf-v6-c-form-control--before--BorderStyle: none;
6481
+ --pf-v6-c-form-control--after--BorderStyle: none;
6482
+ --pf-v6-c-form-control--OutlineOffset: var(--pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset);
6647
6483
  }
6648
6484
 
6649
- .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
6650
- border: 0;
6485
+ .pf-v6-c-form-control.pf-m-expanded {
6486
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-expanded--after--BorderColor);
6487
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-expanded--after--BorderWidth);
6651
6488
  }
6652
6489
 
6653
- .pf-v6-c-menu-toggle.pf-m-small {
6654
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
6655
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
6656
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
6657
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
6658
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
6659
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
6660
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset);
6661
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset);
6490
+ .pf-v6-c-form-control.pf-m-disabled {
6491
+ --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-disabled--BackgroundColor);
6492
+ --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-disabled--Color);
6493
+ --pf-v6-c-form-control--m-placeholder--Color: var(--pf-v6-c-form-control--m-disabled--Color);
6494
+ --pf-v6-c-form-control__toggle-icon--Color: var(--pf-v6-c-form-control--m-disabled__toggle-icon--Color);
6495
+ --pf-v6-c-form-control--before--BorderStyle: none;
6496
+ --pf-v6-c-form-control--after--BorderStyle: none;
6497
+ cursor: not-allowed;
6662
6498
  }
6663
6499
 
6664
- .pf-v6-c-menu-toggle.pf-m-success {
6665
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
6666
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
6500
+ .pf-v6-c-form-control.pf-m-error {
6501
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-error--after--BorderColor);
6502
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-error--hover--after--BorderColor);
6503
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
6504
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
6667
6505
  }
6668
6506
 
6669
- .pf-v6-c-menu-toggle.pf-m-warning {
6670
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
6671
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
6507
+ @media (prefers-reduced-motion: no-preference) {
6508
+ .pf-v6-c-form-control.pf-m-error {
6509
+ translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
6510
+ animation-name: pf-v6-global-danger-jiggle-motion;
6511
+ animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
6512
+ animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
6513
+ animation-fill-mode: both;
6514
+ }
6515
+ }
6516
+ .pf-v6-c-form-control.pf-m-error .pf-v6-c-form-control__icon.pf-m-status {
6517
+ --pf-v6-c-form-control--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
6518
+ --pf-v6-c-form-control--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
6519
+ animation-name: pf-v6-global-fade-in;
6520
+ animation-duration: var(--pf-v6-c-form-control--TransitionDuration--Opacity);
6521
+ animation-timing-function: var(--pf-v6-c-form-control--TransitionTimingFunction--Opacity);
6522
+ }
6523
+
6524
+ .pf-v6-c-form-control.pf-m-error > textarea {
6525
+ padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd));
6526
+ }
6527
+
6528
+ .pf-v6-c-form-control.pf-m-error > input {
6529
+ padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-error--PaddingInlineEnd));
6530
+ }
6531
+
6532
+ .pf-v6-c-form-control.pf-m-error > select {
6533
+ padding-inline-end: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-error--PaddingInlineEnd));
6534
+ }
6535
+
6536
+ .pf-v6-c-form-control.pf-m-error.pf-m-icon > :is(input) {
6537
+ padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6538
+ }
6539
+
6540
+ .pf-v6-c-form-control.pf-m-success {
6541
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-success--after--BorderColor);
6542
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-success--hover--after--BorderColor);
6543
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-success__icon--m-status--Color);
6544
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-success--after--BorderWidth);
6545
+ }
6546
+
6547
+ .pf-v6-c-form-control.pf-m-success > textarea {
6548
+ padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-success--PaddingInlineEnd));
6549
+ }
6550
+
6551
+ .pf-v6-c-form-control.pf-m-success > input {
6552
+ padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-success--PaddingInlineEnd));
6553
+ }
6554
+
6555
+ .pf-v6-c-form-control.pf-m-success > select {
6556
+ padding-inline-end: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-success--PaddingInlineEnd));
6557
+ }
6558
+
6559
+ .pf-v6-c-form-control.pf-m-success.pf-m-icon > :is(input) {
6560
+ padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6561
+ }
6562
+
6563
+ .pf-v6-c-form-control.pf-m-warning {
6564
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-warning--after--BorderColor);
6565
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-warning--hover--after--BorderColor);
6566
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-warning__icon--m-status--Color);
6567
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-warning--after--BorderWidth);
6672
6568
  }
6673
6569
 
6674
- .pf-v6-c-menu-toggle.pf-m-danger {
6675
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
6676
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
6570
+ .pf-v6-c-form-control.pf-m-warning > textarea {
6571
+ padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-warning--PaddingInlineEnd));
6677
6572
  }
6678
6573
 
6679
- @media screen and (prefers-reduced-motion: no-preference) {
6680
- .pf-v6-c-menu-toggle.pf-m-danger {
6681
- transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
6682
- animation-name: pf-v6-c-menu-toggle-m-danger-motion;
6683
- animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
6684
- animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
6685
- animation-fill-mode: both;
6686
- }
6574
+ .pf-v6-c-form-control.pf-m-warning > input {
6575
+ padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-warning--PaddingInlineEnd));
6687
6576
  }
6688
- .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
6689
- animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
6690
- animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
6691
- animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
6577
+
6578
+ .pf-v6-c-form-control.pf-m-warning > select {
6579
+ padding-inline-end: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-warning--PaddingInlineEnd));
6692
6580
  }
6693
6581
 
6694
- @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
6695
- from {
6696
- opacity: 0;
6697
- }
6698
- to {
6699
- opacity: 1;
6700
- }
6582
+ .pf-v6-c-form-control.pf-m-warning.pf-m-icon > :is(input) {
6583
+ padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6701
6584
  }
6702
- .pf-v6-c-menu-toggle.pf-m-settings {
6703
- --pf-v6-c-menu-toggle__icon--TransitionProperty: rotate;
6704
- --pf-v6-c-menu-toggle__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionDuration);
6705
- --pf-v6-c-menu-toggle__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings__icon--TransitionTimingFunction);
6706
- --pf-v6-c-menu-toggle--hover__icon--TransitionProperty: rotate;
6707
- --pf-v6-c-menu-toggle--hover__icon--TransitionDuration: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionDuration);
6708
- --pf-v6-c-menu-toggle--hover__icon--TransitionTimingFunction: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--TransitionTimingFunction);
6709
- --pf-v6-c-menu-toggle--hover__icon--Rotate: var(--pf-v6-c-menu-toggle--m-settings--hover__icon--Rotate);
6585
+
6586
+ .pf-v6-c-form-control:hover {
6587
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
6588
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--hover--after--BorderWidth);
6710
6589
  }
6711
6590
 
6712
- .pf-v6-c-menu-toggle.pf-m-placeholder {
6713
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
6591
+ .pf-v6-c-form-control.pf-m-icon {
6592
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
6714
6593
  }
6715
6594
 
6716
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
6717
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
6718
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
6719
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
6720
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
6721
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
6595
+ .pf-v6-c-form-control:has(select) {
6596
+ --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__select--PaddingBlockStart);
6597
+ --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__select--PaddingBlockEnd);
6598
+ --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
6599
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) + var(--pf-v6-c-form-control__icon--FontSize));
6600
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
6722
6601
  }
6723
6602
 
6724
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
6725
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
6726
- pointer-events: none;
6603
+ .pf-v6-c-form-control:has(select) .pf-v6-c-form-control__utilities {
6604
+ padding-inline-end: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
6727
6605
  }
6728
6606
 
6729
- @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
6730
- syntax: "<length>";
6731
- inherits: false;
6732
- initial-value: 0;
6607
+ .pf-v6-c-form-control.pf-m-placeholder > select {
6608
+ --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
6733
6609
  }
6734
- @media (prefers-reduced-motion: no-preference) {
6735
- @keyframes pf-v6-c-menu-toggle-m-danger-motion {
6736
- 33% {
6737
- --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
6738
- }
6739
- 66% {
6740
- --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
6741
- }
6742
- }
6610
+
6611
+ .pf-v6-c-form-control.pf-m-placeholder > select * {
6612
+ color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
6743
6613
  }
6744
- .pf-v6-c-menu-toggle.pf-m-split-button {
6745
- --pf-v6-c-menu-toggle--Gap: 0;
6746
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
6747
- padding: 0;
6614
+
6615
+ .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
6616
+ color: revert;
6748
6617
  }
6749
6618
 
6750
- .pf-v6-c-menu-toggle.pf-m-split-button > * {
6751
- position: relative;
6752
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
6753
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
6754
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
6755
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
6619
+ .pf-v6-c-form-control > textarea {
6620
+ width: 100%;
6621
+ height: 100%;
6622
+ vertical-align: bottom;
6623
+ resize: none;
6756
6624
  }
6757
6625
 
6758
- .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
6759
- border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6760
- border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6626
+ .pf-v6-c-form-control.pf-m-resize-vertical {
6627
+ --pf-v6-c-form-control--Resize: vertical;
6628
+ overflow: auto;
6761
6629
  }
6762
6630
 
6763
- .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
6764
- border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6765
- border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
6631
+ .pf-v6-c-form-control.pf-m-resize-horizontal {
6632
+ --pf-v6-c-form-control--Resize: horizontal;
6633
+ overflow: auto;
6766
6634
  }
6767
6635
 
6768
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
6769
- --pf-v6-c-check__label--Color: currentcolor;
6770
- --pf-v6-c-check__label--disabled--Color: currentcolor;
6771
- align-items: center;
6772
- align-self: stretch;
6636
+ .pf-v6-c-form-control.pf-m-resize-both {
6637
+ --pf-v6-c-form-control--Resize: both;
6638
+ overflow: auto;
6773
6639
  }
6774
6640
 
6775
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
6776
- --pf-v6-c-check__input--TranslateY: 0;
6777
- align-self: center;
6641
+ .pf-v6-c-form-control__icon {
6642
+ font-size: var(--pf-v6-c-form-control__icon--FontSize);
6643
+ color: var(--pf-v6-c-form-control__icon--Color);
6778
6644
  }
6779
6645
 
6780
- .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
6781
- border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor);
6646
+ .pf-v6-c-form-control__icon.pf-m-status {
6647
+ --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
6782
6648
  }
6783
6649
 
6784
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
6785
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
6650
+ .pf-v6-c-form-control__toggle-icon {
6651
+ grid-row: 1/2;
6652
+ grid-column: 3;
6653
+ padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
6654
+ padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
6655
+ font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
6656
+ color: var(--pf-v6-c-form-control__toggle-icon--Color);
6657
+ pointer-events: none;
6786
6658
  }
6787
6659
 
6788
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
6789
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
6790
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
6660
+ .pf-v6-c-form-control__utilities {
6661
+ display: flex;
6662
+ flex-wrap: nowrap;
6663
+ grid-row: 1/2;
6664
+ grid-column: 2;
6665
+ gap: var(--pf-v6-c-form-control__utilities--Gap);
6666
+ padding-block-start: var(--pf-v6-c-form-control__utilities--PaddingBlockStart);
6667
+ padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
6668
+ pointer-events: none;
6791
6669
  }
6792
6670
 
6793
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
6794
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
6795
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor);
6671
+ .pf-v6-c-radio {
6672
+ --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
6673
+ --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
6674
+ --pf-v6-c-radio--m-standalone--MinHeight: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
6675
+ --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
6676
+ --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
6677
+ --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body--default);
6678
+ --pf-v6-c-radio__label--FontSize: var(--pf-t--global--font--size--body--default);
6679
+ --pf-v6-c-radio__label--LineHeight: var(--pf-t--global--font--line-height--body);
6680
+ --pf-v6-c-radio__description--FontSize: var(--pf-t--global--font--size--body--sm);
6681
+ --pf-v6-c-radio__description--Color: var(--pf-t--global--text--color--subtle);
6682
+ --pf-v6-c-radio__input--first-child--MarginInlineStart: 0.0625rem;
6683
+ --pf-v6-c-radio__input--last-child--MarginInlineEnd: 0.0625rem;
6684
+ --pf-v6-c-radio__body--MarginBlockStart: var(--pf-t--global--spacer--sm);
6685
+ --pf-v6-c-radio__input--TranslateY: calc((var(--pf-v6-c-radio__label--LineHeight) * var(--pf-v6-c-radio__label--FontSize) / 2 ) - 50%);
6796
6686
  }
6797
6687
 
6798
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
6799
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor);
6688
+ .pf-v6-c-radio {
6689
+ display: grid;
6690
+ grid-template-columns: auto 1fr;
6691
+ grid-gap: var(--pf-v6-c-radio--GridGap);
6692
+ align-items: baseline;
6693
+ accent-color: var(--pf-v6-c-radio--AccentColor);
6800
6694
  }
6801
6695
 
6802
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
6803
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
6696
+ .pf-v6-c-radio.pf-m-standalone {
6697
+ display: inline-grid;
6698
+ grid-template-columns: auto;
6699
+ min-height: var(--pf-v6-c-radio--m-standalone--MinHeight);
6804
6700
  }
6805
6701
 
6806
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
6807
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):first-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
6808
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
6809
- padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
6702
+ .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
6703
+ align-self: center;
6704
+ transform: none;
6810
6705
  }
6811
6706
 
6812
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
6813
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):last-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
6814
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
6815
- padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
6707
+ .pf-v6-c-radio__input {
6708
+ align-self: start;
6709
+ font-size: var(--pf-v6-c-radio__label--FontSize);
6710
+ line-height: var(--pf-v6-c-radio__label--LineHeight);
6711
+ transform: translateY(var(--pf-v6-c-radio__input--TranslateY));
6816
6712
  }
6817
6713
 
6818
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
6819
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
6714
+ .pf-v6-c-radio__input:first-child {
6715
+ margin-inline-start: var(--pf-v6-c-radio__input--first-child--MarginInlineStart);
6820
6716
  }
6821
6717
 
6822
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
6823
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
6824
- color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
6825
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
6718
+ .pf-v6-c-radio__input:last-child {
6719
+ margin-inline-end: var(--pf-v6-c-radio__input--last-child--MarginInlineEnd);
6826
6720
  }
6827
6721
 
6828
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
6829
- content: none;
6722
+ .pf-v6-c-radio__label {
6723
+ font-size: var(--pf-v6-c-radio__label--FontSize);
6724
+ font-weight: var(--pf-v6-c-radio__label--FontWeight);
6725
+ line-height: var(--pf-v6-c-radio__label--LineHeight);
6726
+ color: var(--pf-v6-c-radio__label--Color);
6830
6727
  }
6831
6728
 
6832
- .pf-v6-c-menu-toggle.pf-m-typeahead {
6833
- --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
6834
- --pf-v6-c-menu-toggle--Gap: 0;
6835
- align-items: stretch;
6836
- padding: 0;
6729
+ .pf-v6-c-radio__description {
6730
+ grid-column: 2;
6731
+ font-size: var(--pf-v6-c-radio__description--FontSize);
6732
+ color: var(--pf-v6-c-radio__description--Color);
6837
6733
  }
6838
6734
 
6839
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
6840
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
6735
+ .pf-v6-c-radio__body {
6736
+ grid-column: 2;
6737
+ margin-block-start: var(--pf-v6-c-radio__body--MarginBlockStart);
6841
6738
  }
6842
6739
 
6843
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
6844
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
6845
- display: flex;
6846
- align-items: stretch;
6740
+ .pf-v6-c-radio__label,
6741
+ .pf-v6-c-radio__input {
6742
+ justify-self: start;
6847
6743
  }
6848
6744
 
6849
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
6850
- --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
6851
- flex: 1;
6745
+ label.pf-v6-c-radio, .pf-v6-c-radio__label,
6746
+ .pf-v6-c-radio__input {
6747
+ cursor: pointer;
6852
6748
  }
6853
6749
 
6854
- .pf-v6-c-menu-toggle__button {
6855
- gap: var(--pf-v6-c-menu-toggle__button--Gap);
6856
- align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
6857
- min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
6858
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
6859
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
6860
- color: inherit;
6861
- background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
6862
- border: 0;
6750
+ .pf-v6-c-radio__label:disabled, .pf-v6-c-radio__label.pf-m-disabled,
6751
+ .pf-v6-c-radio__input:disabled,
6752
+ .pf-v6-c-radio__input.pf-m-disabled {
6753
+ --pf-v6-c-radio__label--Color: var(--pf-v6-c-radio__label--disabled--Color);
6754
+ cursor: not-allowed;
6863
6755
  }
6864
6756
 
6865
- .pf-v6-c-menu-toggle__button.pf-m-text {
6866
- display: inline-flex;
6867
- align-items: baseline;
6757
+ .pf-v6-c-popover {
6758
+ --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
6759
+ --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
6760
+ --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
6761
+ --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
6762
+ --pf-v6-c-popover--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
6763
+ --pf-v6-c-popover--BorderColor: var(--pf-t--global--border--color--high-contrast);
6764
+ --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
6765
+ --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
6766
+ --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
6767
+ --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
6768
+ --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
6769
+ --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
6770
+ --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
6771
+ --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
6772
+ --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
6773
+ --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
6774
+ --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
6775
+ --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
6776
+ --pf-v6-c-popover__arrow--Width: 0.9375rem;
6777
+ --pf-v6-c-popover__arrow--Height: 0.9375rem;
6778
+ --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
6779
+ --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
6780
+ --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
6781
+ --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
6782
+ --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
6783
+ --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
6784
+ --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
6785
+ --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
6786
+ --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
6787
+ --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
6788
+ --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
6789
+ --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
6790
+ --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
6791
+ --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
6792
+ --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
6793
+ --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
6794
+ --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
6795
+ --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
6796
+ --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
6797
+ --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6798
+ --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
6799
+ --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
6800
+ --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
6801
+ --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
6802
+ --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
6803
+ --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
6804
+ --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
6805
+ --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
6806
+ --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
6868
6807
  }
6869
6808
 
6870
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check.pf-m-standalone, .pf-v6-c-menu-toggle__button:has(> .pf-v6-c-menu-toggle__controls:only-child) {
6871
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
6872
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
6809
+ .pf-v6-c-popover {
6810
+ position: relative;
6811
+ min-width: var(--pf-v6-c-popover--MinWidth);
6812
+ max-width: var(--pf-v6-c-popover--MaxWidth);
6813
+ font-size: var(--pf-v6-c-popover--FontSize);
6814
+ border: var(--pf-v6-c-popover--BorderWidth) solid var(--pf-v6-c-popover--BorderColor);
6815
+ border-radius: var(--pf-v6-c-popover--BorderRadius);
6816
+ box-shadow: var(--pf-v6-c-popover--BoxShadow);
6873
6817
  }
6874
6818
 
6875
- .pf-v6-c-menu-toggle__text {
6876
- overflow: hidden;
6877
- text-overflow: ellipsis;
6878
- white-space: nowrap;
6879
- min-width: 0;
6819
+ .pf-v6-c-popover.pf-m-no-padding {
6820
+ --pf-v6-c-popover__content--PaddingBlockStart: 0px;
6821
+ --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
6822
+ --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
6823
+ --pf-v6-c-popover__content--PaddingInlineStart: 0px;
6880
6824
  }
6881
6825
 
6882
- .pf-v6-c-menu-toggle__count {
6883
- display: flex;
6884
- flex-wrap: nowrap;
6826
+ .pf-v6-c-popover.pf-m-width-auto {
6827
+ --pf-v6-c-popover--MinWidth: auto;
6828
+ --pf-v6-c-popover--MaxWidth: none;
6885
6829
  }
6886
6830
 
6887
- .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
6888
- .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
6889
- .pf-v6-c-menu-toggle__icon.pf-m-avatar svg, .pf-v6-c-menu-toggle:not(.pf-m-plain) .pf-v6-c-menu-toggle__icon {
6890
- margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
6891
- margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
6831
+ .pf-v6-c-popover:is(.pf-m-top,
6832
+ .pf-m-top-left,
6833
+ .pf-m-top-right) {
6834
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
6835
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
6836
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
6837
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6838
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
6892
6839
  }
6893
6840
 
6894
- .pf-v6-c-menu-toggle__icon {
6895
- flex-shrink: 0;
6896
- transition-delay: var(--pf-v6-c-menu-toggle__icon--TransitionDelay);
6897
- transition-duration: var(--pf-v6-c-menu-toggle__icon--TransitionDuration);
6898
- transition-property: var(--pf-v6-c-menu-toggle__icon--TransitionProperty);
6899
- rotate: var(--pf-v6-c-menu-toggle__icon--Rotate);
6841
+ .pf-v6-c-popover:is(.pf-m-bottom,
6842
+ .pf-m-bottom-left,
6843
+ .pf-m-bottom-right) {
6844
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
6845
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
6846
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
6847
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
6848
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
6900
6849
  }
6901
6850
 
6902
- .pf-v6-c-menu-toggle__icon :where(picture, img) {
6903
- vertical-align: middle;
6851
+ .pf-v6-c-popover:is(.pf-m-left,
6852
+ .pf-m-left-top,
6853
+ .pf-m-left-bottom) {
6854
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
6855
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
6856
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6857
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
6858
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
6904
6859
  }
6905
6860
 
6906
- .pf-v6-c-menu-toggle__controls {
6907
- display: flex;
6908
- gap: var(--pf-v6-c-menu-toggle__controls--Gap);
6909
- align-items: center;
6910
- justify-content: center;
6911
- margin-inline-start: auto;
6861
+ .pf-v6-c-popover:is(.pf-m-right,
6862
+ .pf-m-right-top,
6863
+ .pf-m-right-bottom) {
6864
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
6865
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
6866
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
6867
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
6868
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
6912
6869
  }
6913
6870
 
6914
- .pf-v6-c-menu-toggle__toggle-icon {
6915
- min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
6916
- color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
6871
+ .pf-v6-c-popover:is(.pf-m-left-top,
6872
+ .pf-m-right-top) {
6873
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
6874
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6917
6875
  }
6918
6876
 
6919
- .pf-v6-c-menu-toggle__status-icon {
6920
- color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
6877
+ .pf-v6-c-popover:is(.pf-m-left-bottom,
6878
+ .pf-m-right-bottom) {
6879
+ --pf-v6-c-popover__arrow--InsetBlockStart: auto;
6880
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
6921
6881
  }
6922
6882
 
6923
- .pf-v6-c-form-control {
6924
- --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
6925
- --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
6926
- --pf-v6-c-form-control--FontSize: var(--pf-t--global--font--size--body--default);
6927
- --pf-v6-c-form-control--LineHeight: var(--pf-t--global--font--line-height--body);
6928
- --pf-v6-c-form-control--Resize: none;
6929
- --pf-v6-c-form-control--OutlineOffset: -6px;
6930
- --pf-v6-c-form-control--BorderRadius: var(--pf-t--global--border--radius--small);
6931
- --pf-v6-c-form-control--before--BorderWidth: var(--pf-t--global--border--width--control--default);
6932
- --pf-v6-c-form-control--before--BorderStyle: solid;
6933
- --pf-v6-c-form-control--before--BorderColor: var(--pf-t--global--border--color--default);
6934
- --pf-v6-c-form-control--before--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
6935
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6936
- --pf-v6-c-form-control--after--BorderStyle: solid;
6937
- --pf-v6-c-form-control--after--BorderColor: transparent;
6938
- --pf-v6-c-form-control--after--BorderRadius: var(--pf-v6-c-form-control--BorderRadius);
6939
- --pf-v6-c-form-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
6940
- --pf-v6-c-form-control--Width: 100%;
6941
- --pf-v6-c-form-control--inset--base: var(--pf-t--global--spacer--control--horizontal--default);
6942
- --pf-v6-c-form-control--PaddingBlockStart--base: var(--pf-t--global--spacer--control--vertical--default);
6943
- --pf-v6-c-form-control--PaddingBlockEnd--base: var(--pf-t--global--spacer--control--vertical--default);
6944
- --pf-v6-c-form-control--PaddingInlineEnd--base: var(--pf-v6-c-form-control--inset--base);
6945
- --pf-v6-c-form-control--PaddingInlineStart--base: var(--pf-v6-c-form-control--inset--base);
6946
- --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
6947
- --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
6948
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6949
- --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
6950
- --pf-v6-c-form-control__utilities--input--PaddingInlineEnd: var(--pf-v6-c-form-control__input--PaddingInlineEnd);
6951
- --pf-v6-c-form-control__utilities--select--PaddingInlineEnd: var(--pf-v6-c-form-control__select--PaddingInlineEnd);
6952
- --pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd: var(--pf-v6-c-form-control__textarea--PaddingInlineEnd);
6953
- --pf-v6-c-form-control__input--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
6954
- --pf-v6-c-form-control__input--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
6955
- --pf-v6-c-form-control__input--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6956
- --pf-v6-c-form-control__input--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
6957
- --pf-v6-c-form-control__select--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
6958
- --pf-v6-c-form-control__select--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
6959
- --pf-v6-c-form-control__select--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6960
- --pf-v6-c-form-control__select--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
6961
- --pf-v6-c-form-control__textarea--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart--base);
6962
- --pf-v6-c-form-control__textarea--PaddingBlockEnd: var(--pf-v6-c-form-control--PaddingBlockEnd--base);
6963
- --pf-v6-c-form-control__textarea--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
6964
- --pf-v6-c-form-control__textarea--PaddingInlineStart: var(--pf-v6-c-form-control--PaddingInlineStart--base);
6965
- --pf-v6-c-form-control--hover--after--BorderWidth: var(--pf-t--global--border--width--control--hover);
6966
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-t--global--border--color--hover);
6967
- --pf-v6-c-form-control--m-success--hover--after--BorderColor: var(--pf-t--global--border--color--status--success--hover);
6968
- --pf-v6-c-form-control--m-warning--hover--after--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
6969
- --pf-v6-c-form-control--m-error--hover--after--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
6970
- --pf-v6-c-form-control--m-expanded--after--BorderWidth: var(--pf-t--global--border--width--control--clicked);
6971
- --pf-v6-c-form-control--m-expanded--after--BorderColor: var(--pf-t--global--border--color--clicked);
6972
- --pf-v6-c-form-control--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
6973
- --pf-v6-c-form-control--m-placeholder--child--Color: var(--pf-t--global--text--color--regular);
6974
- --pf-v6-c-form-control--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
6975
- --pf-v6-c-form-control--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
6976
- --pf-v6-c-form-control--m-disabled--after--BorderColor: transparent;
6977
- --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-t--global--background--color--control--read-only);
6978
- --pf-v6-c-form-control--m-readonly--BorderColor: var(--pf-t--global--border--color--control--read-only);
6979
- --pf-v6-c-form-control--m-readonly--hover--after--BorderColor: revert;
6980
- --pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor: transparent;
6981
- --pf-v6-c-form-control--m-readonly--m-plain--BorderColor: transparent;
6982
- --pf-v6-c-form-control--m-readonly--m-plain--inset--base: 0;
6983
- --pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset: 0;
6984
- --pf-v6-c-form-control--icon--width: var(--pf-v6-c-form-control--FontSize);
6985
- --pf-v6-c-form-control--m-success--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6986
- --pf-v6-c-form-control--m-success--after--BorderColor: var(--pf-t--global--border--color--status--success--default);
6987
- --pf-v6-c-form-control--m-success--PaddingInlineEnd: initial;
6988
- --pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd: initial;
6989
- --pf-v6-c-form-control__input--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
6990
- --pf-v6-c-form-control__select--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
6991
- --pf-v6-c-form-control__textarea--m-success--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
6992
- --pf-v6-c-form-control--m-warning--after--BorderWidth: var(--pf-t--global--border--width--control--default);
6993
- --pf-v6-c-form-control--m-warning--after--BorderColor: var(--pf-t--global--border--color--status--warning--default);
6994
- --pf-v6-c-form-control--m-warning--PaddingInlineEnd: initial;
6995
- --pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd: initial;
6996
- --pf-v6-c-form-control__input--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
6997
- --pf-v6-c-form-control__select--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
6998
- --pf-v6-c-form-control__textarea--m-warning--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
6999
- --pf-v6-c-form-control--m-error--after--BorderWidth: var(--pf-t--global--border--width--control--default);
7000
- --pf-v6-c-form-control--m-error--after--BorderColor: var(--pf-t--global--border--color--status--danger--default);
7001
- --pf-v6-c-form-control--m-error--PaddingInlineEnd: initial;
7002
- --pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd: initial;
7003
- --pf-v6-c-form-control--m-error--icon--width: var(--pf-v6-c-form-control--FontSize);
7004
- --pf-v6-c-form-control__input--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
7005
- --pf-v6-c-form-control__select--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--m-icon--icon--spacer) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd));
7006
- --pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd));
7007
- --pf-v6-c-form-control--m-icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
7008
- --pf-v6-c-form-control--m-icon--icon--width: var(--pf-v6-c-form-control--FontSize);
7009
- --pf-v6-c-form-control--m-icon--icon--spacer: calc(var(--pf-t--global--spacer--control--horizontal--default) / 2);
7010
- --pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd: calc(var(--pf-v6-c-form-control--icon--width) + var(--pf-v6-c-form-control__utilities--Gap) + var(--pf-v6-c-form-control--m-icon--icon--width) + var(--pf-v6-c-form-control--ColumnGap) + var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd));
7011
- --pf-v6-c-form-control--textarea--Width: var(--pf-v6-c-form-control--Width);
7012
- --pf-v6-c-form-control--textarea--Height: auto;
7013
- --pf-v6-c-form-control--textarea--PaddingBlockStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
7014
- --pf-v6-c-form-control--textarea--PaddingBlockEnd--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
7015
- --pf-v6-c-form-control--textarea--PaddingInlineEnd--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
7016
- --pf-v6-c-form-control--textarea--PaddingInlineStart--offset: calc(-1 * var(--pf-v6-c-form-control--OutlineOffset));
7017
- --pf-v6-c-form-control__icon--Color: var(--pf-t--global--icon--color--regular);
7018
- --pf-v6-c-form-control__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
7019
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
7020
- --pf-v6-c-form-control--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
7021
- --pf-v6-c-form-control--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
7022
- --pf-v6-c-form-control--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
7023
- --pf-v6-c-form-control__utilities--Gap: var(--pf-t--global--spacer--gap--group--horizontal);
7024
- --pf-v6-c-form-control__utilities--PaddingBlockStart: var(--pf-v6-c-form-control--PaddingBlockStart);
7025
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control--PaddingInlineEnd--base);
7026
- --pf-v6-c-form-control__utilities--textarea--PaddingBlockStart: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
7027
- --pf-v6-c-form-control__toggle-icon--PaddingInlineStart: 0;
7028
- --pf-v6-c-form-control__toggle-icon--PaddingInlineEnd: 0;
7029
- --pf-v6-c-form-control__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
7030
- --pf-v6-c-form-control__toggle-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
7031
- --pf-v6-c-form-control--m-disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
6883
+ .pf-v6-c-popover:is(.pf-m-top-left,
6884
+ .pf-m-bottom-left) {
6885
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
6886
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
7032
6887
  }
7033
6888
 
7034
- .pf-v6-c-form-control {
6889
+ .pf-v6-c-popover:is(.pf-m-top-right,
6890
+ .pf-m-bottom-right) {
6891
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
6892
+ --pf-v6-c-popover__arrow--InsetInlineStart: auto;
6893
+ }
6894
+
6895
+ .pf-v6-c-popover.pf-m-danger {
6896
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
6897
+ }
6898
+
6899
+ .pf-v6-c-popover.pf-m-warning {
6900
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
6901
+ }
6902
+
6903
+ .pf-v6-c-popover.pf-m-success {
6904
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
6905
+ }
6906
+
6907
+ .pf-v6-c-popover.pf-m-custom {
6908
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
6909
+ }
6910
+
6911
+ .pf-v6-c-popover.pf-m-info {
6912
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
6913
+ }
6914
+
6915
+ .pf-v6-c-popover__content {
7035
6916
  position: relative;
7036
- display: grid;
7037
- grid-template-columns: 1fr auto;
7038
- column-gap: var(--pf-v6-c-form-control--ColumnGap);
7039
- align-items: start;
7040
- width: var(--pf-v6-c-form-control--Width);
7041
- font-size: var(--pf-v6-c-form-control--FontSize);
7042
- line-height: var(--pf-v6-c-form-control--LineHeight);
7043
- resize: var(--pf-v6-c-form-control--Resize);
7044
- background-color: var(--pf-v6-c-form-control--BackgroundColor);
7045
- border-radius: var(--pf-v6-c-form-control--BorderRadius);
6917
+ padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
6918
+ padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
6919
+ padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
6920
+ padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6921
+ background-color: var(--pf-v6-c-popover__content--BackgroundColor);
6922
+ border-radius: var(--pf-v6-c-popover__content--BorderRadius);
7046
6923
  }
7047
6924
 
7048
- .pf-v6-c-form-control::before, .pf-v6-c-form-control::after {
6925
+ .pf-v6-c-popover__close {
7049
6926
  position: absolute;
7050
- inset: 0;
7051
- pointer-events: none;
7052
- content: "";
6927
+ inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
6928
+ inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
7053
6929
  }
7054
6930
 
7055
- .pf-v6-c-form-control::before {
7056
- border-color: var(--pf-v6-c-form-control--before--BorderColor);
7057
- border-style: var(--pf-v6-c-form-control--before--BorderStyle);
7058
- border-width: var(--pf-v6-c-form-control--before--BorderWidth);
7059
- border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
6931
+ .pf-v6-c-popover__close + * {
6932
+ padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
7060
6933
  }
7061
6934
 
7062
- .pf-v6-c-form-control::after {
7063
- border: var(--pf-v6-c-form-control--after--BorderWidth) var(--pf-v6-c-form-control--after--BorderStyle) var(--pf-v6-c-form-control--after--BorderColor);
7064
- border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
6935
+ .pf-v6-c-popover__arrow {
6936
+ position: absolute;
6937
+ top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
6938
+ right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
6939
+ bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
6940
+ left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
6941
+ width: var(--pf-v6-c-popover__arrow--Width);
6942
+ height: var(--pf-v6-c-popover__arrow--Height);
6943
+ pointer-events: none;
6944
+ background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
6945
+ border: var(--pf-v6-c-popover--BorderWidth) solid var(--pf-v6-c-popover--BorderColor);
6946
+ box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
6947
+ transform: translateX(var(--pf-v6-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-popover__arrow--Rotate, 0));
7065
6948
  }
7066
6949
 
7067
- .pf-v6-c-form-control > :is(input, select, textarea) {
7068
- grid-row: 1/2;
7069
- grid-column: 1/-1;
7070
- padding-block-start: var(--pf-v6-c-form-control--PaddingBlockStart);
7071
- padding-block-end: var(--pf-v6-c-form-control--PaddingBlockEnd);
7072
- padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
7073
- padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
7074
- color: var(--pf-v6-c-form-control--Color);
7075
- appearance: none;
7076
- background-color: transparent;
7077
- border: none;
7078
- border-radius: var(--pf-v6-c-form-control--BorderRadius);
7079
- outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
6950
+ .pf-v6-c-popover__header {
6951
+ margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
7080
6952
  }
7081
6953
 
7082
- .pf-v6-c-form-control > ::placeholder {
7083
- color: var(--pf-v6-c-form-control--m-placeholder--Color);
6954
+ .pf-v6-c-popover__title {
6955
+ display: flex;
6956
+ flex: 0 0 auto;
7084
6957
  }
7085
6958
 
7086
- .pf-v6-c-form-control > :is(input, select) {
7087
- text-overflow: ellipsis;
6959
+ .pf-v6-c-popover__title-icon {
6960
+ margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
6961
+ font-size: var(--pf-v6-c-popover__title-icon--FontSize);
6962
+ color: var(--pf-v6-c-popover__title-icon--Color);
7088
6963
  }
7089
6964
 
7090
- .pf-v6-c-form-control > select {
7091
- background-color: var(--pf-v6-c-form-control--BackgroundColor);
6965
+ .pf-v6-c-popover__title-text {
6966
+ min-width: 0;
6967
+ font-size: var(--pf-v6-c-popover__title-text--FontSize);
6968
+ font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
6969
+ color: var(--pf-v6-c-popover__title-text--Color);
6970
+ overflow-wrap: break-word;
7092
6971
  }
7093
6972
 
7094
- .pf-v6-c-form-control > select * {
7095
- color: var(--pf-v6-c-form-control--Color);
6973
+ .pf-v6-c-popover__body {
6974
+ word-wrap: break-word;
7096
6975
  }
7097
6976
 
7098
- .pf-v6-c-form-control:has(input) {
7099
- --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__input--PaddingBlockStart);
7100
- --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__input--PaddingBlockEnd);
7101
- --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__input--PaddingInlineStart);
7102
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control__input--PaddingInlineEnd);
7103
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd);
6977
+ .pf-v6-c-popover__footer {
6978
+ margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
7104
6979
  }
7105
6980
 
7106
- .pf-v6-c-form-control.pf-m-textarea {
7107
- padding-block-start: var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset);
7108
- padding-block-end: var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset);
7109
- padding-inline-start: var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset);
7110
- padding-inline-end: var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset);
6981
+ .pf-v6-c-action-list {
6982
+ --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
6983
+ --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default);
6984
+ --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
6985
+ --pf-v6-c-action-list--m-vertical--RowGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
6986
+ --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
6987
+ --pf-v6-c-action-list--m-vertical--m-icons--RowGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
7111
6988
  }
7112
6989
 
7113
- .pf-v6-c-form-control.pf-m-textarea.pf-m-success, .pf-v6-c-form-control.pf-m-textarea.pf-m-warning, .pf-v6-c-form-control.pf-m-textarea.pf-m-error {
7114
- --pf-v6-c-form-control--m-status--PaddingInlineEnd--offset: calc(var(--pf-v6-c-form-control__icon--FontSize) + var(--pf-v6-c-form-control--ColumnGap));
6990
+ .pf-v6-c-action-list,
6991
+ .pf-v6-c-action-list__group {
6992
+ display: flex;
6993
+ align-items: start;
7115
6994
  }
7116
6995
 
7117
- .pf-v6-c-form-control.pf-m-textarea:has(textarea) {
7118
- --pf-v6-c-form-control--PaddingBlockStart: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
7119
- --pf-v6-c-form-control--PaddingBlockEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockEnd) - var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset));
7120
- --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineStart) - var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset));
7121
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineEnd) - var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset) + var(--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset, 0px));
7122
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd);
6996
+ .pf-v6-c-action-list {
6997
+ row-gap: var(--pf-v6-c-action-list--RowGap);
6998
+ column-gap: var(--pf-v6-c-action-list--ColumnGap);
7123
6999
  }
7124
7000
 
7125
- .pf-v6-c-form-control.pf-m-textarea > textarea {
7126
- outline-offset: 0;
7127
- scrollbar-gutter: stable;
7001
+ .pf-v6-c-action-list.pf-m-icons {
7002
+ --pf-v6-c-action-list__group--ColumnGap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
7003
+ --pf-v6-c-action-list--m-vertical--RowGap: var(--pf-v6-c-action-list--m-vertical--m-icons--RowGap);
7004
+ column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
7128
7005
  }
7129
7006
 
7130
- .pf-v6-c-form-control.pf-m-textarea .pf-v6-c-form-control__utilities {
7131
- padding-block-start: var(--pf-v6-c-form-control__utilities--textarea--PaddingBlockStart);
7007
+ .pf-v6-c-action-list.pf-m-vertical, .pf-v6-c-action-list.pf-m-vertical .pf-v6-c-action-list__group {
7008
+ flex-direction: column;
7132
7009
  }
7133
7010
 
7134
- .pf-v6-c-form-control.pf-m-readonly {
7135
- --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
7136
- --pf-v6-c-form-control--before--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
7011
+ .pf-v6-c-action-list.pf-m-vertical {
7012
+ row-gap: var(--pf-v6-c-action-list--m-vertical--RowGap);
7137
7013
  }
7138
7014
 
7139
- .pf-v6-c-form-control.pf-m-readonly:hover {
7140
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
7015
+ .pf-v6-c-action-list__group {
7016
+ row-gap: var(--pf-v6-c-action-list__group--RowGap, var(--pf-v6-c-action-list--RowGap));
7017
+ column-gap: var(--pf-v6-c-action-list__group--ColumnGap);
7141
7018
  }
7142
7019
 
7143
- .pf-v6-c-form-control.pf-m-readonly:not(.pf-m-success, .pf-m-warning, .pf-m-error) {
7144
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
7020
+ .pf-v6-c-action-list__group.pf-m-icons {
7021
+ column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
7145
7022
  }
7146
7023
 
7147
- .pf-v6-c-form-control.pf-m-readonly.pf-m-plain {
7148
- --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor);
7149
- --pf-v6-c-form-control--m-readonly--BorderColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BorderColor);
7150
- --pf-v6-c-form-control--inset--base: var(--pf-v6-c-form-control--m-readonly--m-plain--inset--base);
7151
- --pf-v6-c-form-control--before--BorderStyle: none;
7152
- --pf-v6-c-form-control--after--BorderStyle: none;
7153
- --pf-v6-c-form-control--OutlineOffset: var(--pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset);
7024
+ .pf-v6-c-divider {
7025
+ --pf-v6-c-divider--Display: flex;
7026
+ --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
7027
+ --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
7028
+ --pf-v6-c-divider--before--FlexBasis: 100%;
7154
7029
  }
7155
7030
 
7156
- .pf-v6-c-form-control.pf-m-expanded {
7157
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-expanded--after--BorderColor);
7158
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-expanded--after--BorderWidth);
7031
+ .pf-v6-c-divider {
7032
+ flex-direction: row;
7033
+ width: 100%;
7034
+ height: var(--pf-v6-c-divider--Size);
7035
+ --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
7036
+ --pf-v6-hidden-visible--hidden--Display: none;
7037
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
7038
+ display: var(--pf-v6-hidden-visible--Display);
7039
+ flex-shrink: 0;
7040
+ align-items: stretch;
7041
+ align-self: stretch;
7042
+ justify-content: center;
7043
+ border: 0;
7159
7044
  }
7160
7045
 
7161
- .pf-v6-c-form-control.pf-m-disabled {
7162
- --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-disabled--BackgroundColor);
7163
- --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-disabled--Color);
7164
- --pf-v6-c-form-control--m-placeholder--Color: var(--pf-v6-c-form-control--m-disabled--Color);
7165
- --pf-v6-c-form-control__toggle-icon--Color: var(--pf-v6-c-form-control--m-disabled__toggle-icon--Color);
7166
- --pf-v6-c-form-control--before--BorderStyle: none;
7167
- --pf-v6-c-form-control--after--BorderStyle: none;
7168
- cursor: not-allowed;
7046
+ .pf-v6-c-divider.pf-m-hidden {
7047
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
7169
7048
  }
7170
7049
 
7171
- .pf-v6-c-form-control.pf-m-error {
7172
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-error--after--BorderColor);
7173
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-error--hover--after--BorderColor);
7174
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
7175
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
7050
+ @media screen and (min-width: 36rem) {
7051
+ .pf-v6-c-divider.pf-m-hidden-on-sm {
7052
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
7053
+ }
7054
+ .pf-v6-c-divider.pf-m-visible-on-sm {
7055
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
7056
+ }
7176
7057
  }
7177
-
7178
- @media (prefers-reduced-motion: no-preference) {
7179
- .pf-v6-c-form-control.pf-m-error {
7180
- translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
7181
- animation-name: pf-v6-global-danger-jiggle-motion;
7182
- animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
7183
- animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
7184
- animation-fill-mode: both;
7058
+ @media screen and (min-width: 48rem) {
7059
+ .pf-v6-c-divider.pf-m-hidden-on-md {
7060
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
7061
+ }
7062
+ .pf-v6-c-divider.pf-m-visible-on-md {
7063
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
7064
+ }
7065
+ }
7066
+ @media screen and (min-width: 62rem) {
7067
+ .pf-v6-c-divider.pf-m-hidden-on-lg {
7068
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
7069
+ }
7070
+ .pf-v6-c-divider.pf-m-visible-on-lg {
7071
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
7072
+ }
7073
+ }
7074
+ @media screen and (min-width: 75rem) {
7075
+ .pf-v6-c-divider.pf-m-hidden-on-xl {
7076
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
7077
+ }
7078
+ .pf-v6-c-divider.pf-m-visible-on-xl {
7079
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
7080
+ }
7081
+ }
7082
+ @media screen and (min-width: 90.625rem) {
7083
+ .pf-v6-c-divider.pf-m-hidden-on-2xl {
7084
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
7085
+ }
7086
+ .pf-v6-c-divider.pf-m-visible-on-2xl {
7087
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
7185
7088
  }
7186
7089
  }
7187
- .pf-v6-c-form-control.pf-m-error .pf-v6-c-form-control__icon.pf-m-status {
7188
- --pf-v6-c-form-control--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
7189
- --pf-v6-c-form-control--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
7190
- animation-name: pf-v6-global-fade-in;
7191
- animation-duration: var(--pf-v6-c-form-control--TransitionDuration--Opacity);
7192
- animation-timing-function: var(--pf-v6-c-form-control--TransitionTimingFunction--Opacity);
7090
+ .pf-v6-c-divider::before {
7091
+ flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
7092
+ content: "";
7093
+ background-color: var(--pf-v6-c-divider--Color);
7094
+ border-block-start: var(--pf-v6-c-divider--Size) solid transparent;
7095
+ border-inline-start: var(--pf-v6-c-divider--Size) solid transparent;
7193
7096
  }
7194
7097
 
7195
- .pf-v6-c-form-control.pf-m-error > textarea {
7196
- padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd));
7098
+ .pf-v6-c-divider.pf-m-horizontal {
7099
+ flex-direction: row;
7100
+ width: 100%;
7101
+ height: var(--pf-v6-c-divider--Size);
7197
7102
  }
7198
7103
 
7199
- .pf-v6-c-form-control.pf-m-error > input {
7200
- padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-error--PaddingInlineEnd));
7104
+ .pf-v6-c-divider.pf-m-vertical {
7105
+ flex-direction: column;
7106
+ width: var(--pf-v6-c-divider--Size);
7107
+ height: inherit;
7201
7108
  }
7202
7109
 
7203
- .pf-v6-c-form-control.pf-m-error > select {
7204
- padding-inline-end: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-error--PaddingInlineEnd));
7110
+ .pf-v6-c-divider.pf-m-inset-none {
7111
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
7205
7112
  }
7206
7113
 
7207
- .pf-v6-c-form-control.pf-m-error.pf-m-icon > :is(input) {
7208
- padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
7114
+ .pf-v6-c-divider.pf-m-inset-xs {
7115
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
7209
7116
  }
7210
7117
 
7211
- .pf-v6-c-form-control.pf-m-success {
7212
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-success--after--BorderColor);
7213
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-success--hover--after--BorderColor);
7214
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-success__icon--m-status--Color);
7215
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-success--after--BorderWidth);
7118
+ .pf-v6-c-divider.pf-m-inset-sm {
7119
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
7216
7120
  }
7217
7121
 
7218
- .pf-v6-c-form-control.pf-m-success > textarea {
7219
- padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-success--PaddingInlineEnd));
7122
+ .pf-v6-c-divider.pf-m-inset-md {
7123
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
7220
7124
  }
7221
7125
 
7222
- .pf-v6-c-form-control.pf-m-success > input {
7223
- padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-success--PaddingInlineEnd));
7126
+ .pf-v6-c-divider.pf-m-inset-lg {
7127
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
7224
7128
  }
7225
7129
 
7226
- .pf-v6-c-form-control.pf-m-success > select {
7227
- padding-inline-end: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-success--PaddingInlineEnd));
7130
+ .pf-v6-c-divider.pf-m-inset-xl {
7131
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
7228
7132
  }
7229
7133
 
7230
- .pf-v6-c-form-control.pf-m-success.pf-m-icon > :is(input) {
7231
- padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
7134
+ .pf-v6-c-divider.pf-m-inset-2xl {
7135
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
7232
7136
  }
7233
7137
 
7234
- .pf-v6-c-form-control.pf-m-warning {
7235
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-warning--after--BorderColor);
7236
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-warning--hover--after--BorderColor);
7237
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-warning__icon--m-status--Color);
7238
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-warning--after--BorderWidth);
7138
+ .pf-v6-c-divider.pf-m-inset-3xl {
7139
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
7239
7140
  }
7240
7141
 
7241
- .pf-v6-c-form-control.pf-m-warning > textarea {
7242
- padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-warning--PaddingInlineEnd));
7142
+ @media (min-width: 36rem) {
7143
+ .pf-v6-c-divider.pf-m-horizontal-on-sm {
7144
+ flex-direction: row;
7145
+ width: 100%;
7146
+ height: var(--pf-v6-c-divider--Size);
7147
+ }
7243
7148
  }
7244
-
7245
- .pf-v6-c-form-control.pf-m-warning > input {
7246
- padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-warning--PaddingInlineEnd));
7149
+ @media (min-width: 36rem) {
7150
+ .pf-v6-c-divider.pf-m-vertical-on-sm {
7151
+ flex-direction: column;
7152
+ width: var(--pf-v6-c-divider--Size);
7153
+ height: inherit;
7154
+ }
7247
7155
  }
7248
-
7249
- .pf-v6-c-form-control.pf-m-warning > select {
7250
- padding-inline-end: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-warning--PaddingInlineEnd));
7156
+ @media (min-width: 36rem) {
7157
+ .pf-v6-c-divider.pf-m-inset-none-on-sm {
7158
+ --pf-v6-c-divider--before--FlexBasis: 100%;
7159
+ }
7160
+ .pf-v6-c-divider.pf-m-inset-xs-on-sm {
7161
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
7162
+ }
7163
+ .pf-v6-c-divider.pf-m-inset-sm-on-sm {
7164
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
7165
+ }
7166
+ .pf-v6-c-divider.pf-m-inset-md-on-sm {
7167
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
7168
+ }
7169
+ .pf-v6-c-divider.pf-m-inset-lg-on-sm {
7170
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
7171
+ }
7172
+ .pf-v6-c-divider.pf-m-inset-xl-on-sm {
7173
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
7174
+ }
7175
+ .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
7176
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
7177
+ }
7178
+ .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
7179
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
7180
+ }
7251
7181
  }
7252
-
7253
- .pf-v6-c-form-control.pf-m-warning.pf-m-icon > :is(input) {
7254
- padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
7182
+ @media (min-width: 48rem) {
7183
+ .pf-v6-c-divider.pf-m-horizontal-on-md {
7184
+ flex-direction: row;
7185
+ width: 100%;
7186
+ height: var(--pf-v6-c-divider--Size);
7187
+ }
7255
7188
  }
7256
-
7257
- .pf-v6-c-form-control:hover {
7258
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
7259
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--hover--after--BorderWidth);
7189
+ @media (min-width: 48rem) {
7190
+ .pf-v6-c-divider.pf-m-vertical-on-md {
7191
+ flex-direction: column;
7192
+ width: var(--pf-v6-c-divider--Size);
7193
+ height: inherit;
7194
+ }
7260
7195
  }
7261
-
7262
- .pf-v6-c-form-control.pf-m-icon {
7263
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
7196
+ @media (min-width: 48rem) {
7197
+ .pf-v6-c-divider.pf-m-inset-none-on-md {
7198
+ --pf-v6-c-divider--before--FlexBasis: 100%;
7199
+ }
7200
+ .pf-v6-c-divider.pf-m-inset-xs-on-md {
7201
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
7202
+ }
7203
+ .pf-v6-c-divider.pf-m-inset-sm-on-md {
7204
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
7205
+ }
7206
+ .pf-v6-c-divider.pf-m-inset-md-on-md {
7207
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
7208
+ }
7209
+ .pf-v6-c-divider.pf-m-inset-lg-on-md {
7210
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
7211
+ }
7212
+ .pf-v6-c-divider.pf-m-inset-xl-on-md {
7213
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
7214
+ }
7215
+ .pf-v6-c-divider.pf-m-inset-2xl-on-md {
7216
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
7217
+ }
7218
+ .pf-v6-c-divider.pf-m-inset-3xl-on-md {
7219
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
7220
+ }
7264
7221
  }
7265
-
7266
- .pf-v6-c-form-control:has(select) {
7267
- --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__select--PaddingBlockStart);
7268
- --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__select--PaddingBlockEnd);
7269
- --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
7270
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) + var(--pf-v6-c-form-control__icon--FontSize));
7271
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
7222
+ @media (min-width: 62rem) {
7223
+ .pf-v6-c-divider.pf-m-horizontal-on-lg {
7224
+ flex-direction: row;
7225
+ width: 100%;
7226
+ height: var(--pf-v6-c-divider--Size);
7227
+ }
7272
7228
  }
7273
-
7274
- .pf-v6-c-form-control:has(select) .pf-v6-c-form-control__utilities {
7275
- padding-inline-end: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
7229
+ @media (min-width: 62rem) {
7230
+ .pf-v6-c-divider.pf-m-vertical-on-lg {
7231
+ flex-direction: column;
7232
+ width: var(--pf-v6-c-divider--Size);
7233
+ height: inherit;
7234
+ }
7276
7235
  }
7277
-
7278
- .pf-v6-c-form-control.pf-m-placeholder > select {
7279
- --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
7236
+ @media (min-width: 62rem) {
7237
+ .pf-v6-c-divider.pf-m-inset-none-on-lg {
7238
+ --pf-v6-c-divider--before--FlexBasis: 100%;
7239
+ }
7240
+ .pf-v6-c-divider.pf-m-inset-xs-on-lg {
7241
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
7242
+ }
7243
+ .pf-v6-c-divider.pf-m-inset-sm-on-lg {
7244
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
7245
+ }
7246
+ .pf-v6-c-divider.pf-m-inset-md-on-lg {
7247
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
7248
+ }
7249
+ .pf-v6-c-divider.pf-m-inset-lg-on-lg {
7250
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
7251
+ }
7252
+ .pf-v6-c-divider.pf-m-inset-xl-on-lg {
7253
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
7254
+ }
7255
+ .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
7256
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
7257
+ }
7258
+ .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
7259
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
7260
+ }
7261
+ }
7262
+ @media (min-width: 75rem) {
7263
+ .pf-v6-c-divider.pf-m-horizontal-on-xl {
7264
+ flex-direction: row;
7265
+ width: 100%;
7266
+ height: var(--pf-v6-c-divider--Size);
7267
+ }
7268
+ }
7269
+ @media (min-width: 75rem) {
7270
+ .pf-v6-c-divider.pf-m-vertical-on-xl {
7271
+ flex-direction: column;
7272
+ width: var(--pf-v6-c-divider--Size);
7273
+ height: inherit;
7274
+ }
7275
+ }
7276
+ @media (min-width: 75rem) {
7277
+ .pf-v6-c-divider.pf-m-inset-none-on-xl {
7278
+ --pf-v6-c-divider--before--FlexBasis: 100%;
7279
+ }
7280
+ .pf-v6-c-divider.pf-m-inset-xs-on-xl {
7281
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
7282
+ }
7283
+ .pf-v6-c-divider.pf-m-inset-sm-on-xl {
7284
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
7285
+ }
7286
+ .pf-v6-c-divider.pf-m-inset-md-on-xl {
7287
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
7288
+ }
7289
+ .pf-v6-c-divider.pf-m-inset-lg-on-xl {
7290
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
7291
+ }
7292
+ .pf-v6-c-divider.pf-m-inset-xl-on-xl {
7293
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
7294
+ }
7295
+ .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
7296
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
7297
+ }
7298
+ .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
7299
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
7300
+ }
7301
+ }
7302
+ @media (min-width: 90.625rem) {
7303
+ .pf-v6-c-divider.pf-m-horizontal-on-2xl {
7304
+ flex-direction: row;
7305
+ width: 100%;
7306
+ height: var(--pf-v6-c-divider--Size);
7307
+ }
7280
7308
  }
7281
-
7282
- .pf-v6-c-form-control.pf-m-placeholder > select * {
7283
- color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
7309
+ @media (min-width: 90.625rem) {
7310
+ .pf-v6-c-divider.pf-m-vertical-on-2xl {
7311
+ flex-direction: column;
7312
+ width: var(--pf-v6-c-divider--Size);
7313
+ height: inherit;
7314
+ }
7284
7315
  }
7285
-
7286
- .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
7287
- color: revert;
7316
+ @media (min-width: 90.625rem) {
7317
+ .pf-v6-c-divider.pf-m-inset-none-on-2xl {
7318
+ --pf-v6-c-divider--before--FlexBasis: 100%;
7319
+ }
7320
+ .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
7321
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
7322
+ }
7323
+ .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
7324
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
7325
+ }
7326
+ .pf-v6-c-divider.pf-m-inset-md-on-2xl {
7327
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
7328
+ }
7329
+ .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
7330
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
7331
+ }
7332
+ .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
7333
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
7334
+ }
7335
+ .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
7336
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
7337
+ }
7338
+ .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
7339
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
7340
+ }
7288
7341
  }
7289
-
7290
- .pf-v6-c-form-control > textarea {
7291
- width: 100%;
7292
- height: 100%;
7293
- vertical-align: bottom;
7294
- resize: none;
7342
+ .pf-v6-c-badge {
7343
+ --pf-v6-c-badge--BorderColor: transparent;
7344
+ --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
7345
+ --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
7346
+ --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
7347
+ --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
7348
+ --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7349
+ --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7350
+ --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7351
+ --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
7352
+ --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
7353
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7354
+ --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
7355
+ --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7356
+ --pf-v6-c-badge--m-read--BorderColor: var(--pf-t--global--border--color--high-contrast);
7357
+ --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7358
+ --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
7359
+ --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
7360
+ --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
7361
+ --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
7362
+ --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
7363
+ --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7295
7364
  }
7296
7365
 
7297
- .pf-v6-c-form-control.pf-m-resize-vertical {
7298
- --pf-v6-c-form-control--Resize: vertical;
7299
- overflow: auto;
7366
+ .pf-v6-c-badge {
7367
+ position: relative;
7368
+ display: inline-block;
7369
+ min-width: var(--pf-v6-c-badge--MinWidth);
7370
+ padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
7371
+ padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
7372
+ font-size: var(--pf-v6-c-badge--FontSize);
7373
+ font-weight: var(--pf-v6-c-badge--FontWeight);
7374
+ color: var(--pf-v6-c-badge--Color);
7375
+ text-align: center;
7376
+ white-space: nowrap;
7377
+ background-color: var(--pf-v6-c-badge--BackgroundColor);
7378
+ border-radius: var(--pf-v6-c-badge--BorderRadius);
7300
7379
  }
7301
7380
 
7302
- .pf-v6-c-form-control.pf-m-resize-horizontal {
7303
- --pf-v6-c-form-control--Resize: horizontal;
7304
- overflow: auto;
7381
+ .pf-v6-c-badge::after {
7382
+ position: absolute;
7383
+ inset: 0;
7384
+ pointer-events: none;
7385
+ content: "";
7386
+ border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
7387
+ border-radius: inherit;
7305
7388
  }
7306
7389
 
7307
- .pf-v6-c-form-control.pf-m-resize-both {
7308
- --pf-v6-c-form-control--Resize: both;
7309
- overflow: auto;
7390
+ .pf-v6-c-badge.pf-m-read {
7391
+ --pf-v6-c-badge--BorderColor: var(--pf-v6-c-badge--m-read--BorderColor);
7392
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
7393
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
7394
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
7310
7395
  }
7311
7396
 
7312
- .pf-v6-c-form-control__icon {
7313
- font-size: var(--pf-v6-c-form-control__icon--FontSize);
7314
- color: var(--pf-v6-c-form-control__icon--Color);
7397
+ .pf-v6-c-badge.pf-m-unread {
7398
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
7399
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
7400
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
7315
7401
  }
7316
7402
 
7317
- .pf-v6-c-form-control__icon.pf-m-status {
7318
- --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
7403
+ .pf-v6-c-badge.pf-m-disabled {
7404
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
7405
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
7319
7406
  }
7320
7407
 
7321
- .pf-v6-c-form-control__toggle-icon {
7322
- grid-row: 1/2;
7323
- grid-column: 3;
7324
- padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
7325
- padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
7326
- font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
7327
- color: var(--pf-v6-c-form-control__toggle-icon--Color);
7328
- pointer-events: none;
7408
+ .pf-v6-c-badge.pf-m-disabled::after {
7409
+ border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
7329
7410
  }
7330
7411
 
7331
- .pf-v6-c-form-control__utilities {
7332
- display: flex;
7333
- flex-wrap: nowrap;
7334
- grid-row: 1/2;
7335
- grid-column: 2;
7336
- gap: var(--pf-v6-c-form-control__utilities--Gap);
7337
- padding-block-start: var(--pf-v6-c-form-control__utilities--PaddingBlockStart);
7338
- padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
7339
- pointer-events: none;
7412
+ .pf-v6-c-badge__toggle-icon {
7413
+ margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
7414
+ color: var(--pf-v6-c-badge__toggle-icon--Color);
7340
7415
  }
7341
7416
 
7342
7417
  .pf-v6-c-menu {
@@ -7942,201 +8017,85 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
7942
8017
  }
7943
8018
 
7944
8019
  .pf-v6-c-menu__item-text {
7945
- overflow: hidden;
7946
- text-overflow: ellipsis;
7947
- white-space: nowrap;
7948
- flex-grow: 1;
7949
- }
7950
-
7951
- .pf-v6-c-menu__group-title {
7952
- padding-block-start: var(--pf-v6-c-menu__group-title--PaddingBlockStart);
7953
- padding-block-end: var(--pf-v6-c-menu__group-title--PaddingBlockEnd);
7954
- padding-inline-start: var(--pf-v6-c-menu__group-title--PaddingInlineStart);
7955
- padding-inline-end: var(--pf-v6-c-menu__group-title--PaddingInlineEnd);
7956
- font-size: var(--pf-v6-c-menu__group-title--FontSize, inherit);
7957
- font-weight: var(--pf-v6-c-menu__group-title--FontWeight, inherit);
7958
- color: var(--pf-v6-c-menu__group-title--Color);
7959
- }
7960
-
7961
- .pf-v6-c-menu__item-description {
7962
- font-size: var(--pf-v6-c-menu__item-description--FontSize);
7963
- color: var(--pf-v6-c-menu__item-description--Color);
7964
- word-break: break-word;
7965
- }
7966
-
7967
- .pf-v6-c-menu__item-check .pf-v6-c-check {
7968
- --pf-v6-c-check__input--TranslateY: none;
7969
- }
7970
-
7971
- .pf-v6-c-menu__item-toggle-icon {
7972
- color: var(--pf-v6-c-menu__item-toggle-icon--Color, inherit);
7973
- }
7974
-
7975
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-menu__item-toggle-icon {
7976
- scale: -1 1;
7977
- }
7978
-
7979
- .pf-v6-c-menu__item-icon {
7980
- color: var(--pf-v6-c-menu__item--icon--Color, inherit);
7981
- }
7982
-
7983
- .pf-v6-c-menu__item-select-icon,
7984
- .pf-v6-c-menu__item-external-icon {
7985
- opacity: 0;
7986
- }
7987
-
7988
- .pf-v6-c-menu__item-toggle-icon.pf-m-favorited, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited),
7989
- .pf-v6-c-menu__item-action.pf-m-favorited,
7990
- .pf-v6-c-menu__item-action.pf-m-favorited:hover,
7991
- .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited) {
7992
- --pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
7993
- }
7994
-
7995
- .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus),
7996
- .pf-v6-c-menu__item-action.pf-m-favorited:is(:hover, :focus),
7997
- .pf-v6-c-menu__item-action.pf-m-favorited:hover:is(:hover, :focus),
7998
- .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus) {
7999
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
8000
- }
8001
-
8002
- .pf-v6-c-menu__breadcrumb {
8003
- --pf-v6-c-breadcrumb__item--FontSize: var(--pf-v6-c-menu__breadcrumb--FontSize);
8004
- padding-block-start: var(--pf-v6-c-menu__breadcrumb--PaddingBlockStart);
8005
- padding-block-end: var(--pf-v6-c-menu__breadcrumb--PaddingBlockEnd);
8006
- padding-inline-start: var(--pf-v6-c-menu__breadcrumb--PaddingInlineStart);
8007
- padding-inline-end: var(--pf-v6-c-menu__breadcrumb--PaddingInlineEnd);
8008
- }
8009
-
8010
- .pf-v6-c-menu__breadcrumb .pf-v6-c-menu {
8011
- min-width: auto;
8012
- padding-block-start: var(--pf-v6-c-menu--PaddingBlockStart);
8013
- padding-block-end: var(--pf-v6-c-menu--PaddingBlockEnd);
8014
- }
8015
-
8016
- .pf-v6-c-menu__breadcrumb .pf-v6-c-menu__content {
8017
- height: auto;
8018
- }
8019
-
8020
- .pf-v6-c-menu__breadcrumb .pf-v6-c-menu-toggle {
8021
- --pf-v6-c-menu-toggle--BorderWidth: 0;
8022
- --pf-v6-c-menu-toggle--BorderColor: transparent;
8023
- outline-offset: var(--pf-v6-c-menu--OutlineOffset);
8024
- }
8025
-
8026
- .pf-v6-c-breadcrumb {
8027
- --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
8028
- --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
8029
- --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
8030
- --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
8031
- --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
8032
- --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
8033
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8034
- --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8035
- --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
8036
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
8037
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
8038
- --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
8039
- --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
8040
- --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
8041
- --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
8042
- --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
8043
- --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
8044
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
8045
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
8046
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
8047
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
8048
- }
8049
-
8050
- .pf-v6-c-breadcrumb {
8051
- display: inline-flex;
8052
- }
8053
-
8054
- .pf-v6-c-breadcrumb__list {
8055
- display: flex;
8056
- flex-wrap: wrap;
8057
- align-items: center;
8058
- }
8059
-
8060
- .pf-v6-c-breadcrumb__item {
8061
- display: flex;
8062
- align-items: baseline;
8063
- font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
8064
- font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
8065
- line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
8020
+ overflow: hidden;
8021
+ text-overflow: ellipsis;
8066
8022
  white-space: nowrap;
8067
- list-style: none;
8023
+ flex-grow: 1;
8068
8024
  }
8069
8025
 
8070
- .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
8071
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
8026
+ .pf-v6-c-menu__group-title {
8027
+ padding-block-start: var(--pf-v6-c-menu__group-title--PaddingBlockStart);
8028
+ padding-block-end: var(--pf-v6-c-menu__group-title--PaddingBlockEnd);
8029
+ padding-inline-start: var(--pf-v6-c-menu__group-title--PaddingInlineStart);
8030
+ padding-inline-end: var(--pf-v6-c-menu__group-title--PaddingInlineEnd);
8031
+ font-size: var(--pf-v6-c-menu__group-title--FontSize, inherit);
8032
+ font-weight: var(--pf-v6-c-menu__group-title--FontWeight, inherit);
8033
+ color: var(--pf-v6-c-menu__group-title--Color);
8072
8034
  }
8073
8035
 
8074
- .pf-v6-c-breadcrumb__item:not(:last-child) {
8075
- margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
8036
+ .pf-v6-c-menu__item-description {
8037
+ font-size: var(--pf-v6-c-menu__item-description--FontSize);
8038
+ color: var(--pf-v6-c-menu__item-description--Color);
8039
+ word-break: break-word;
8076
8040
  }
8077
8041
 
8078
- .pf-v6-c-breadcrumb__item-divider {
8079
- margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
8080
- font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
8081
- line-height: 1;
8082
- color: var(--pf-v6-c-breadcrumb__item-divider--Color);
8042
+ .pf-v6-c-menu__item-check .pf-v6-c-check {
8043
+ --pf-v6-c-check__input--TranslateY: none;
8083
8044
  }
8084
8045
 
8085
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
8086
- scale: -1 1;
8046
+ .pf-v6-c-menu__item-toggle-icon {
8047
+ color: var(--pf-v6-c-menu__item-toggle-icon--Color, inherit);
8087
8048
  }
8088
8049
 
8089
- .pf-v6-c-breadcrumb__link {
8090
- padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
8091
- padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
8092
- font-size: inherit;
8093
- font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
8094
- line-height: inherit;
8095
- color: var(--pf-v6-c-breadcrumb__link--Color);
8096
- text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
8097
- text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
8098
- word-break: break-word;
8099
- background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
8050
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-menu__item-toggle-icon {
8051
+ scale: -1 1;
8100
8052
  }
8101
8053
 
8102
- .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
8103
- --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
8104
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
8105
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
8054
+ .pf-v6-c-menu__item-icon {
8055
+ color: var(--pf-v6-c-menu__item--icon--Color, inherit);
8106
8056
  }
8107
8057
 
8108
- .pf-v6-c-breadcrumb__link.pf-m-current {
8109
- cursor: default;
8058
+ .pf-v6-c-menu__item-select-icon,
8059
+ .pf-v6-c-menu__item-external-icon {
8060
+ opacity: 0;
8110
8061
  }
8111
8062
 
8112
- .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
8113
- color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
8114
- text-decoration-line: none;
8063
+ .pf-v6-c-menu__item-toggle-icon.pf-m-favorited, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited),
8064
+ .pf-v6-c-menu__item-action.pf-m-favorited,
8065
+ .pf-v6-c-menu__item-action.pf-m-favorited:hover,
8066
+ .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited) {
8067
+ --pf-v6-c-button--m-plain__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
8115
8068
  }
8116
8069
 
8117
- button.pf-v6-c-breadcrumb__link {
8118
- border: none;
8070
+ .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover:is(:hover, :focus), .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus),
8071
+ .pf-v6-c-menu__item-action.pf-m-favorited:is(:hover, :focus),
8072
+ .pf-v6-c-menu__item-action.pf-m-favorited:hover:is(:hover, :focus),
8073
+ .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button:not(.pf-m-favorited):is(:hover, :focus) {
8074
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
8119
8075
  }
8120
8076
 
8121
- .pf-v6-c-breadcrumb__dropdown {
8122
- margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
8123
- margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
8124
- margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
8125
- margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
8077
+ .pf-v6-c-menu__breadcrumb {
8078
+ --pf-v6-c-breadcrumb__item--FontSize: var(--pf-v6-c-menu__breadcrumb--FontSize);
8079
+ padding-block-start: var(--pf-v6-c-menu__breadcrumb--PaddingBlockStart);
8080
+ padding-block-end: var(--pf-v6-c-menu__breadcrumb--PaddingBlockEnd);
8081
+ padding-inline-start: var(--pf-v6-c-menu__breadcrumb--PaddingInlineStart);
8082
+ padding-inline-end: var(--pf-v6-c-menu__breadcrumb--PaddingInlineEnd);
8126
8083
  }
8127
8084
 
8128
- .pf-v6-c-breadcrumb__heading {
8129
- display: inline;
8130
- font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
8085
+ .pf-v6-c-menu__breadcrumb .pf-v6-c-menu {
8086
+ min-width: auto;
8087
+ padding-block-start: var(--pf-v6-c-menu--PaddingBlockStart);
8088
+ padding-block-end: var(--pf-v6-c-menu--PaddingBlockEnd);
8131
8089
  }
8132
8090
 
8133
- .pf-v6-c-breadcrumb__link,
8134
- .pf-v6-c-breadcrumb__heading {
8135
- white-space: normal;
8091
+ .pf-v6-c-menu__breadcrumb .pf-v6-c-menu__content {
8092
+ height: auto;
8136
8093
  }
8137
8094
 
8138
- .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
8139
- display: none;
8095
+ .pf-v6-c-menu__breadcrumb .pf-v6-c-menu-toggle {
8096
+ --pf-v6-c-menu-toggle--BorderWidth: 0;
8097
+ --pf-v6-c-menu-toggle--BorderColor: transparent;
8098
+ outline-offset: var(--pf-v6-c-menu--OutlineOffset);
8140
8099
  }
8141
8100
 
8142
8101
  .pf-v6-c-spinner {
@@ -8230,77 +8189,118 @@ button.pf-v6-c-breadcrumb__link {
8230
8189
  transform: rotate(720deg);
8231
8190
  }
8232
8191
  }
8233
- .pf-v6-c-badge {
8234
- --pf-v6-c-badge--BorderColor: transparent;
8235
- --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
8236
- --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
8237
- --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
8238
- --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
8239
- --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8240
- --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8241
- --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
8242
- --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
8243
- --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
8244
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
8245
- --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
8246
- --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
8247
- --pf-v6-c-badge--m-read--BorderColor: var(--pf-t--global--border--color--high-contrast);
8248
- --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
8249
- --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
8250
- --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
8251
- --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
8252
- --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
8253
- --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
8254
- --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
8192
+ .pf-v6-c-breadcrumb {
8193
+ --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
8194
+ --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
8195
+ --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
8196
+ --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
8197
+ --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
8198
+ --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
8199
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8200
+ --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8201
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
8202
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
8203
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
8204
+ --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
8205
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
8206
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
8207
+ --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
8208
+ --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
8209
+ --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
8210
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
8211
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
8212
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
8213
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
8255
8214
  }
8256
8215
 
8257
- .pf-v6-c-badge {
8258
- position: relative;
8259
- display: inline-block;
8260
- min-width: var(--pf-v6-c-badge--MinWidth);
8261
- padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
8262
- padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
8263
- font-size: var(--pf-v6-c-badge--FontSize);
8264
- font-weight: var(--pf-v6-c-badge--FontWeight);
8265
- color: var(--pf-v6-c-badge--Color);
8266
- text-align: center;
8216
+ .pf-v6-c-breadcrumb {
8217
+ display: inline-flex;
8218
+ }
8219
+
8220
+ .pf-v6-c-breadcrumb__list {
8221
+ display: flex;
8222
+ flex-wrap: wrap;
8223
+ align-items: center;
8224
+ }
8225
+
8226
+ .pf-v6-c-breadcrumb__item {
8227
+ display: flex;
8228
+ align-items: baseline;
8229
+ font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
8230
+ font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
8231
+ line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
8267
8232
  white-space: nowrap;
8268
- background-color: var(--pf-v6-c-badge--BackgroundColor);
8269
- border-radius: var(--pf-v6-c-badge--BorderRadius);
8233
+ list-style: none;
8270
8234
  }
8271
8235
 
8272
- .pf-v6-c-badge::after {
8273
- position: absolute;
8274
- inset: 0;
8275
- pointer-events: none;
8276
- content: "";
8277
- border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
8278
- border-radius: inherit;
8236
+ .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
8237
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
8279
8238
  }
8280
8239
 
8281
- .pf-v6-c-badge.pf-m-read {
8282
- --pf-v6-c-badge--BorderColor: var(--pf-v6-c-badge--m-read--BorderColor);
8283
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
8284
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
8285
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
8240
+ .pf-v6-c-breadcrumb__item:not(:last-child) {
8241
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
8286
8242
  }
8287
8243
 
8288
- .pf-v6-c-badge.pf-m-unread {
8289
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
8290
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
8291
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
8244
+ .pf-v6-c-breadcrumb__item-divider {
8245
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
8246
+ font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
8247
+ line-height: 1;
8248
+ color: var(--pf-v6-c-breadcrumb__item-divider--Color);
8292
8249
  }
8293
8250
 
8294
- .pf-v6-c-badge.pf-m-disabled {
8295
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
8296
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
8251
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
8252
+ scale: -1 1;
8297
8253
  }
8298
8254
 
8299
- .pf-v6-c-badge.pf-m-disabled::after {
8300
- border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
8255
+ .pf-v6-c-breadcrumb__link {
8256
+ padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
8257
+ padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
8258
+ font-size: inherit;
8259
+ font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
8260
+ line-height: inherit;
8261
+ color: var(--pf-v6-c-breadcrumb__link--Color);
8262
+ text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
8263
+ text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
8264
+ word-break: break-word;
8265
+ background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
8301
8266
  }
8302
8267
 
8303
- .pf-v6-c-badge__toggle-icon {
8304
- margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
8305
- color: var(--pf-v6-c-badge__toggle-icon--Color);
8268
+ .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
8269
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
8270
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
8271
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
8272
+ }
8273
+
8274
+ .pf-v6-c-breadcrumb__link.pf-m-current {
8275
+ cursor: default;
8276
+ }
8277
+
8278
+ .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
8279
+ color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
8280
+ text-decoration-line: none;
8281
+ }
8282
+
8283
+ button.pf-v6-c-breadcrumb__link {
8284
+ border: none;
8285
+ }
8286
+
8287
+ .pf-v6-c-breadcrumb__dropdown {
8288
+ margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
8289
+ margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
8290
+ margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
8291
+ margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
8292
+ }
8293
+
8294
+ .pf-v6-c-breadcrumb__heading {
8295
+ display: inline;
8296
+ font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
8297
+ }
8298
+
8299
+ .pf-v6-c-breadcrumb__link,
8300
+ .pf-v6-c-breadcrumb__heading {
8301
+ white-space: normal;
8302
+ }
8303
+
8304
+ .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
8305
+ display: none;
8306
8306
  }