@patternfly/react-table 6.2.1-prerelease.3 → 6.2.1-prerelease.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/components/package.json +1 -1
  3. package/deprecated/package.json +1 -1
  4. package/dist/dynamic/components/Table/package.json +1 -1
  5. package/dist/dynamic/components/Table/utils/decorators/package.json +1 -1
  6. package/dist/dynamic/components/Table/utils/package.json +1 -1
  7. package/dist/dynamic/deprecated/components/Table/base/package.json +1 -1
  8. package/dist/dynamic/deprecated/components/Table/package.json +1 -1
  9. package/dist/dynamic/deprecated/components/package.json +1 -1
  10. package/dist/umd/assets/{output-By4UZj7d.css → output-DwzzH5CK.css} +738 -740
  11. package/package.json +6 -6
package/dist/umd/assets/{output-By4UZj7d.css → output-DwzzH5CK.css} RENAMED
@@ -1,3 +1,95 @@
1
+ .pf-v6-c-inline-edit {
2
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
3
+ --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4
+ --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
5
+ --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
6
+ --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
7
+ --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
8
+ }
9
+
10
+ .pf-v6-c-inline-edit__group {
11
+ display: flex;
12
+ align-items: baseline;
13
+ }
14
+
15
+ .pf-v6-c-inline-edit__group > * {
16
+ margin-inline-end: var(--pf-v6-c-inline-edit__group--item--MarginInlineEnd);
17
+ }
18
+
19
+ .pf-v6-c-inline-edit__group.pf-m-icon-group {
20
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd);
21
+ }
22
+
23
+ .pf-v6-c-inline-edit__group.pf-m-footer {
24
+ margin-block-start: var(--pf-v6-c-inline-edit__group--m-footer--MarginBlockStart);
25
+ }
26
+
27
+ .pf-v6-c-inline-edit__group.pf-m-column {
28
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
29
+ flex-direction: column;
30
+ }
31
+
32
+ .pf-v6-c-inline-edit__group > :last-child {
33
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
34
+ }
35
+
36
+ .pf-v6-c-inline-edit__input {
37
+ flex: 1;
38
+ }
39
+
40
+ .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain {
41
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color);
42
+ }
43
+
44
+ .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain:hover {
45
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color);
46
+ }
47
+
48
+ .pf-v6-c-inline-edit__input,
49
+ .pf-v6-c-inline-edit__action,
50
+ .pf-v6-c-inline-edit__group.pf-m-action-group {
51
+ display: none;
52
+ }
53
+
54
+ .pf-v6-c-inline-edit__action.pf-m-enable-editable {
55
+ display: inline-block;
56
+ }
57
+
58
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__input,
59
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__input {
60
+ display: block;
61
+ }
62
+
63
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action,
64
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action {
65
+ display: inline-block;
66
+ }
67
+
68
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group,
69
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group {
70
+ display: inline-flex;
71
+ }
72
+
73
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__value,
74
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable,
75
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__value,
76
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable {
77
+ display: none;
78
+ }
79
+
80
+ .pf-v6-c-inline-edit__label + .pf-v6-c-inline-edit__action.pf-m-enable > .pf-v6-c-button {
81
+ margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
82
+ margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
83
+ }
84
+
85
+ .pf-v6-c-inline-edit__label.pf-m-bold {
86
+ font-weight: var(--pf-v6-c-inline-edit__label--m-bold--FontWeight);
87
+ }
88
+
89
+ .pf-v6-c-inline-edit__editable-text br {
90
+ display: none;
91
+ }
92
+
1
93
  .pf-v6-c-table {
2
94
  --pf-v6-c-table__tree-view-main--indent--base: calc(var(--pf-t--global--spacer--md) * 2 + var(--pf-v6-c-table__tree-view-icon--MinWidth));
3
95
  --pf-v6-c-table__tree-view-main--nested-indent--base: calc(var(--pf-v6-c-table__tree-view-main--indent--base) - var(--pf-t--global--spacer--md));
@@ -1832,74 +1924,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
1832
1924
  --pf-v6-c-table--cell--Width: 100%;
1833
1925
  }
1834
1926
 
1835
- .pf-v6-c-table {
1836
- --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
1837
- --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
1838
- --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
1839
- --pf-v6-c-table__sticky-cell--InsetInlineEnd: auto;
1840
- --pf-v6-c-table__sticky-cell--InsetInlineStart: auto;
1841
- --pf-v6-c-table__sticky-cell--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1842
- --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
1843
- --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
1844
- --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
1845
- --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
1846
- --pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd: 0;
1847
- --pf-v6-c-table__sticky-cell--m-left--InsetInlineStart: 0;
1848
- --pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex: calc(var(--pf-v6-c-table__sticky-cell--ZIndex) + 1);
1849
- }
1850
-
1851
- .pf-v6-c-table .pf-v6-c-table__sticky-cell {
1852
- position: sticky;
1853
- inset-inline-start: var(--pf-v6-c-table__sticky-cell--InsetInlineStart);
1854
- inset-inline-end: var(--pf-v6-c-table__sticky-cell--InsetInlineEnd);
1855
- z-index: var(--pf-v6-c-table__sticky-cell--ZIndex);
1856
- min-width: var(--pf-v6-c-table__sticky-cell--MinWidth);
1857
- }
1858
-
1859
- .pf-v6-c-table__sticky-cell {
1860
- --pf-v6-c-table--cell--Overflow: visible;
1861
- --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex);
1862
- background-color: var(--pf-v6-c-table__sticky-cell--BackgroundColor);
1863
- background-clip: padding-box;
1864
- }
1865
-
1866
- .pf-v6-c-table__sticky-cell.pf-m-border-right::before {
1867
- --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth);
1868
- --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor);
1869
- }
1870
-
1871
- .pf-v6-c-table__sticky-cell.pf-m-border-left::before {
1872
- --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth);
1873
- --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor);
1874
- }
1875
-
1876
- .pf-v6-c-table__sticky-cell.pf-m-right, .pf-v6-c-table__sticky-cell.pf-m-inline-end {
1877
- --pf-v6-c-table__sticky-cell--InsetInlineEnd: var(--pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd);
1878
- }
1879
-
1880
- .pf-v6-c-table__sticky-cell.pf-m-left, .pf-v6-c-table__sticky-cell.pf-m-inline-start {
1881
- --pf-v6-c-table__sticky-cell--InsetInlineStart: var(--pf-v6-c-table__sticky-cell--m-left--InsetInlineStart);
1882
- }
1883
-
1884
- .pf-v6-c-scroll-outer-wrapper {
1885
- --pf-v6-c-scroll-outer-wrapper--MinHeight: 25rem;
1886
- --pf-v6-c-scroll-outer-wrapper--MaxHeight: 100%;
1887
- display: flex;
1888
- flex-direction: column;
1889
- max-width: 100%;
1890
- min-height: var(--pf-v6-c-scroll-outer-wrapper--MinHeight);
1891
- max-height: var(--pf-v6-c-scroll-outer-wrapper--MaxHeight);
1892
- overflow: hidden;
1893
- }
1894
-
1895
- .pf-v6-c-scroll-inner-wrapper {
1896
- display: flex;
1897
- flex-direction: column;
1898
- max-width: 100%;
1899
- max-height: 100%;
1900
- overflow: auto;
1901
- }
1902
-
1903
1927
  .pf-v6-c-table {
1904
1928
  --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
1905
1929
  --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
@@ -4064,114 +4088,90 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4064
4088
  margin-block-end: var(--pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd);
4065
4089
  }
4066
4090
 
4067
- .pf-v6-c-inline-edit {
4068
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
4069
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4070
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
4071
- --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
4072
- --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
4073
- --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
4091
+ .pf-v6-c-table {
4092
+ --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
4093
+ --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
4094
+ --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
4095
+ --pf-v6-c-table__sticky-cell--InsetInlineEnd: auto;
4096
+ --pf-v6-c-table__sticky-cell--InsetInlineStart: auto;
4097
+ --pf-v6-c-table__sticky-cell--BackgroundColor: var(--pf-t--global--background--color--primary--default);
4098
+ --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
4099
+ --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
4100
+ --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
4101
+ --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
4102
+ --pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd: 0;
4103
+ --pf-v6-c-table__sticky-cell--m-left--InsetInlineStart: 0;
4104
+ --pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex: calc(var(--pf-v6-c-table__sticky-cell--ZIndex) + 1);
4074
4105
  }
4075
4106
 
4076
- .pf-v6-c-inline-edit__group {
4077
- display: flex;
4078
- align-items: baseline;
4107
+ .pf-v6-c-table .pf-v6-c-table__sticky-cell {
4108
+ position: sticky;
4109
+ inset-inline-start: var(--pf-v6-c-table__sticky-cell--InsetInlineStart);
4110
+ inset-inline-end: var(--pf-v6-c-table__sticky-cell--InsetInlineEnd);
4111
+ z-index: var(--pf-v6-c-table__sticky-cell--ZIndex);
4112
+ min-width: var(--pf-v6-c-table__sticky-cell--MinWidth);
4079
4113
  }
4080
4114
 
4081
- .pf-v6-c-inline-edit__group > * {
4082
- margin-inline-end: var(--pf-v6-c-inline-edit__group--item--MarginInlineEnd);
4115
+ .pf-v6-c-table__sticky-cell {
4116
+ --pf-v6-c-table--cell--Overflow: visible;
4117
+ --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex);
4118
+ background-color: var(--pf-v6-c-table__sticky-cell--BackgroundColor);
4119
+ background-clip: padding-box;
4083
4120
  }
4084
4121
 
4085
- .pf-v6-c-inline-edit__group.pf-m-icon-group {
4086
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd);
4122
+ .pf-v6-c-table__sticky-cell.pf-m-border-right::before {
4123
+ --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth);
4124
+ --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor);
4087
4125
  }
4088
4126
 
4089
- .pf-v6-c-inline-edit__group.pf-m-footer {
4090
- margin-block-start: var(--pf-v6-c-inline-edit__group--m-footer--MarginBlockStart);
4127
+ .pf-v6-c-table__sticky-cell.pf-m-border-left::before {
4128
+ --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth);
4129
+ --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor);
4091
4130
  }
4092
4131
 
4093
- .pf-v6-c-inline-edit__group.pf-m-column {
4094
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
4095
- flex-direction: column;
4132
+ .pf-v6-c-table__sticky-cell.pf-m-right, .pf-v6-c-table__sticky-cell.pf-m-inline-end {
4133
+ --pf-v6-c-table__sticky-cell--InsetInlineEnd: var(--pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd);
4096
4134
  }
4097
4135
 
4098
- .pf-v6-c-inline-edit__group > :last-child {
4099
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
4136
+ .pf-v6-c-table__sticky-cell.pf-m-left, .pf-v6-c-table__sticky-cell.pf-m-inline-start {
4137
+ --pf-v6-c-table__sticky-cell--InsetInlineStart: var(--pf-v6-c-table__sticky-cell--m-left--InsetInlineStart);
4100
4138
  }
4101
4139
 
4102
- .pf-v6-c-inline-edit__input {
4103
- flex: 1;
4140
+ .pf-v6-c-scroll-outer-wrapper {
4141
+ --pf-v6-c-scroll-outer-wrapper--MinHeight: 25rem;
4142
+ --pf-v6-c-scroll-outer-wrapper--MaxHeight: 100%;
4143
+ display: flex;
4144
+ flex-direction: column;
4145
+ max-width: 100%;
4146
+ min-height: var(--pf-v6-c-scroll-outer-wrapper--MinHeight);
4147
+ max-height: var(--pf-v6-c-scroll-outer-wrapper--MaxHeight);
4148
+ overflow: hidden;
4104
4149
  }
4105
4150
 
4106
- .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain {
4107
- --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color);
4151
+ .pf-v6-c-scroll-inner-wrapper {
4152
+ display: flex;
4153
+ flex-direction: column;
4154
+ max-width: 100%;
4155
+ max-height: 100%;
4156
+ overflow: auto;
4108
4157
  }
4109
4158
 
4110
- .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain:hover {
4111
- --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color);
4159
+ .pf-v6-u-screen-reader {
4160
+ position: fixed;
4161
+ inset-block-start: 0;
4162
+ inset-inline-start: 0;
4163
+ overflow: hidden;
4164
+ clip: rect(0, 0, 0, 0);
4165
+ white-space: nowrap;
4166
+ border: 0;
4112
4167
  }
4113
4168
 
4114
- .pf-v6-c-inline-edit__input,
4115
- .pf-v6-c-inline-edit__action,
4116
- .pf-v6-c-inline-edit__group.pf-m-action-group {
4117
- display: none;
4118
- }
4119
-
4120
- .pf-v6-c-inline-edit__action.pf-m-enable-editable {
4121
- display: inline-block;
4122
- }
4123
-
4124
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__input,
4125
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__input {
4126
- display: block;
4127
- }
4128
-
4129
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action,
4130
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action {
4131
- display: inline-block;
4132
- }
4133
-
4134
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group,
4135
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group {
4136
- display: inline-flex;
4137
- }
4138
-
4139
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__value,
4140
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable,
4141
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__value,
4142
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable {
4143
- display: none;
4144
- }
4145
-
4146
- .pf-v6-c-inline-edit__label + .pf-v6-c-inline-edit__action.pf-m-enable > .pf-v6-c-button {
4147
- margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
4148
- margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
4149
- }
4150
-
4151
- .pf-v6-c-inline-edit__label.pf-m-bold {
4152
- font-weight: var(--pf-v6-c-inline-edit__label--m-bold--FontWeight);
4153
- }
4154
-
4155
- .pf-v6-c-inline-edit__editable-text br {
4156
- display: none;
4157
- }
4158
-
4159
- .pf-v6-u-screen-reader {
4160
- position: fixed;
4161
- inset-block-start: 0;
4162
- inset-inline-start: 0;
4163
- overflow: hidden;
4164
- clip: rect(0, 0, 0, 0);
4165
- white-space: nowrap;
4166
- border: 0;
4167
- }
4168
-
4169
- .pf-v6-u-visible {
4170
- position: static;
4171
- overflow: visible;
4172
- clip: auto;
4173
- white-space: normal;
4174
- border: inherit;
4169
+ .pf-v6-u-visible {
4170
+ position: static;
4171
+ overflow: visible;
4172
+ clip: auto;
4173
+ white-space: normal;
4174
+ border: inherit;
4175
4175
  }
4176
4176
 
4177
4177
  .pf-v6-u-hidden {
@@ -5041,206 +5041,426 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
5041
5041
  color: var(--pf-v6-c-check__label-required--Color);
5042
5042
  }
5043
5043
 
5044
- .pf-v6-c-button {
5045
- --pf-v6-c-button--Display: inline-flex;
5046
- --pf-v6-c-button--AlignItems: baseline;
5047
- --pf-v6-c-button--JustifyContent: center;
5048
- --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5049
- --pf-v6-c-button--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--PaddingBlockStart) + var(--pf-v6-c-button--PaddingBlockEnd));
5050
- --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5051
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5052
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
5053
- --pf-v6-c-button--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5054
- --pf-v6-c-button--Color: var(--pf-t--global--text--color--regular);
5055
- --pf-v6-c-button--LineHeight: var(--pf-t--global--font--line-height--body);
5056
- --pf-v6-c-button--FontWeight: var(--pf-t--global--font--weight--body--default);
5057
- --pf-v6-c-button--FontSize: var(--pf-t--global--font--size--body--default);
5058
- --pf-v6-c-button--BackgroundColor: transparent;
5059
- --pf-v6-c-button--BorderColor: transparent;
5060
- --pf-v6-c-button--BorderWidth: var(--pf-t--global--border--width--action--default);
5061
- --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
5062
- --pf-v6-c-button--TextDecorationLine: none;
5063
- --pf-v6-c-button--TextDecorationStyle: none;
5064
- --pf-v6-c-button--TextDecorationColor: currentcolor;
5065
- --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
5066
- --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
5067
- --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
5068
- --pf-v6-c-button--hover--BackgroundColor: transparent;
5069
- --pf-v6-c-button--hover--BorderColor: transparent;
5070
- --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
5071
- --pf-v6-c-button--hover--TextDecorationLine: none;
5072
- --pf-v6-c-button--hover--TextDecorationStyle: none;
5073
- --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
5074
- --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
5075
- --pf-v6-c-button--m-clicked--BorderColor: transparent;
5076
- --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5077
- --pf-v6-c-button--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
5078
- --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
5079
- --pf-v6-c-button--m-primary__icon--Color: var(--pf-t--global--icon--color--on-brand--default);
5080
- --pf-v6-c-button--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
5081
- --pf-v6-c-button--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5082
- --pf-v6-c-button--m-primary--hover__icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
5083
- --pf-v6-c-button--m-primary--m-clicked--Color: var(--pf-t--global--text--color--on-brand--clicked);
5084
- --pf-v6-c-button--m-primary--m-clicked--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5085
- --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
5086
- --pf-v6-c-button--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
5087
- --pf-v6-c-button--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
5088
- --pf-v6-c-button--m-secondary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5089
- --pf-v6-c-button--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--default);
5090
- --pf-v6-c-button--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5091
- --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
5092
- --pf-v6-c-button--m-secondary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5093
- --pf-v6-c-button--m-secondary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5094
- --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-t--global--border--color--brand--clicked);
5095
- --pf-v6-c-button--m-secondary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5096
- --pf-v6-c-button--m-secondary--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
5097
- --pf-v6-c-button--m-secondary--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5098
- --pf-v6-c-button--m-secondary--m-danger__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5099
- --pf-v6-c-button--m-secondary--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
5100
- --pf-v6-c-button--m-secondary--m-danger--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
5101
- --pf-v6-c-button--m-secondary--m-danger--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
5102
- --pf-v6-c-button--m-secondary--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
5103
- --pf-v6-c-button--m-secondary--m-danger--m-clicked--BorderColor: var(--pf-t--global--border--color--status--danger--clicked);
5104
- --pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--danger--clicked);
5105
- --pf-v6-c-button--m-tertiary--Color: var(--pf-t--global--text--color--brand--default);
5106
- --pf-v6-c-button--m-tertiary--BorderColor: var(--pf-t--global--border--color--default);
5107
- --pf-v6-c-button--m-tertiary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5108
- --pf-v6-c-button--m-tertiary__icon--Color: var(--pf-t--global--icon--color--brand--default);
5109
- --pf-v6-c-button--m-tertiary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5110
- --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--hover);
5111
- --pf-v6-c-button--m-tertiary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5112
- --pf-v6-c-button--m-tertiary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5113
- --pf-v6-c-button--m-tertiary--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
5114
- --pf-v6-c-button--m-tertiary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5115
- --pf-v6-c-button--m-link--BorderRadius: var(--pf-t--global--border--radius--small);
5116
- --pf-v6-c-button--m-link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5117
- --pf-v6-c-button--m-link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5118
- --pf-v6-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
5119
- --pf-v6-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5120
- --pf-v6-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
5121
- --pf-v6-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
5122
- --pf-v6-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5123
- --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-t--global--text--color--brand--hover);
5124
- --pf-v6-c-button--m-link--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5125
- --pf-v6-c-button--m-link--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5126
- --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-t--global--text--color--brand--clicked);
5127
- --pf-v6-c-button--m-link--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5128
- --pf-v6-c-button--m-link--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5129
- --pf-v6-c-button--m-link--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
5130
- --pf-v6-c-button--m-link--m-danger--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5131
- --pf-v6-c-button--m-link--m-danger__icon--Color: var(--pf-t--global--text--color--status--danger--default);
5132
- --pf-v6-c-button--m-link--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
5133
- --pf-v6-c-button--m-link--m-danger--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5134
- --pf-v6-c-button--m-link--m-danger--hover__icon--Color: var(--pf-t--global--text--color--status--danger--hover);
5135
- --pf-v6-c-button--m-link--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
5136
- --pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5137
- --pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color: var(--pf-t--global--text--color--status--danger--clicked);
5138
- --pf-v6-c-button--m-link--m-inline--Display: inline-flex;
5139
- --pf-v6-c-button--m-link--m-inline--JustifyContent: flex-start;
5140
- --pf-v6-c-button--m-link--m-inline--FontSize: initial;
5141
- --pf-v6-c-button--m-link--m-inline--LineHeight: initial;
5142
- --pf-v6-c-button--m-link--m-inline--FontWeight: initial;
5143
- --pf-v6-c-button--m-link--m-inline--PaddingBlockStart: 0;
5144
- --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
5145
- --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
5146
- --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
5147
- --pf-v6-c-button--m-link--m-inline--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
5148
- --pf-v6-c-button--m-link--m-inline--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
5149
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
5150
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
5151
- --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
5152
- --pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart: calc(var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart) + 1rem + var(--pf-t--global--spacer--sm));
5153
- --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
5154
- --pf-v6-c-button--m-link--m-inline--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5155
- --pf-v6-c-button--span--m-link--m-inline--Display: inline;
5156
- --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
5157
- --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
5158
- --pf-v6-c-button--m-link--m-inline--Color: var(--pf-t--global--text--color--brand--default);
5159
- --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
5160
- --pf-v6-c-button--m-link--m-inline--TextDecorationColor: currentcolor;
5161
- --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
5162
- --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5163
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: currentcolor;
5164
- --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
5165
- --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5166
- --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5167
- --pf-v6-c-button--m-plain--Color: var(--pf-t--global--icon--color--regular);
5168
- --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--text--color--regular);
5169
- --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5170
- --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
5171
- --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5172
- --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
5173
- --pf-v6-c-button--m-plain--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5174
- --pf-v6-c-button--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
5175
- --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5176
- --pf-v6-c-button--m-plain--disabled--BackgroundColor: transparent;
5177
- --pf-v6-c-button--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5178
- --pf-v6-c-button--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5179
- --pf-v6-c-button--m-plain--m-no-padding--MinWidth: auto;
5180
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: 0;
5181
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
5182
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: 0;
5183
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: 0;
5184
- --pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineStart: 0;
5185
- --pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineEnd: 0;
5186
- --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-t--global--icon--color--subtle);
5187
- --pf-v6-c-button--m-plain--m-no-padding--BackgroundColor: transparent;
5188
- --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-t--global--icon--color--regular);
5189
- --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
5190
- --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
5191
- --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
5192
- --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--small);
5193
- --pf-v6-c-button--m-control--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5194
- --pf-v6-c-button--m-control--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5195
- --pf-v6-c-button--m-control--Color: var(--pf-t--global--text--color--regular);
5196
- --pf-v6-c-button--m-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
5197
- --pf-v6-c-button--m-control--BorderColor: var(--pf-t--global--border--color--default);
5198
- --pf-v6-c-button--m-control--BorderWidth: var(--pf-t--global--border--width--control--default);
5199
- --pf-v6-c-button--m-control__icon--Color: var(--pf-t--global--icon--color--regular);
5200
- --pf-v6-c-button--m-control--hover--Color: var(--pf-t--global--text--color--regular);
5201
- --pf-v6-c-button--m-control--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5202
- --pf-v6-c-button--m-control--hover--BorderColor: var(--pf-t--global--border--color--hover);
5203
- --pf-v6-c-button--m-control--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
5204
- --pf-v6-c-button--m-control--hover__icon--Color: var(--pf-t--global--icon--color--regular);
5205
- --pf-v6-c-button--m-control--m-clicked--Color: var(--pf-t--global--text--color--regular);
5206
- --pf-v6-c-button--m-control--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
5207
- --pf-v6-c-button--m-control--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
5208
- --pf-v6-c-button--m-control--m-clicked--BorderWidth: var(--pf-t--global--border--width--control--clicked);
5209
- --pf-v6-c-button--m-control--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
5210
- --pf-v6-c-button--m-control--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5211
- --pf-v6-c-button--m-control--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5212
- --pf-v6-c-button--m-stateful--BorderRadius: var(--pf-t--global--border--radius--small);
5213
- --pf-v6-c-button--m-stateful--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5214
- --pf-v6-c-button--m-stateful--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5215
- --pf-v6-c-button--m-stateful--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5216
- --pf-v6-c-button--m-stateful--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5217
- --pf-v6-c-button--m-read--BackgroundColor: var(--pf-t--global--background--color--control--default);
5218
- --pf-v6-c-button--m-read--BorderColor: var(--pf-t--global--border--color--default);
5219
- --pf-v6-c-button--m-read--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5220
- --pf-v6-c-button--m-read--hover--BorderColor: var(--pf-t--global--border--color--hover);
5221
- --pf-v6-c-button--m-read--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
5222
- --pf-v6-c-button--m-read--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
5223
- --pf-v6-c-button--m-unread--Color: var(--pf-t--global--text--color--status--unread--on-default--default);
5224
- --pf-v6-c-button--m-unread--BackgroundColor: var(--pf-t--global--color--status--unread--default);
5225
- --pf-v6-c-button--m-unread__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--default);
5226
- --pf-v6-c-button--m-unread--hover--Color: var(--pf-t--global--text--color--status--unread--on-default--hover);
5227
- --pf-v6-c-button--m-unread--hover--BackgroundColor: var(--pf-t--global--color--status--unread--hover);
5228
- --pf-v6-c-button--m-unread--hover__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--hover);
5229
- --pf-v6-c-button--m-unread--m-clicked--Color: var(--pf-t--global--text--color--status--unread--on-default--clicked);
5230
- --pf-v6-c-button--m-unread--m-clicked--BackgroundColor: var(--pf-t--global--color--status--unread--clicked);
5231
- --pf-v6-c-button--m-unread--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--clicked);
5232
- --pf-v6-c-button--m-attention--Color: var(--pf-t--global--text--color--status--unread--on-attention--default);
5233
- --pf-v6-c-button--m-attention--BackgroundColor: var(--pf-t--global--color--status--unread--attention--default);
5234
- --pf-v6-c-button--m-attention__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--default);
5235
- --pf-v6-c-button--m-attention--hover--Color: var(--pf-t--global--text--color--status--unread--on-attention--hover);
5236
- --pf-v6-c-button--m-attention--hover--BackgroundColor: var(--pf-t--global--color--status--unread--attention--hover);
5237
- --pf-v6-c-button--m-attention--hover__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--hover);
5238
- --pf-v6-c-button--m-attention--m-clicked--Color: var(--pf-t--global--text--color--status--unread--on-attention--clicked);
5239
- --pf-v6-c-button--m-attention--m-clicked--BackgroundColor: var(--pf-t--global--color--status--unread--attention--clicked);
5240
- --pf-v6-c-button--m-attention--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--clicked);
5241
- --pf-v6-c-button--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
5242
- --pf-v6-c-button--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
5243
- --pf-v6-c-button--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
5044
+ .pf-v6-c-popover {
5045
+ --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
5046
+ --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
5047
+ --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
5048
+ --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
5049
+ --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
5050
+ --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5051
+ --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
5052
+ --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
5053
+ --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
5054
+ --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
5055
+ --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5056
+ --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
5057
+ --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
5058
+ --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
5059
+ --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
5060
+ --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
5061
+ --pf-v6-c-popover__arrow--Width: 0.9375rem;
5062
+ --pf-v6-c-popover__arrow--Height: 0.9375rem;
5063
+ --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
5064
+ --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5065
+ --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
5066
+ --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
5067
+ --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
5068
+ --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
5069
+ --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
5070
+ --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
5071
+ --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
5072
+ --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
5073
+ --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
5074
+ --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
5075
+ --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
5076
+ --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
5077
+ --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
5078
+ --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
5079
+ --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
5080
+ --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
5081
+ --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
5082
+ --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
5083
+ --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
5084
+ --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
5085
+ --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
5086
+ --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
5087
+ --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
5088
+ --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
5089
+ --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
5090
+ --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
5091
+ --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
5092
+ }
5093
+
5094
+ .pf-v6-c-popover {
5095
+ position: relative;
5096
+ min-width: var(--pf-v6-c-popover--MinWidth);
5097
+ max-width: var(--pf-v6-c-popover--MaxWidth);
5098
+ font-size: var(--pf-v6-c-popover--FontSize);
5099
+ border-radius: var(--pf-v6-c-popover--BorderRadius);
5100
+ box-shadow: var(--pf-v6-c-popover--BoxShadow);
5101
+ }
5102
+
5103
+ .pf-v6-c-popover.pf-m-no-padding {
5104
+ --pf-v6-c-popover__content--PaddingBlockStart: 0px;
5105
+ --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
5106
+ --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
5107
+ --pf-v6-c-popover__content--PaddingInlineStart: 0px;
5108
+ }
5109
+
5110
+ .pf-v6-c-popover.pf-m-width-auto {
5111
+ --pf-v6-c-popover--MinWidth: auto;
5112
+ --pf-v6-c-popover--MaxWidth: none;
5113
+ }
5114
+
5115
+ .pf-v6-c-popover:is(.pf-m-top,
5116
+ .pf-m-top-left,
5117
+ .pf-m-top-right) {
5118
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
5119
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
5120
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
5121
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
5122
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
5123
+ }
5124
+
5125
+ .pf-v6-c-popover:is(.pf-m-bottom,
5126
+ .pf-m-bottom-left,
5127
+ .pf-m-bottom-right) {
5128
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
5129
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
5130
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
5131
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
5132
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
5133
+ }
5134
+
5135
+ .pf-v6-c-popover:is(.pf-m-left,
5136
+ .pf-m-left-top,
5137
+ .pf-m-left-bottom) {
5138
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
5139
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
5140
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
5141
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
5142
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
5143
+ }
5144
+
5145
+ .pf-v6-c-popover:is(.pf-m-right,
5146
+ .pf-m-right-top,
5147
+ .pf-m-right-bottom) {
5148
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
5149
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
5150
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
5151
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
5152
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
5153
+ }
5154
+
5155
+ .pf-v6-c-popover:is(.pf-m-left-top,
5156
+ .pf-m-right-top) {
5157
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
5158
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
5159
+ }
5160
+
5161
+ .pf-v6-c-popover:is(.pf-m-left-bottom,
5162
+ .pf-m-right-bottom) {
5163
+ --pf-v6-c-popover__arrow--InsetBlockStart: auto;
5164
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
5165
+ }
5166
+
5167
+ .pf-v6-c-popover:is(.pf-m-top-left,
5168
+ .pf-m-bottom-left) {
5169
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
5170
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
5171
+ }
5172
+
5173
+ .pf-v6-c-popover:is(.pf-m-top-right,
5174
+ .pf-m-bottom-right) {
5175
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
5176
+ --pf-v6-c-popover__arrow--InsetInlineStart: auto;
5177
+ }
5178
+
5179
+ .pf-v6-c-popover.pf-m-danger {
5180
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
5181
+ }
5182
+
5183
+ .pf-v6-c-popover.pf-m-warning {
5184
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
5185
+ }
5186
+
5187
+ .pf-v6-c-popover.pf-m-success {
5188
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
5189
+ }
5190
+
5191
+ .pf-v6-c-popover.pf-m-custom {
5192
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
5193
+ }
5194
+
5195
+ .pf-v6-c-popover.pf-m-info {
5196
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
5197
+ }
5198
+
5199
+ .pf-v6-c-popover__content {
5200
+ position: relative;
5201
+ padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
5202
+ padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
5203
+ padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
5204
+ padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
5205
+ background-color: var(--pf-v6-c-popover__content--BackgroundColor);
5206
+ border-radius: var(--pf-v6-c-popover__content--BorderRadius);
5207
+ }
5208
+
5209
+ .pf-v6-c-popover__close {
5210
+ position: absolute;
5211
+ inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
5212
+ inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
5213
+ }
5214
+
5215
+ .pf-v6-c-popover__close + * {
5216
+ padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
5217
+ }
5218
+
5219
+ .pf-v6-c-popover__arrow {
5220
+ position: absolute;
5221
+ top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
5222
+ right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
5223
+ bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
5224
+ left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
5225
+ width: var(--pf-v6-c-popover__arrow--Width);
5226
+ height: var(--pf-v6-c-popover__arrow--Height);
5227
+ pointer-events: none;
5228
+ background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
5229
+ box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
5230
+ 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));
5231
+ }
5232
+
5233
+ .pf-v6-c-popover__header {
5234
+ margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
5235
+ }
5236
+
5237
+ .pf-v6-c-popover__title {
5238
+ display: flex;
5239
+ flex: 0 0 auto;
5240
+ }
5241
+
5242
+ .pf-v6-c-popover__title-icon {
5243
+ margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
5244
+ font-size: var(--pf-v6-c-popover__title-icon--FontSize);
5245
+ color: var(--pf-v6-c-popover__title-icon--Color);
5246
+ }
5247
+
5248
+ .pf-v6-c-popover__title-text {
5249
+ min-width: 0;
5250
+ font-size: var(--pf-v6-c-popover__title-text--FontSize);
5251
+ font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
5252
+ color: var(--pf-v6-c-popover__title-text--Color);
5253
+ overflow-wrap: break-word;
5254
+ }
5255
+
5256
+ .pf-v6-c-popover__body {
5257
+ word-wrap: break-word;
5258
+ }
5259
+
5260
+ .pf-v6-c-popover__footer {
5261
+ margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
5262
+ }
5263
+
5264
+ .pf-v6-c-button {
5265
+ --pf-v6-c-button--Display: inline-flex;
5266
+ --pf-v6-c-button--AlignItems: baseline;
5267
+ --pf-v6-c-button--JustifyContent: center;
5268
+ --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5269
+ --pf-v6-c-button--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--PaddingBlockStart) + var(--pf-v6-c-button--PaddingBlockEnd));
5270
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5271
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5272
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
5273
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5274
+ --pf-v6-c-button--Color: var(--pf-t--global--text--color--regular);
5275
+ --pf-v6-c-button--LineHeight: var(--pf-t--global--font--line-height--body);
5276
+ --pf-v6-c-button--FontWeight: var(--pf-t--global--font--weight--body--default);
5277
+ --pf-v6-c-button--FontSize: var(--pf-t--global--font--size--body--default);
5278
+ --pf-v6-c-button--BackgroundColor: transparent;
5279
+ --pf-v6-c-button--BorderColor: transparent;
5280
+ --pf-v6-c-button--BorderWidth: var(--pf-t--global--border--width--action--default);
5281
+ --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
5282
+ --pf-v6-c-button--TextDecorationLine: none;
5283
+ --pf-v6-c-button--TextDecorationStyle: none;
5284
+ --pf-v6-c-button--TextDecorationColor: currentcolor;
5285
+ --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
5286
+ --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
5287
+ --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
5288
+ --pf-v6-c-button--hover--BackgroundColor: transparent;
5289
+ --pf-v6-c-button--hover--BorderColor: transparent;
5290
+ --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
5291
+ --pf-v6-c-button--hover--TextDecorationLine: none;
5292
+ --pf-v6-c-button--hover--TextDecorationStyle: none;
5293
+ --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
5294
+ --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
5295
+ --pf-v6-c-button--m-clicked--BorderColor: transparent;
5296
+ --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5297
+ --pf-v6-c-button--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
5298
+ --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
5299
+ --pf-v6-c-button--m-primary__icon--Color: var(--pf-t--global--icon--color--on-brand--default);
5300
+ --pf-v6-c-button--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
5301
+ --pf-v6-c-button--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5302
+ --pf-v6-c-button--m-primary--hover__icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
5303
+ --pf-v6-c-button--m-primary--m-clicked--Color: var(--pf-t--global--text--color--on-brand--clicked);
5304
+ --pf-v6-c-button--m-primary--m-clicked--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5305
+ --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
5306
+ --pf-v6-c-button--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
5307
+ --pf-v6-c-button--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
5308
+ --pf-v6-c-button--m-secondary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5309
+ --pf-v6-c-button--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--default);
5310
+ --pf-v6-c-button--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5311
+ --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
5312
+ --pf-v6-c-button--m-secondary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5313
+ --pf-v6-c-button--m-secondary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5314
+ --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-t--global--border--color--brand--clicked);
5315
+ --pf-v6-c-button--m-secondary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5316
+ --pf-v6-c-button--m-secondary--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
5317
+ --pf-v6-c-button--m-secondary--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5318
+ --pf-v6-c-button--m-secondary--m-danger__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5319
+ --pf-v6-c-button--m-secondary--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
5320
+ --pf-v6-c-button--m-secondary--m-danger--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
5321
+ --pf-v6-c-button--m-secondary--m-danger--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
5322
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
5323
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked--BorderColor: var(--pf-t--global--border--color--status--danger--clicked);
5324
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--danger--clicked);
5325
+ --pf-v6-c-button--m-tertiary--Color: var(--pf-t--global--text--color--brand--default);
5326
+ --pf-v6-c-button--m-tertiary--BorderColor: var(--pf-t--global--border--color--default);
5327
+ --pf-v6-c-button--m-tertiary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5328
+ --pf-v6-c-button--m-tertiary__icon--Color: var(--pf-t--global--icon--color--brand--default);
5329
+ --pf-v6-c-button--m-tertiary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5330
+ --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--hover);
5331
+ --pf-v6-c-button--m-tertiary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5332
+ --pf-v6-c-button--m-tertiary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5333
+ --pf-v6-c-button--m-tertiary--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
5334
+ --pf-v6-c-button--m-tertiary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5335
+ --pf-v6-c-button--m-link--BorderRadius: var(--pf-t--global--border--radius--small);
5336
+ --pf-v6-c-button--m-link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5337
+ --pf-v6-c-button--m-link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5338
+ --pf-v6-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
5339
+ --pf-v6-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5340
+ --pf-v6-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
5341
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
5342
+ --pf-v6-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5343
+ --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-t--global--text--color--brand--hover);
5344
+ --pf-v6-c-button--m-link--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5345
+ --pf-v6-c-button--m-link--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5346
+ --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-t--global--text--color--brand--clicked);
5347
+ --pf-v6-c-button--m-link--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5348
+ --pf-v6-c-button--m-link--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5349
+ --pf-v6-c-button--m-link--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
5350
+ --pf-v6-c-button--m-link--m-danger--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5351
+ --pf-v6-c-button--m-link--m-danger__icon--Color: var(--pf-t--global--text--color--status--danger--default);
5352
+ --pf-v6-c-button--m-link--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
5353
+ --pf-v6-c-button--m-link--m-danger--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5354
+ --pf-v6-c-button--m-link--m-danger--hover__icon--Color: var(--pf-t--global--text--color--status--danger--hover);
5355
+ --pf-v6-c-button--m-link--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
5356
+ --pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5357
+ --pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color: var(--pf-t--global--text--color--status--danger--clicked);
5358
+ --pf-v6-c-button--m-link--m-inline--Display: inline-flex;
5359
+ --pf-v6-c-button--m-link--m-inline--JustifyContent: flex-start;
5360
+ --pf-v6-c-button--m-link--m-inline--FontSize: initial;
5361
+ --pf-v6-c-button--m-link--m-inline--LineHeight: initial;
5362
+ --pf-v6-c-button--m-link--m-inline--FontWeight: initial;
5363
+ --pf-v6-c-button--m-link--m-inline--PaddingBlockStart: 0;
5364
+ --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
5365
+ --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
5366
+ --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
5367
+ --pf-v6-c-button--m-link--m-inline--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
5368
+ --pf-v6-c-button--m-link--m-inline--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
5369
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
5370
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
5371
+ --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
5372
+ --pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart: calc(var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart) + 1rem + var(--pf-t--global--spacer--sm));
5373
+ --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
5374
+ --pf-v6-c-button--m-link--m-inline--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5375
+ --pf-v6-c-button--span--m-link--m-inline--Display: inline;
5376
+ --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
5377
+ --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
5378
+ --pf-v6-c-button--m-link--m-inline--Color: var(--pf-t--global--text--color--brand--default);
5379
+ --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
5380
+ --pf-v6-c-button--m-link--m-inline--TextDecorationColor: currentcolor;
5381
+ --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
5382
+ --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5383
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: currentcolor;
5384
+ --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
5385
+ --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5386
+ --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5387
+ --pf-v6-c-button--m-plain--Color: var(--pf-t--global--icon--color--regular);
5388
+ --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--text--color--regular);
5389
+ --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5390
+ --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
5391
+ --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5392
+ --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
5393
+ --pf-v6-c-button--m-plain--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5394
+ --pf-v6-c-button--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
5395
+ --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5396
+ --pf-v6-c-button--m-plain--disabled--BackgroundColor: transparent;
5397
+ --pf-v6-c-button--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5398
+ --pf-v6-c-button--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5399
+ --pf-v6-c-button--m-plain--m-no-padding--MinWidth: auto;
5400
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: 0;
5401
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
5402
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: 0;
5403
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: 0;
5404
+ --pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineStart: 0;
5405
+ --pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineEnd: 0;
5406
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-t--global--icon--color--subtle);
5407
+ --pf-v6-c-button--m-plain--m-no-padding--BackgroundColor: transparent;
5408
+ --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-t--global--icon--color--regular);
5409
+ --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
5410
+ --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
5411
+ --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
5412
+ --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--small);
5413
+ --pf-v6-c-button--m-control--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5414
+ --pf-v6-c-button--m-control--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5415
+ --pf-v6-c-button--m-control--Color: var(--pf-t--global--text--color--regular);
5416
+ --pf-v6-c-button--m-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
5417
+ --pf-v6-c-button--m-control--BorderColor: var(--pf-t--global--border--color--default);
5418
+ --pf-v6-c-button--m-control--BorderWidth: var(--pf-t--global--border--width--control--default);
5419
+ --pf-v6-c-button--m-control__icon--Color: var(--pf-t--global--icon--color--regular);
5420
+ --pf-v6-c-button--m-control--hover--Color: var(--pf-t--global--text--color--regular);
5421
+ --pf-v6-c-button--m-control--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5422
+ --pf-v6-c-button--m-control--hover--BorderColor: var(--pf-t--global--border--color--hover);
5423
+ --pf-v6-c-button--m-control--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
5424
+ --pf-v6-c-button--m-control--hover__icon--Color: var(--pf-t--global--icon--color--regular);
5425
+ --pf-v6-c-button--m-control--m-clicked--Color: var(--pf-t--global--text--color--regular);
5426
+ --pf-v6-c-button--m-control--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
5427
+ --pf-v6-c-button--m-control--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
5428
+ --pf-v6-c-button--m-control--m-clicked--BorderWidth: var(--pf-t--global--border--width--control--clicked);
5429
+ --pf-v6-c-button--m-control--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
5430
+ --pf-v6-c-button--m-control--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5431
+ --pf-v6-c-button--m-control--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5432
+ --pf-v6-c-button--m-stateful--BorderRadius: var(--pf-t--global--border--radius--small);
5433
+ --pf-v6-c-button--m-stateful--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5434
+ --pf-v6-c-button--m-stateful--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5435
+ --pf-v6-c-button--m-stateful--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5436
+ --pf-v6-c-button--m-stateful--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5437
+ --pf-v6-c-button--m-read--BackgroundColor: var(--pf-t--global--background--color--control--default);
5438
+ --pf-v6-c-button--m-read--BorderColor: var(--pf-t--global--border--color--default);
5439
+ --pf-v6-c-button--m-read--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5440
+ --pf-v6-c-button--m-read--hover--BorderColor: var(--pf-t--global--border--color--hover);
5441
+ --pf-v6-c-button--m-read--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
5442
+ --pf-v6-c-button--m-read--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
5443
+ --pf-v6-c-button--m-unread--Color: var(--pf-t--global--text--color--status--unread--on-default--default);
5444
+ --pf-v6-c-button--m-unread--BackgroundColor: var(--pf-t--global--color--status--unread--default);
5445
+ --pf-v6-c-button--m-unread__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--default);
5446
+ --pf-v6-c-button--m-unread--hover--Color: var(--pf-t--global--text--color--status--unread--on-default--hover);
5447
+ --pf-v6-c-button--m-unread--hover--BackgroundColor: var(--pf-t--global--color--status--unread--hover);
5448
+ --pf-v6-c-button--m-unread--hover__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--hover);
5449
+ --pf-v6-c-button--m-unread--m-clicked--Color: var(--pf-t--global--text--color--status--unread--on-default--clicked);
5450
+ --pf-v6-c-button--m-unread--m-clicked--BackgroundColor: var(--pf-t--global--color--status--unread--clicked);
5451
+ --pf-v6-c-button--m-unread--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--clicked);
5452
+ --pf-v6-c-button--m-attention--Color: var(--pf-t--global--text--color--status--unread--on-attention--default);
5453
+ --pf-v6-c-button--m-attention--BackgroundColor: var(--pf-t--global--color--status--unread--attention--default);
5454
+ --pf-v6-c-button--m-attention__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--default);
5455
+ --pf-v6-c-button--m-attention--hover--Color: var(--pf-t--global--text--color--status--unread--on-attention--hover);
5456
+ --pf-v6-c-button--m-attention--hover--BackgroundColor: var(--pf-t--global--color--status--unread--attention--hover);
5457
+ --pf-v6-c-button--m-attention--hover__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--hover);
5458
+ --pf-v6-c-button--m-attention--m-clicked--Color: var(--pf-t--global--text--color--status--unread--on-attention--clicked);
5459
+ --pf-v6-c-button--m-attention--m-clicked--BackgroundColor: var(--pf-t--global--color--status--unread--attention--clicked);
5460
+ --pf-v6-c-button--m-attention--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--clicked);
5461
+ --pf-v6-c-button--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
5462
+ --pf-v6-c-button--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
5463
+ --pf-v6-c-button--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
5244
5464
  --pf-v6-c-button--m-warning--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
5245
5465
  --pf-v6-c-button--m-warning--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
5246
5466
  --pf-v6-c-button--m-warning--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
@@ -5753,6 +5973,38 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
5753
5973
  transform: scale(1.5);
5754
5974
  }
5755
5975
  }
5976
+ .pf-v6-c-action-list {
5977
+ --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
5978
+ --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default);
5979
+ --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
5980
+ --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
5981
+ }
5982
+
5983
+ .pf-v6-c-action-list,
5984
+ .pf-v6-c-action-list__group {
5985
+ display: flex;
5986
+ align-items: start;
5987
+ }
5988
+
5989
+ .pf-v6-c-action-list {
5990
+ row-gap: var(--pf-v6-c-action-list--RowGap);
5991
+ column-gap: var(--pf-v6-c-action-list--ColumnGap);
5992
+ }
5993
+
5994
+ .pf-v6-c-action-list.pf-m-icons {
5995
+ --pf-v6-c-action-list__group--ColumnGap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
5996
+ column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
5997
+ }
5998
+
5999
+ .pf-v6-c-action-list__group {
6000
+ row-gap: var(--pf-v6-c-action-list__group--RowGap, var(--pf-v6-c-action-list--RowGap));
6001
+ column-gap: var(--pf-v6-c-action-list__group--ColumnGap);
6002
+ }
6003
+
6004
+ .pf-v6-c-action-list__group.pf-m-icons {
6005
+ column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6006
+ }
6007
+
5756
6008
  .pf-v6-c-divider {
5757
6009
  --pf-v6-c-divider--Display: flex;
5758
6010
  --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
@@ -6069,38 +6321,6 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
6069
6321
  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6070
6322
  }
6071
6323
  }
6072
- .pf-v6-c-action-list {
6073
- --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
6074
- --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default);
6075
- --pf-v6-c-action-list__group--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--default);
6076
- --pf-v6-c-action-list--m-icons--ColumnGap: var(--pf-t--global--spacer--gap--action-to-action--plain);
6077
- }
6078
-
6079
- .pf-v6-c-action-list,
6080
- .pf-v6-c-action-list__group {
6081
- display: flex;
6082
- align-items: start;
6083
- }
6084
-
6085
- .pf-v6-c-action-list {
6086
- row-gap: var(--pf-v6-c-action-list--RowGap);
6087
- column-gap: var(--pf-v6-c-action-list--ColumnGap);
6088
- }
6089
-
6090
- .pf-v6-c-action-list.pf-m-icons {
6091
- --pf-v6-c-action-list__group--ColumnGap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6092
- column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6093
- }
6094
-
6095
- .pf-v6-c-action-list__group {
6096
- row-gap: var(--pf-v6-c-action-list__group--RowGap, var(--pf-v6-c-action-list--RowGap));
6097
- column-gap: var(--pf-v6-c-action-list__group--ColumnGap);
6098
- }
6099
-
6100
- .pf-v6-c-action-list__group.pf-m-icons {
6101
- column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
6102
- }
6103
-
6104
6324
  .pf-v6-c-form-control {
6105
6325
  --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
6106
6326
  --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
@@ -6253,12 +6473,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
6253
6473
  padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
6254
6474
  padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
6255
6475
  color: var(--pf-v6-c-form-control--Color);
6476
+ appearance: none;
6256
6477
  background-color: transparent;
6257
6478
  border: none;
6258
6479
  border-radius: var(--pf-v6-c-form-control--BorderRadius);
6259
6480
  outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
6260
- -moz-appearance: none;
6261
- -webkit-appearance: none;
6262
6481
  }
6263
6482
 
6264
6483
  .pf-v6-c-form-control > ::placeholder {
@@ -6417,310 +6636,90 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
6417
6636
  }
6418
6637
 
6419
6638
  .pf-v6-c-form-control.pf-m-icon {
6420
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
6421
- }
6422
-
6423
- .pf-v6-c-form-control:has(select) {
6424
- --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__select--PaddingBlockStart);
6425
- --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__select--PaddingBlockEnd);
6426
- --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
6427
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) + var(--pf-v6-c-form-control__icon--FontSize));
6428
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
6429
- background-color: var(--pf-v6-c-form-control--BackgroundColor);
6430
- }
6431
-
6432
- .pf-v6-c-form-control:has(select) .pf-v6-c-form-control__utilities {
6433
- padding-inline-end: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
6434
- }
6435
-
6436
- @-moz-document url-prefix() {
6437
- .pf-v6-c-form-control:has(select) {
6438
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
6439
- --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
6440
- }
6441
- }
6442
- .pf-v6-c-form-control.pf-m-placeholder > select {
6443
- --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
6444
- }
6445
-
6446
- .pf-v6-c-form-control.pf-m-placeholder > select * {
6447
- color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
6448
- }
6449
-
6450
- .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
6451
- color: revert;
6452
- }
6453
-
6454
- .pf-v6-c-form-control > textarea {
6455
- width: 100%;
6456
- height: 100%;
6457
- vertical-align: bottom;
6458
- resize: none;
6459
- }
6460
-
6461
- .pf-v6-c-form-control.pf-m-resize-vertical {
6462
- --pf-v6-c-form-control--Resize: vertical;
6463
- overflow: auto;
6464
- }
6465
-
6466
- .pf-v6-c-form-control.pf-m-resize-horizontal {
6467
- --pf-v6-c-form-control--Resize: horizontal;
6468
- overflow: auto;
6469
- }
6470
-
6471
- .pf-v6-c-form-control.pf-m-resize-both {
6472
- --pf-v6-c-form-control--Resize: both;
6473
- overflow: auto;
6474
- }
6475
-
6476
- .pf-v6-c-form-control__icon {
6477
- font-size: var(--pf-v6-c-form-control__icon--FontSize);
6478
- color: var(--pf-v6-c-form-control__icon--Color);
6479
- }
6480
-
6481
- .pf-v6-c-form-control__icon.pf-m-status {
6482
- --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
6483
- }
6484
-
6485
- .pf-v6-c-form-control__toggle-icon {
6486
- grid-row: 1/2;
6487
- grid-column: 3;
6488
- padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
6489
- padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
6490
- font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
6491
- color: var(--pf-v6-c-form-control__toggle-icon--Color);
6492
- pointer-events: none;
6493
- }
6494
-
6495
- .pf-v6-c-form-control__utilities {
6496
- display: flex;
6497
- flex-wrap: nowrap;
6498
- grid-row: 1/2;
6499
- grid-column: 2;
6500
- gap: var(--pf-v6-c-form-control__utilities--Gap);
6501
- padding-block-start: var(--pf-v6-c-form-control__utilities--PaddingBlockStart);
6502
- padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
6503
- pointer-events: none;
6504
- }
6505
-
6506
- .pf-v6-c-popover {
6507
- --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
6508
- --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
6509
- --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
6510
- --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
6511
- --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
6512
- --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
6513
- --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
6514
- --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
6515
- --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
6516
- --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
6517
- --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
6518
- --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
6519
- --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
6520
- --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
6521
- --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
6522
- --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
6523
- --pf-v6-c-popover__arrow--Width: 0.9375rem;
6524
- --pf-v6-c-popover__arrow--Height: 0.9375rem;
6525
- --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
6526
- --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
6527
- --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
6528
- --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
6529
- --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
6530
- --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
6531
- --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
6532
- --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
6533
- --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
6534
- --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
6535
- --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
6536
- --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
6537
- --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
6538
- --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
6539
- --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
6540
- --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
6541
- --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
6542
- --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
6543
- --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
6544
- --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6545
- --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
6546
- --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
6547
- --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
6548
- --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
6549
- --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
6550
- --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
6551
- --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
6552
- --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
6553
- --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
6554
- }
6555
-
6556
- .pf-v6-c-popover {
6557
- position: relative;
6558
- min-width: var(--pf-v6-c-popover--MinWidth);
6559
- max-width: var(--pf-v6-c-popover--MaxWidth);
6560
- font-size: var(--pf-v6-c-popover--FontSize);
6561
- border-radius: var(--pf-v6-c-popover--BorderRadius);
6562
- box-shadow: var(--pf-v6-c-popover--BoxShadow);
6563
- }
6564
-
6565
- .pf-v6-c-popover.pf-m-no-padding {
6566
- --pf-v6-c-popover__content--PaddingBlockStart: 0px;
6567
- --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
6568
- --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
6569
- --pf-v6-c-popover__content--PaddingInlineStart: 0px;
6570
- }
6571
-
6572
- .pf-v6-c-popover.pf-m-width-auto {
6573
- --pf-v6-c-popover--MinWidth: auto;
6574
- --pf-v6-c-popover--MaxWidth: none;
6575
- }
6576
-
6577
- .pf-v6-c-popover:is(.pf-m-top,
6578
- .pf-m-top-left,
6579
- .pf-m-top-right) {
6580
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
6581
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
6582
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
6583
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6584
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
6585
- }
6586
-
6587
- .pf-v6-c-popover:is(.pf-m-bottom,
6588
- .pf-m-bottom-left,
6589
- .pf-m-bottom-right) {
6590
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
6591
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
6592
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
6593
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
6594
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
6595
- }
6596
-
6597
- .pf-v6-c-popover:is(.pf-m-left,
6598
- .pf-m-left-top,
6599
- .pf-m-left-bottom) {
6600
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
6601
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
6602
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6603
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
6604
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
6605
- }
6606
-
6607
- .pf-v6-c-popover:is(.pf-m-right,
6608
- .pf-m-right-top,
6609
- .pf-m-right-bottom) {
6610
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
6611
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
6612
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
6613
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
6614
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
6615
- }
6616
-
6617
- .pf-v6-c-popover:is(.pf-m-left-top,
6618
- .pf-m-right-top) {
6619
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
6620
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6621
- }
6622
-
6623
- .pf-v6-c-popover:is(.pf-m-left-bottom,
6624
- .pf-m-right-bottom) {
6625
- --pf-v6-c-popover__arrow--InsetBlockStart: auto;
6626
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
6627
- }
6628
-
6629
- .pf-v6-c-popover:is(.pf-m-top-left,
6630
- .pf-m-bottom-left) {
6631
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
6632
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6633
- }
6634
-
6635
- .pf-v6-c-popover:is(.pf-m-top-right,
6636
- .pf-m-bottom-right) {
6637
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
6638
- --pf-v6-c-popover__arrow--InsetInlineStart: auto;
6639
- }
6640
-
6641
- .pf-v6-c-popover.pf-m-danger {
6642
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
6639
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
6643
6640
  }
6644
6641
 
6645
- .pf-v6-c-popover.pf-m-warning {
6646
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
6642
+ .pf-v6-c-form-control:has(select) {
6643
+ --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__select--PaddingBlockStart);
6644
+ --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__select--PaddingBlockEnd);
6645
+ --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
6646
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) + var(--pf-v6-c-form-control__icon--FontSize));
6647
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
6648
+ background-color: var(--pf-v6-c-form-control--BackgroundColor);
6647
6649
  }
6648
6650
 
6649
- .pf-v6-c-popover.pf-m-success {
6650
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
6651
+ .pf-v6-c-form-control:has(select) .pf-v6-c-form-control__utilities {
6652
+ padding-inline-end: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
6651
6653
  }
6652
6654
 
6653
- .pf-v6-c-popover.pf-m-custom {
6654
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
6655
+ @-moz-document url-prefix() {
6656
+ .pf-v6-c-form-control:has(select) {
6657
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
6658
+ --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
6659
+ }
6655
6660
  }
6656
-
6657
- .pf-v6-c-popover.pf-m-info {
6658
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
6661
+ .pf-v6-c-form-control.pf-m-placeholder > select {
6662
+ --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
6659
6663
  }
6660
6664
 
6661
- .pf-v6-c-popover__content {
6662
- position: relative;
6663
- padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
6664
- padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
6665
- padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
6666
- padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6667
- background-color: var(--pf-v6-c-popover__content--BackgroundColor);
6668
- border-radius: var(--pf-v6-c-popover__content--BorderRadius);
6665
+ .pf-v6-c-form-control.pf-m-placeholder > select * {
6666
+ color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
6669
6667
  }
6670
6668
 
6671
- .pf-v6-c-popover__close {
6672
- position: absolute;
6673
- inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
6674
- inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
6669
+ .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
6670
+ color: revert;
6675
6671
  }
6676
6672
 
6677
- .pf-v6-c-popover__close + * {
6678
- padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
6673
+ .pf-v6-c-form-control > textarea {
6674
+ width: 100%;
6675
+ height: 100%;
6676
+ vertical-align: bottom;
6677
+ resize: none;
6679
6678
  }
6680
6679
 
6681
- .pf-v6-c-popover__arrow {
6682
- position: absolute;
6683
- top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
6684
- right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
6685
- bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
6686
- left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
6687
- width: var(--pf-v6-c-popover__arrow--Width);
6688
- height: var(--pf-v6-c-popover__arrow--Height);
6689
- pointer-events: none;
6690
- background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
6691
- box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
6692
- 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));
6680
+ .pf-v6-c-form-control.pf-m-resize-vertical {
6681
+ --pf-v6-c-form-control--Resize: vertical;
6682
+ overflow: auto;
6693
6683
  }
6694
6684
 
6695
- .pf-v6-c-popover__header {
6696
- margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
6685
+ .pf-v6-c-form-control.pf-m-resize-horizontal {
6686
+ --pf-v6-c-form-control--Resize: horizontal;
6687
+ overflow: auto;
6697
6688
  }
6698
6689
 
6699
- .pf-v6-c-popover__title {
6700
- display: flex;
6701
- flex: 0 0 auto;
6690
+ .pf-v6-c-form-control.pf-m-resize-both {
6691
+ --pf-v6-c-form-control--Resize: both;
6692
+ overflow: auto;
6702
6693
  }
6703
6694
 
6704
- .pf-v6-c-popover__title-icon {
6705
- margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
6706
- font-size: var(--pf-v6-c-popover__title-icon--FontSize);
6707
- color: var(--pf-v6-c-popover__title-icon--Color);
6695
+ .pf-v6-c-form-control__icon {
6696
+ font-size: var(--pf-v6-c-form-control__icon--FontSize);
6697
+ color: var(--pf-v6-c-form-control__icon--Color);
6708
6698
  }
6709
6699
 
6710
- .pf-v6-c-popover__title-text {
6711
- min-width: 0;
6712
- font-size: var(--pf-v6-c-popover__title-text--FontSize);
6713
- font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
6714
- color: var(--pf-v6-c-popover__title-text--Color);
6715
- overflow-wrap: break-word;
6700
+ .pf-v6-c-form-control__icon.pf-m-status {
6701
+ --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
6716
6702
  }
6717
6703
 
6718
- .pf-v6-c-popover__body {
6719
- word-wrap: break-word;
6704
+ .pf-v6-c-form-control__toggle-icon {
6705
+ grid-row: 1/2;
6706
+ grid-column: 3;
6707
+ padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
6708
+ padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
6709
+ font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
6710
+ color: var(--pf-v6-c-form-control__toggle-icon--Color);
6711
+ pointer-events: none;
6720
6712
  }
6721
6713
 
6722
- .pf-v6-c-popover__footer {
6723
- margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
6714
+ .pf-v6-c-form-control__utilities {
6715
+ display: flex;
6716
+ flex-wrap: nowrap;
6717
+ grid-row: 1/2;
6718
+ grid-column: 2;
6719
+ gap: var(--pf-v6-c-form-control__utilities--Gap);
6720
+ padding-block-start: var(--pf-v6-c-form-control__utilities--PaddingBlockStart);
6721
+ padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
6722
+ pointer-events: none;
6724
6723
  }
6725
6724
 
6726
6725
  .pf-v6-c-menu {
@@ -7485,79 +7484,6 @@ button.pf-v6-c-breadcrumb__link {
7485
7484
  display: none;
7486
7485
  }
7487
7486
 
7488
- .pf-v6-c-badge {
7489
- --pf-v6-c-badge--BorderColor: transparent;
7490
- --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
7491
- --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
7492
- --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
7493
- --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
7494
- --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7495
- --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7496
- --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7497
- --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
7498
- --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
7499
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7500
- --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
7501
- --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7502
- --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7503
- --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
7504
- --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
7505
- --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
7506
- --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
7507
- --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
7508
- --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7509
- }
7510
-
7511
- .pf-v6-c-badge {
7512
- position: relative;
7513
- display: inline-block;
7514
- min-width: var(--pf-v6-c-badge--MinWidth);
7515
- padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
7516
- padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
7517
- font-size: var(--pf-v6-c-badge--FontSize);
7518
- font-weight: var(--pf-v6-c-badge--FontWeight);
7519
- color: var(--pf-v6-c-badge--Color);
7520
- text-align: center;
7521
- white-space: nowrap;
7522
- background-color: var(--pf-v6-c-badge--BackgroundColor);
7523
- border-radius: var(--pf-v6-c-badge--BorderRadius);
7524
- }
7525
-
7526
- .pf-v6-c-badge::after {
7527
- position: absolute;
7528
- inset: 0;
7529
- pointer-events: none;
7530
- content: "";
7531
- border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
7532
- border-radius: inherit;
7533
- }
7534
-
7535
- .pf-v6-c-badge.pf-m-read {
7536
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
7537
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
7538
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
7539
- }
7540
-
7541
- .pf-v6-c-badge.pf-m-unread {
7542
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
7543
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
7544
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
7545
- }
7546
-
7547
- .pf-v6-c-badge.pf-m-disabled {
7548
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
7549
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
7550
- }
7551
-
7552
- .pf-v6-c-badge.pf-m-disabled::after {
7553
- border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
7554
- }
7555
-
7556
- .pf-v6-c-badge__toggle-icon {
7557
- margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
7558
- color: var(--pf-v6-c-badge__toggle-icon--Color);
7559
- }
7560
-
7561
7487
  .pf-v6-c-spinner {
7562
7488
  --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
7563
7489
  --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
@@ -7638,4 +7564,76 @@ button.pf-v6-c-breadcrumb__link {
7638
7564
  stroke-dashoffset: 280;
7639
7565
  transform: rotate(720deg);
7640
7566
  }
7567
+ }
7568
+ .pf-v6-c-badge {
7569
+ --pf-v6-c-badge--BorderColor: transparent;
7570
+ --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
7571
+ --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
7572
+ --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
7573
+ --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
7574
+ --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7575
+ --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7576
+ --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7577
+ --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
7578
+ --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
7579
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7580
+ --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
7581
+ --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7582
+ --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7583
+ --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
7584
+ --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
7585
+ --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
7586
+ --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
7587
+ --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
7588
+ --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7589
+ }
7590
+
7591
+ .pf-v6-c-badge {
7592
+ position: relative;
7593
+ display: inline-block;
7594
+ min-width: var(--pf-v6-c-badge--MinWidth);
7595
+ padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
7596
+ padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
7597
+ font-size: var(--pf-v6-c-badge--FontSize);
7598
+ font-weight: var(--pf-v6-c-badge--FontWeight);
7599
+ color: var(--pf-v6-c-badge--Color);
7600
+ text-align: center;
7601
+ white-space: nowrap;
7602
+ background-color: var(--pf-v6-c-badge--BackgroundColor);
7603
+ border-radius: var(--pf-v6-c-badge--BorderRadius);
7604
+ }
7605
+
7606
+ .pf-v6-c-badge::after {
7607
+ position: absolute;
7608
+ inset: 0;
7609
+ pointer-events: none;
7610
+ content: "";
7611
+ border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
7612
+ border-radius: inherit;
7613
+ }
7614
+
7615
+ .pf-v6-c-badge.pf-m-read {
7616
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
7617
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
7618
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
7619
+ }
7620
+
7621
+ .pf-v6-c-badge.pf-m-unread {
7622
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
7623
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
7624
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
7625
+ }
7626
+
7627
+ .pf-v6-c-badge.pf-m-disabled {
7628
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
7629
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
7630
+ }
7631
+
7632
+ .pf-v6-c-badge.pf-m-disabled::after {
7633
+ border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
7634
+ }
7635
+
7636
+ .pf-v6-c-badge__toggle-icon {
7637
+ margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
7638
+ color: var(--pf-v6-c-badge__toggle-icon--Color);
7641
7639
  }