@patternfly/react-table 6.3.0-prerelease.12 → 6.3.0-prerelease.13

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 +4 -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-D-Qg0nuA.css → output-CYdev_yX.css} +2095 -2096
  11. package/package.json +3 -3
package/dist/umd/assets/{output-D-Qg0nuA.css → output-CYdev_yX.css} RENAMED
@@ -1004,74 +1004,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
1004
1004
  --pf-v6-c-table--cell--Width: 100%;
1005
1005
  }
1006
1006
 
1007
- .pf-v6-c-table {
1008
- --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
1009
- --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
1010
- --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
1011
- --pf-v6-c-table__sticky-cell--InsetInlineEnd: auto;
1012
- --pf-v6-c-table__sticky-cell--InsetInlineStart: auto;
1013
- --pf-v6-c-table__sticky-cell--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1014
- --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
1015
- --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
1016
- --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
1017
- --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
1018
- --pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd: 0;
1019
- --pf-v6-c-table__sticky-cell--m-left--InsetInlineStart: 0;
1020
- --pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex: calc(var(--pf-v6-c-table__sticky-cell--ZIndex) + 1);
1021
- }
1022
-
1023
- .pf-v6-c-table .pf-v6-c-table__sticky-cell {
1024
- position: sticky;
1025
- inset-inline-start: var(--pf-v6-c-table__sticky-cell--InsetInlineStart);
1026
- inset-inline-end: var(--pf-v6-c-table__sticky-cell--InsetInlineEnd);
1027
- z-index: var(--pf-v6-c-table__sticky-cell--ZIndex);
1028
- min-width: var(--pf-v6-c-table__sticky-cell--MinWidth);
1029
- }
1030
-
1031
- .pf-v6-c-table__sticky-cell {
1032
- --pf-v6-c-table--cell--Overflow: visible;
1033
- --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex);
1034
- background-color: var(--pf-v6-c-table__sticky-cell--BackgroundColor);
1035
- background-clip: padding-box;
1036
- }
1037
-
1038
- .pf-v6-c-table__sticky-cell.pf-m-border-right::before {
1039
- --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth);
1040
- --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor);
1041
- }
1042
-
1043
- .pf-v6-c-table__sticky-cell.pf-m-border-left::before {
1044
- --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth);
1045
- --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor);
1046
- }
1047
-
1048
- .pf-v6-c-table__sticky-cell.pf-m-right, .pf-v6-c-table__sticky-cell.pf-m-inline-end {
1049
- --pf-v6-c-table__sticky-cell--InsetInlineEnd: var(--pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd);
1050
- }
1051
-
1052
- .pf-v6-c-table__sticky-cell.pf-m-left, .pf-v6-c-table__sticky-cell.pf-m-inline-start {
1053
- --pf-v6-c-table__sticky-cell--InsetInlineStart: var(--pf-v6-c-table__sticky-cell--m-left--InsetInlineStart);
1054
- }
1055
-
1056
- .pf-v6-c-scroll-outer-wrapper {
1057
- --pf-v6-c-scroll-outer-wrapper--MinHeight: 25rem;
1058
- --pf-v6-c-scroll-outer-wrapper--MaxHeight: 100%;
1059
- display: flex;
1060
- flex-direction: column;
1061
- max-width: 100%;
1062
- min-height: var(--pf-v6-c-scroll-outer-wrapper--MinHeight);
1063
- max-height: var(--pf-v6-c-scroll-outer-wrapper--MaxHeight);
1064
- overflow: hidden;
1065
- }
1066
-
1067
- .pf-v6-c-scroll-inner-wrapper {
1068
- display: flex;
1069
- flex-direction: column;
1070
- max-width: 100%;
1071
- max-height: 100%;
1072
- overflow: auto;
1073
- }
1074
-
1075
1007
  .pf-v6-c-table {
1076
1008
  --pf-v6-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
1077
1009
  --pf-v6-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
@@ -2699,6 +2631,74 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
2699
2631
  --pf-v6-c-table--cell--Width: auto;
2700
2632
  }
2701
2633
  }
2634
+ .pf-v6-c-table {
2635
+ --pf-v6-c-table__sticky-cell--MinWidth--base: 8.75rem;
2636
+ --pf-v6-c-table__sticky-cell--MinWidth: var(--pf-v6-c-table__sticky-cell--MinWidth--base);
2637
+ --pf-v6-c-table__sticky-cell--ZIndex: var(--pf-t--global--z-index--xs);
2638
+ --pf-v6-c-table__sticky-cell--InsetInlineEnd: auto;
2639
+ --pf-v6-c-table__sticky-cell--InsetInlineStart: auto;
2640
+ --pf-v6-c-table__sticky-cell--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2641
+ --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth: var(--pf-t--global--border--width--divider--default);
2642
+ --pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor: var(--pf-t--global--border--color--default);
2643
+ --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth: var(--pf-t--global--border--width--divider--default);
2644
+ --pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor: var(--pf-t--global--border--color--default);
2645
+ --pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd: 0;
2646
+ --pf-v6-c-table__sticky-cell--m-left--InsetInlineStart: 0;
2647
+ --pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex: calc(var(--pf-v6-c-table__sticky-cell--ZIndex) + 1);
2648
+ }
2649
+
2650
+ .pf-v6-c-table .pf-v6-c-table__sticky-cell {
2651
+ position: sticky;
2652
+ inset-inline-start: var(--pf-v6-c-table__sticky-cell--InsetInlineStart);
2653
+ inset-inline-end: var(--pf-v6-c-table__sticky-cell--InsetInlineEnd);
2654
+ z-index: var(--pf-v6-c-table__sticky-cell--ZIndex);
2655
+ min-width: var(--pf-v6-c-table__sticky-cell--MinWidth);
2656
+ }
2657
+
2658
+ .pf-v6-c-table__sticky-cell {
2659
+ --pf-v6-c-table--cell--Overflow: visible;
2660
+ --pf-v6-c-table--m-sticky-header--cell--ZIndex: var(--pf-v6-c-table--m-sticky-header__sticky-cell--ZIndex);
2661
+ background-color: var(--pf-v6-c-table__sticky-cell--BackgroundColor);
2662
+ background-clip: padding-box;
2663
+ }
2664
+
2665
+ .pf-v6-c-table__sticky-cell.pf-m-border-right::before {
2666
+ --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndWidth: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndWidth);
2667
+ --pf-v6-c-table--cell--m-border-right--before--BorderInlineEndColor: var(--pf-v6-c-table__sticky-cell--m-border-right--before--BorderInlineEndColor);
2668
+ }
2669
+
2670
+ .pf-v6-c-table__sticky-cell.pf-m-border-left::before {
2671
+ --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartWidth: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartWidth);
2672
+ --pf-v6-c-table--cell--m-border-left--before--BorderInlineStartColor: var(--pf-v6-c-table__sticky-cell--m-border-left--before--BorderInlineStartColor);
2673
+ }
2674
+
2675
+ .pf-v6-c-table__sticky-cell.pf-m-right, .pf-v6-c-table__sticky-cell.pf-m-inline-end {
2676
+ --pf-v6-c-table__sticky-cell--InsetInlineEnd: var(--pf-v6-c-table__sticky-cell--m-right--InsetInlineEnd);
2677
+ }
2678
+
2679
+ .pf-v6-c-table__sticky-cell.pf-m-left, .pf-v6-c-table__sticky-cell.pf-m-inline-start {
2680
+ --pf-v6-c-table__sticky-cell--InsetInlineStart: var(--pf-v6-c-table__sticky-cell--m-left--InsetInlineStart);
2681
+ }
2682
+
2683
+ .pf-v6-c-scroll-outer-wrapper {
2684
+ --pf-v6-c-scroll-outer-wrapper--MinHeight: 25rem;
2685
+ --pf-v6-c-scroll-outer-wrapper--MaxHeight: 100%;
2686
+ display: flex;
2687
+ flex-direction: column;
2688
+ max-width: 100%;
2689
+ min-height: var(--pf-v6-c-scroll-outer-wrapper--MinHeight);
2690
+ max-height: var(--pf-v6-c-scroll-outer-wrapper--MaxHeight);
2691
+ overflow: hidden;
2692
+ }
2693
+
2694
+ .pf-v6-c-scroll-inner-wrapper {
2695
+ display: flex;
2696
+ flex-direction: column;
2697
+ max-width: 100%;
2698
+ max-height: 100%;
2699
+ overflow: auto;
2700
+ }
2701
+
2702
2702
  .pf-v6-c-form {
2703
2703
  --pf-v6-c-form--GridGap: var(--pf-t--global--spacer--gap--group-to-group--vertical--default);
2704
2704
  --pf-v6-c-form__group--Gap: var(--pf-t--global--spacer--gap--group--vertical);
@@ -3236,98 +3236,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
3236
3236
  margin-block-end: var(--pf-v6-c-form__field-group-body__field-group--last-child--MarginBlockEnd);
3237
3237
  }
3238
3238
 
3239
- .pf-v6-c-inline-edit {
3240
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
3241
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
3242
- --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
3243
- --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
3244
- --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
3245
- --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
3246
- }
3247
-
3248
- .pf-v6-c-inline-edit__group {
3249
- display: flex;
3250
- align-items: baseline;
3251
- }
3252
-
3253
- .pf-v6-c-inline-edit__group > * {
3254
- margin-inline-end: var(--pf-v6-c-inline-edit__group--item--MarginInlineEnd);
3255
- }
3256
-
3257
- .pf-v6-c-inline-edit__group.pf-m-icon-group {
3258
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd);
3259
- }
3260
-
3261
- .pf-v6-c-inline-edit__group.pf-m-footer {
3262
- margin-block-start: var(--pf-v6-c-inline-edit__group--m-footer--MarginBlockStart);
3263
- }
3264
-
3265
- .pf-v6-c-inline-edit__group.pf-m-column {
3266
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
3267
- flex-direction: column;
3268
- }
3269
-
3270
- .pf-v6-c-inline-edit__group > :last-child {
3271
- --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
3272
- }
3273
-
3274
- .pf-v6-c-inline-edit__input {
3275
- flex: 1;
3276
- }
3277
-
3278
- .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain {
3279
- --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color);
3280
- }
3281
-
3282
- .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain:hover {
3283
- --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color);
3284
- }
3285
-
3286
- .pf-v6-c-inline-edit__input,
3287
- .pf-v6-c-inline-edit__action,
3288
- .pf-v6-c-inline-edit__group.pf-m-action-group {
3289
- display: none;
3290
- }
3291
-
3292
- .pf-v6-c-inline-edit__action.pf-m-enable-editable {
3293
- display: inline-block;
3294
- }
3295
-
3296
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__input,
3297
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__input {
3298
- display: block;
3299
- }
3300
-
3301
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action,
3302
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action {
3303
- display: inline-block;
3304
- }
3305
-
3306
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group,
3307
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group {
3308
- display: inline-flex;
3309
- }
3310
-
3311
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__value,
3312
- .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable,
3313
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__value,
3314
- .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable {
3315
- display: none;
3316
- }
3317
-
3318
- .pf-v6-c-inline-edit__label + .pf-v6-c-inline-edit__action.pf-m-enable > .pf-v6-c-button {
3319
- margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
3320
- margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
3321
- }
3322
-
3323
- .pf-v6-c-inline-edit__label.pf-m-bold {
3324
- font-weight: var(--pf-v6-c-inline-edit__label--m-bold--FontWeight);
3325
- }
3326
-
3327
- .pf-v6-c-inline-edit__editable-text br {
3328
- display: none;
3329
- }
3330
-
3331
3239
  .pf-v6-c-table {
3332
3240
  --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));
3333
3241
  --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));
@@ -4189,26 +4097,118 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4189
4097
  --pf-v6-c-table--m-tree-view-grid__tbody--cell--PaddingInlineStart: calc(var(--pf-v6-c-table__tree-view-main--nested-indent--base) * 9 + var(--pf-v6-c-table__tree-view-main--indent--base));
4190
4098
  }
4191
4099
  }
4192
- .pf-v6-u-screen-reader {
4193
- position: fixed;
4194
- inset-block-start: 0;
4195
- inset-inline-start: 0;
4196
- overflow: hidden;
4197
- clip: rect(0, 0, 0, 0);
4198
- white-space: nowrap;
4199
- border: 0;
4100
+ .pf-v6-c-inline-edit {
4101
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--default);
4102
+ --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4103
+ --pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color: var(--pf-t--global--icon--color--brand--hover);
4104
+ --pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd: var(--pf-t--global--spacer--gap--action-to-action--plain);
4105
+ --pf-v6-c-inline-edit__group--m-footer--MarginBlockStart: var(--pf-t--global--spacer--xl);
4106
+ --pf-v6-c-inline-edit__label--m-bold--FontWeight: var(--pf-t--global--font--weight--body--bold);
4200
4107
  }
4201
4108
 
4202
- .pf-v6-u-visible {
4203
- position: static;
4204
- overflow: visible;
4205
- clip: auto;
4206
- white-space: normal;
4207
- border: inherit;
4109
+ .pf-v6-c-inline-edit__group {
4110
+ display: flex;
4111
+ align-items: baseline;
4208
4112
  }
4209
4113
 
4210
- .pf-v6-u-hidden {
4211
- display: none !important;
4114
+ .pf-v6-c-inline-edit__group > * {
4115
+ margin-inline-end: var(--pf-v6-c-inline-edit__group--item--MarginInlineEnd);
4116
+ }
4117
+
4118
+ .pf-v6-c-inline-edit__group.pf-m-icon-group {
4119
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: var(--pf-v6-c-inline-edit__action--m-icon-group--item--MarginInlineEnd);
4120
+ }
4121
+
4122
+ .pf-v6-c-inline-edit__group.pf-m-footer {
4123
+ margin-block-start: var(--pf-v6-c-inline-edit__group--m-footer--MarginBlockStart);
4124
+ }
4125
+
4126
+ .pf-v6-c-inline-edit__group.pf-m-column {
4127
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
4128
+ flex-direction: column;
4129
+ }
4130
+
4131
+ .pf-v6-c-inline-edit__group > :last-child {
4132
+ --pf-v6-c-inline-edit__group--item--MarginInlineEnd: 0;
4133
+ }
4134
+
4135
+ .pf-v6-c-inline-edit__input {
4136
+ flex: 1;
4137
+ }
4138
+
4139
+ .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain {
4140
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--Color);
4141
+ }
4142
+
4143
+ .pf-v6-c-inline-edit__action.pf-m-valid .pf-v6-c-button.pf-m-plain:hover {
4144
+ --pf-v6-c-button--m-plain--Color: var(--pf-v6-c-inline-edit__action--c-button--m-valid--m-plain--hover--Color);
4145
+ }
4146
+
4147
+ .pf-v6-c-inline-edit__input,
4148
+ .pf-v6-c-inline-edit__action,
4149
+ .pf-v6-c-inline-edit__group.pf-m-action-group {
4150
+ display: none;
4151
+ }
4152
+
4153
+ .pf-v6-c-inline-edit__action.pf-m-enable-editable {
4154
+ display: inline-block;
4155
+ }
4156
+
4157
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__input,
4158
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__input {
4159
+ display: block;
4160
+ }
4161
+
4162
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action,
4163
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action {
4164
+ display: inline-block;
4165
+ }
4166
+
4167
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group,
4168
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__group.pf-m-action-group {
4169
+ display: inline-flex;
4170
+ }
4171
+
4172
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__value,
4173
+ .pf-v6-c-inline-edit.pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable,
4174
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__value,
4175
+ .pf-v6-c-inline-edit .pf-m-inline-editable .pf-v6-c-inline-edit__action.pf-m-enable-editable {
4176
+ display: none;
4177
+ }
4178
+
4179
+ .pf-v6-c-inline-edit__label + .pf-v6-c-inline-edit__action.pf-m-enable > .pf-v6-c-button {
4180
+ margin-block-start: calc(var(--pf-v6-c-button--PaddingBlockStart) * -1);
4181
+ margin-block-end: calc(var(--pf-v6-c-button--PaddingBlockEnd) * -1);
4182
+ }
4183
+
4184
+ .pf-v6-c-inline-edit__label.pf-m-bold {
4185
+ font-weight: var(--pf-v6-c-inline-edit__label--m-bold--FontWeight);
4186
+ }
4187
+
4188
+ .pf-v6-c-inline-edit__editable-text br {
4189
+ display: none;
4190
+ }
4191
+
4192
+ .pf-v6-u-screen-reader {
4193
+ position: fixed;
4194
+ inset-block-start: 0;
4195
+ inset-inline-start: 0;
4196
+ overflow: hidden;
4197
+ clip: rect(0, 0, 0, 0);
4198
+ white-space: nowrap;
4199
+ border: 0;
4200
+ }
4201
+
4202
+ .pf-v6-u-visible {
4203
+ position: static;
4204
+ overflow: visible;
4205
+ clip: auto;
4206
+ white-space: normal;
4207
+ border: inherit;
4208
+ }
4209
+
4210
+ .pf-v6-u-hidden {
4211
+ display: none !important;
4212
4212
  }
4213
4213
 
4214
4214
  @media screen and (min-width: 36rem) {
@@ -4472,1351 +4472,928 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
4472
4472
  pointer-events: none;
4473
4473
  }
4474
4474
 
4475
- .pf-v6-c-button {
4476
- --pf-v6-c-button--Display: inline-flex;
4477
- --pf-v6-c-button--AlignItems: baseline;
4478
- --pf-v6-c-button--JustifyContent: center;
4479
- --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
4480
- --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));
4481
- --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
4482
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
4483
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
4484
- --pf-v6-c-button--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
4485
- --pf-v6-c-button--Color: var(--pf-t--global--text--color--regular);
4486
- --pf-v6-c-button--LineHeight: var(--pf-t--global--font--line-height--body);
4487
- --pf-v6-c-button--FontWeight: var(--pf-t--global--font--weight--body--default);
4488
- --pf-v6-c-button--FontSize: var(--pf-t--global--font--size--body--default);
4489
- --pf-v6-c-button--BackgroundColor: transparent;
4490
- --pf-v6-c-button--BorderColor: transparent;
4491
- --pf-v6-c-button--BorderWidth: var(--pf-t--global--border--width--action--default);
4492
- --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
4493
- --pf-v6-c-button--TextDecorationLine: none;
4494
- --pf-v6-c-button--TextDecorationStyle: none;
4495
- --pf-v6-c-button--TextDecorationColor: currentcolor;
4496
- --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
4497
- --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
4498
- --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
4499
- --pf-v6-c-button--hover--BackgroundColor: transparent;
4500
- --pf-v6-c-button--hover--BorderColor: transparent;
4501
- --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
4502
- --pf-v6-c-button--hover--TextDecorationLine: none;
4503
- --pf-v6-c-button--hover--TextDecorationStyle: none;
4504
- --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
4505
- --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
4506
- --pf-v6-c-button--m-clicked--BorderColor: transparent;
4507
- --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
4508
- --pf-v6-c-button--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
4509
- --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
4510
- --pf-v6-c-button--m-primary__icon--Color: var(--pf-t--global--icon--color--on-brand--default);
4511
- --pf-v6-c-button--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
4512
- --pf-v6-c-button--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
4513
- --pf-v6-c-button--m-primary--hover__icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
4514
- --pf-v6-c-button--m-primary--m-clicked--Color: var(--pf-t--global--text--color--on-brand--clicked);
4515
- --pf-v6-c-button--m-primary--m-clicked--BackgroundColor: var(--pf-t--global--color--brand--clicked);
4516
- --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
4517
- --pf-v6-c-button--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
4518
- --pf-v6-c-button--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
4519
- --pf-v6-c-button--m-secondary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
4520
- --pf-v6-c-button--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--default);
4521
- --pf-v6-c-button--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
4522
- --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
4523
- --pf-v6-c-button--m-secondary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
4524
- --pf-v6-c-button--m-secondary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
4525
- --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-t--global--border--color--brand--clicked);
4526
- --pf-v6-c-button--m-secondary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
4527
- --pf-v6-c-button--m-secondary--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
4528
- --pf-v6-c-button--m-secondary--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
4529
- --pf-v6-c-button--m-secondary--m-danger__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
4530
- --pf-v6-c-button--m-secondary--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
4531
- --pf-v6-c-button--m-secondary--m-danger--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
4532
- --pf-v6-c-button--m-secondary--m-danger--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
4533
- --pf-v6-c-button--m-secondary--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
4534
- --pf-v6-c-button--m-secondary--m-danger--m-clicked--BorderColor: var(--pf-t--global--border--color--status--danger--clicked);
4535
- --pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--danger--clicked);
4536
- --pf-v6-c-button--m-tertiary--Color: var(--pf-t--global--text--color--brand--default);
4537
- --pf-v6-c-button--m-tertiary--BorderColor: var(--pf-t--global--border--color--default);
4538
- --pf-v6-c-button--m-tertiary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
4539
- --pf-v6-c-button--m-tertiary__icon--Color: var(--pf-t--global--icon--color--brand--default);
4540
- --pf-v6-c-button--m-tertiary--hover--Color: var(--pf-t--global--text--color--brand--hover);
4541
- --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--hover);
4542
- --pf-v6-c-button--m-tertiary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
4543
- --pf-v6-c-button--m-tertiary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
4544
- --pf-v6-c-button--m-tertiary--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
4545
- --pf-v6-c-button--m-tertiary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
4546
- --pf-v6-c-button--m-link--BorderRadius: var(--pf-t--global--border--radius--small);
4547
- --pf-v6-c-button--m-link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
4548
- --pf-v6-c-button--m-link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
4549
- --pf-v6-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
4550
- --pf-v6-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
4551
- --pf-v6-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
4552
- --pf-v6-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
4553
- --pf-v6-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
4554
- --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-t--global--text--color--brand--hover);
4555
- --pf-v6-c-button--m-link--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
4556
- --pf-v6-c-button--m-link--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
4557
- --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-t--global--text--color--brand--clicked);
4558
- --pf-v6-c-button--m-link--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
4559
- --pf-v6-c-button--m-link--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
4560
- --pf-v6-c-button--m-link--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
4561
- --pf-v6-c-button--m-link--m-danger--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
4562
- --pf-v6-c-button--m-link--m-danger__icon--Color: var(--pf-t--global--text--color--status--danger--default);
4563
- --pf-v6-c-button--m-link--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
4564
- --pf-v6-c-button--m-link--m-danger--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
4565
- --pf-v6-c-button--m-link--m-danger--hover__icon--Color: var(--pf-t--global--text--color--status--danger--hover);
4566
- --pf-v6-c-button--m-link--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
4567
- --pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
4568
- --pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color: var(--pf-t--global--text--color--status--danger--clicked);
4569
- --pf-v6-c-button--m-link--m-inline--Display: inline-flex;
4570
- --pf-v6-c-button--m-link--m-inline--JustifyContent: flex-start;
4571
- --pf-v6-c-button--m-link--m-inline--FontSize: initial;
4572
- --pf-v6-c-button--m-link--m-inline--LineHeight: initial;
4573
- --pf-v6-c-button--m-link--m-inline--FontWeight: initial;
4574
- --pf-v6-c-button--m-link--m-inline--PaddingBlockStart: 0;
4575
- --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
4576
- --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
4577
- --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
4578
- --pf-v6-c-button--m-link--m-inline--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
4579
- --pf-v6-c-button--m-link--m-inline--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
4580
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
4581
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
4582
- --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
4583
- --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));
4584
- --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
4585
- --pf-v6-c-button--m-link--m-inline--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
4586
- --pf-v6-c-button--span--m-link--m-inline--Display: inline;
4587
- --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
4588
- --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
4589
- --pf-v6-c-button--m-link--m-inline--Color: var(--pf-t--global--text--color--brand--default);
4590
- --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
4591
- --pf-v6-c-button--m-link--m-inline--TextDecorationColor: currentcolor;
4592
- --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
4593
- --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
4594
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: currentcolor;
4595
- --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
4596
- --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
4597
- --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
4598
- --pf-v6-c-button--m-plain--Color: var(--pf-t--global--icon--color--regular);
4599
- --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--text--color--regular);
4600
- --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
4601
- --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
4602
- --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
4603
- --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
4604
- --pf-v6-c-button--m-plain--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
4605
- --pf-v6-c-button--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
4606
- --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
4607
- --pf-v6-c-button--m-plain--disabled--BackgroundColor: transparent;
4608
- --pf-v6-c-button--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
4609
- --pf-v6-c-button--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
4610
- --pf-v6-c-button--m-plain--m-no-padding--MinWidth: auto;
4611
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: 0;
4612
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
4613
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: 0;
4614
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: 0;
4615
- --pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineStart: 0;
4616
- --pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineEnd: 0;
4617
- --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-t--global--icon--color--subtle);
4618
- --pf-v6-c-button--m-plain--m-no-padding--BackgroundColor: transparent;
4619
- --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-t--global--icon--color--regular);
4620
- --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
4621
- --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
4622
- --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
4623
- --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--small);
4624
- --pf-v6-c-button--m-control--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
4625
- --pf-v6-c-button--m-control--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
4626
- --pf-v6-c-button--m-control--Color: var(--pf-t--global--text--color--regular);
4627
- --pf-v6-c-button--m-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
4628
- --pf-v6-c-button--m-control--BorderColor: var(--pf-t--global--border--color--default);
4629
- --pf-v6-c-button--m-control--BorderWidth: var(--pf-t--global--border--width--control--default);
4630
- --pf-v6-c-button--m-control__icon--Color: var(--pf-t--global--icon--color--regular);
4631
- --pf-v6-c-button--m-control--hover--Color: var(--pf-t--global--text--color--regular);
4632
- --pf-v6-c-button--m-control--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
4633
- --pf-v6-c-button--m-control--hover--BorderColor: var(--pf-t--global--border--color--hover);
4634
- --pf-v6-c-button--m-control--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
4635
- --pf-v6-c-button--m-control--hover__icon--Color: var(--pf-t--global--icon--color--regular);
4636
- --pf-v6-c-button--m-control--m-clicked--Color: var(--pf-t--global--text--color--regular);
4637
- --pf-v6-c-button--m-control--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
4638
- --pf-v6-c-button--m-control--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
4639
- --pf-v6-c-button--m-control--m-clicked--BorderWidth: var(--pf-t--global--border--width--control--clicked);
4640
- --pf-v6-c-button--m-control--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
4641
- --pf-v6-c-button--m-control--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
4642
- --pf-v6-c-button--m-control--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
4643
- --pf-v6-c-button--m-stateful--BorderRadius: var(--pf-t--global--border--radius--small);
4644
- --pf-v6-c-button--m-stateful--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
4645
- --pf-v6-c-button--m-stateful--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
4646
- --pf-v6-c-button--m-stateful--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
4647
- --pf-v6-c-button--m-stateful--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
4648
- --pf-v6-c-button--m-read--BackgroundColor: var(--pf-t--global--background--color--control--default);
4649
- --pf-v6-c-button--m-read--BorderColor: var(--pf-t--global--border--color--default);
4650
- --pf-v6-c-button--m-read--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
4651
- --pf-v6-c-button--m-read--hover--BorderColor: var(--pf-t--global--border--color--hover);
4652
- --pf-v6-c-button--m-read--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
4653
- --pf-v6-c-button--m-read--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
4654
- --pf-v6-c-button--m-unread--Color: var(--pf-t--global--text--color--status--unread--on-default--default);
4655
- --pf-v6-c-button--m-unread--BackgroundColor: var(--pf-t--global--color--status--unread--default);
4656
- --pf-v6-c-button--m-unread__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--default);
4657
- --pf-v6-c-button--m-unread--hover--Color: var(--pf-t--global--text--color--status--unread--on-default--hover);
4658
- --pf-v6-c-button--m-unread--hover--BackgroundColor: var(--pf-t--global--color--status--unread--hover);
4659
- --pf-v6-c-button--m-unread--hover__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--hover);
4660
- --pf-v6-c-button--m-unread--m-clicked--Color: var(--pf-t--global--text--color--status--unread--on-default--clicked);
4661
- --pf-v6-c-button--m-unread--m-clicked--BackgroundColor: var(--pf-t--global--color--status--unread--clicked);
4662
- --pf-v6-c-button--m-unread--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--clicked);
4663
- --pf-v6-c-button--m-attention--Color: var(--pf-t--global--text--color--status--unread--on-attention--default);
4664
- --pf-v6-c-button--m-attention--BackgroundColor: var(--pf-t--global--color--status--unread--attention--default);
4665
- --pf-v6-c-button--m-attention__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--default);
4666
- --pf-v6-c-button--m-attention--hover--Color: var(--pf-t--global--text--color--status--unread--on-attention--hover);
4667
- --pf-v6-c-button--m-attention--hover--BackgroundColor: var(--pf-t--global--color--status--unread--attention--hover);
4668
- --pf-v6-c-button--m-attention--hover__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--hover);
4669
- --pf-v6-c-button--m-attention--m-clicked--Color: var(--pf-t--global--text--color--status--unread--on-attention--clicked);
4670
- --pf-v6-c-button--m-attention--m-clicked--BackgroundColor: var(--pf-t--global--color--status--unread--attention--clicked);
4671
- --pf-v6-c-button--m-attention--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--clicked);
4672
- --pf-v6-c-button--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
4673
- --pf-v6-c-button--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
4674
- --pf-v6-c-button--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
4675
- --pf-v6-c-button--m-warning--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
4676
- --pf-v6-c-button--m-warning--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
4677
- --pf-v6-c-button--m-warning--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
4678
- --pf-v6-c-button--m-warning--m-clicked--Color: var(--pf-t--global--text--color--status--on-warning--clicked);
4679
- --pf-v6-c-button--m-warning--m-clicked--BackgroundColor: var(--pf-t--global--color--status--warning--clicked);
4680
- --pf-v6-c-button--m-warning--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--on-warning--clicked);
4681
- --pf-v6-c-button--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
4682
- --pf-v6-c-button--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
4683
- --pf-v6-c-button--m-danger__icon--Color: var(--pf-t--global--icon--color--status--on-danger--default);
4684
- --pf-v6-c-button--m-danger--hover--Color: var(--pf-t--global--text--color--status--on-danger--hover);
4685
- --pf-v6-c-button--m-danger--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
4686
- --pf-v6-c-button--m-danger--hover__icon--Color: var(--pf-t--global--icon--color--status--on-danger--hover);
4687
- --pf-v6-c-button--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--on-danger--clicked);
4688
- --pf-v6-c-button--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--color--status--danger--clicked);
4689
- --pf-v6-c-button--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--on-danger--clicked);
4690
- --pf-v6-c-button--m-display-lg--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--spacious);
4691
- --pf-v6-c-button--m-display-lg--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--spacious);
4692
- --pf-v6-c-button--m-display-lg--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--spacious);
4693
- --pf-v6-c-button--m-display-lg--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--spacious);
4694
- --pf-v6-c-button--m-display-lg--FontWeight: var(--pf-t--global--font--weight--body--bold);
4695
- --pf-v6-c-button--m-link--m-display-lg--FontSize: var(--pf-t--global--font--size--body--lg);
4696
- --pf-v6-c-button--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
4697
- --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
4698
- --pf-v6-c-button--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
4699
- --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
4700
- --pf-v6-c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
4701
- --pf-v6-c-button--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
4702
- --pf-v6-c-button--disabled--TextDecorationColor: currentcolor;
4703
- --pf-v6-c-button--disabled--BorderColor: transparent;
4704
- --pf-v6-c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
4705
- --pf-v6-c-button__icon--Color: var(--pf-t--global--icon--color--regular);
4706
- --pf-v6-c-button--hover__icon--Color: var(--pf-t--global--icon--color--regular);
4707
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
4708
- --pf-v6-c-button__icon--MarginInlineStart: 0;
4709
- --pf-v6-c-button__icon--MarginInlineEnd: 0;
4710
- --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
4711
- --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
4712
- --pf-v6-c-button--m-notify__icon--AnimationDuration--notify: var(--pf-t--global--motion--duration--3xl);
4713
- --pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify: var(--pf-t--global--motion--timing-function--default);
4714
- --pf-v6-c-button--m-favorite__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
4715
- --pf-v6-c-button--m-favorite__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
4716
- --pf-v6-c-button--m-favorited__icon--Color: var(--pf-t--global--color--favorite--default);
4717
- --pf-v6-c-button--m-favorited--hover__icon--Color: var(--pf-t--global--color--favorite--hover);
4718
- --pf-v6-c-button--m-favorited__icon--AnimationDuration: var(--pf-t--global--motion--duration--icon--long);
4719
- --pf-v6-c-button--m-favorited__icon--AnimationTimingFunction: var(--pf-t--global--motion--timing-function--default);
4720
- --pf-v6-c-button__icon--favorite--Opacity: 1;
4721
- --pf-v6-c-button__icon--favorited--Opacity: 0;
4722
- --pf-v6-c-button--m-favorited__icon--favorite--Opacity: 0;
4723
- --pf-v6-c-button--m-favorited__icon--favorited--Opacity: 1;
4724
- --pf-v6-c-button__icon--favorite--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
4725
- --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
4726
- --pf-v6-c-button__progress--Opacity: 0;
4727
- --pf-v6-c-button__progress--TranslateY: -50%;
4728
- --pf-v6-c-button__progress--TranslateX: 0;
4729
- --pf-v6-c-button__progress--InsetBlockStart: 50%;
4730
- --pf-v6-c-button__progress--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
4731
- --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
4732
- --pf-v6-c-button--m-progress--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
4733
- --pf-v6-c-button--m-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
4734
- --pf-v6-c-button--m-in-progress--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
4735
- --pf-v6-c-button--m-in-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width));
4736
- --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
4737
- --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
4738
- --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
4739
- --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
4740
- --pf-v6-c-button--m-block--Display: flex;
4741
- --pf-v6-c-button--m-block--Width: 100%;
4475
+ .pf-v6-c-check {
4476
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
4477
+ --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
4478
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
4479
+ --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
4480
+ --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
4481
+ --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
4482
+ --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
4483
+ --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
4484
+ --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
4485
+ --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
4486
+ --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
4487
+ --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
4488
+ --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
4489
+ --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
4742
4490
  }
4743
4491
 
4744
- .pf-v6-c-button {
4745
- position: relative;
4746
- display: var(--pf-v6-c-button--Display);
4747
- gap: var(--pf-v6-c-button--Gap);
4748
- align-items: var(--pf-v6-c-button--AlignItems);
4749
- justify-content: var(--pf-v6-c-button--JustifyContent);
4750
- min-width: var(--pf-v6-c-button--MinWidth);
4751
- padding-block-start: var(--pf-v6-c-button--PaddingBlockStart);
4752
- padding-block-end: var(--pf-v6-c-button--PaddingBlockEnd);
4753
- padding-inline-start: var(--pf-v6-c-button--PaddingInlineStart);
4754
- padding-inline-end: var(--pf-v6-c-button--PaddingInlineEnd);
4755
- font-size: var(--pf-v6-c-button--FontSize, inherit);
4756
- font-weight: var(--pf-v6-c-button--FontWeight, inherit);
4757
- line-height: var(--pf-v6-c-button--LineHeight, inherit);
4758
- color: var(--pf-v6-c-button--Color);
4759
- text-align: center;
4760
- text-decoration-line: var(--pf-v6-c-button--TextDecorationLine);
4761
- text-decoration-style: var(--pf-v6-c-button--TextDecorationStyle);
4762
- text-decoration-color: var(--pf-v6-c-button--TextDecorationColor);
4763
- white-space: nowrap;
4764
- cursor: pointer;
4765
- user-select: none;
4766
- background-color: var(--pf-v6-c-button--BackgroundColor);
4767
- border: 0;
4768
- border-start-start-radius: var(--pf-v6-c-button--BorderStartStartRadius, var(--pf-v6-c-button--BorderRadius));
4769
- border-start-end-radius: var(--pf-v6-c-button--BorderStartEndRadius, var(--pf-v6-c-button--BorderRadius));
4770
- border-end-start-radius: var(--pf-v6-c-button--BorderEndStartRadius, var(--pf-v6-c-button--BorderRadius));
4771
- border-end-end-radius: var(--pf-v6-c-button--BorderEndEndRadius, var(--pf-v6-c-button--BorderRadius));
4772
- transition-timing-function: var(--pf-v6-c-button--TransitionTimingFunction);
4773
- transition-duration: var(--pf-v6-c-button--TransitionDuration);
4774
- transition-property: var(--pf-v6-c-button--TransitionProperty);
4492
+ .pf-v6-c-check {
4493
+ display: grid;
4494
+ grid-template-columns: auto 1fr;
4495
+ grid-gap: var(--pf-v6-c-check--GridGap);
4496
+ accent-color: var(--pf-v6-c-check--AccentColor);
4775
4497
  }
4776
4498
 
4777
- .pf-v6-c-button::after {
4778
- position: absolute;
4779
- inset: 0;
4780
- pointer-events: none;
4781
- content: "";
4782
- border: var(--pf-v6-c-button--BorderWidth) solid;
4783
- border-color: var(--pf-v6-c-button--BorderColor);
4784
- border-radius: inherit;
4785
- transition: inherit;
4499
+ .pf-v6-c-check.pf-m-standalone {
4500
+ display: inline-grid;
4501
+ grid-template-columns: auto;
4502
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
4786
4503
  }
4787
4504
 
4788
- .pf-v6-c-button.pf-m-primary {
4789
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-primary--Color);
4790
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-primary--BackgroundColor);
4791
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-primary__icon--Color);
4792
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-primary--hover--Color);
4793
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-primary--hover--BackgroundColor);
4794
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-primary--hover__icon--Color);
4795
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-primary--m-clicked--Color);
4796
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-primary--m-clicked--BackgroundColor);
4797
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-primary--m-clicked__icon--Color);
4505
+ .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
4506
+ align-self: center;
4507
+ transform: none;
4798
4508
  }
4799
4509
 
4800
- .pf-v6-c-button.pf-m-primary .pf-v6-c-badge.pf-m-unread {
4801
- --pf-v6-c-badge--BorderColor: var(--pf-v6-c-button--m-primary__c-badge--BorderColor);
4510
+ .pf-v6-c-check__input {
4511
+ align-self: start;
4512
+ font-size: var(--pf-v6-c-check__label--FontSize);
4513
+ line-height: var(--pf-v6-c-check__label--LineHeight);
4514
+ transform: translateY(var(--pf-v6-c-check__input--TranslateY));
4802
4515
  }
4803
4516
 
4804
- .pf-v6-c-button.pf-m-secondary {
4805
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-secondary--Color);
4806
- --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-secondary--BorderColor);
4807
- --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-secondary--TransitionDuration);
4808
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-secondary__icon--Color);
4809
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-secondary--hover--Color);
4810
- --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-secondary--hover--BorderColor);
4811
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-secondary--hover__icon--Color);
4812
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-secondary--m-clicked--Color);
4813
- --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-secondary--m-clicked--BorderColor);
4814
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-secondary--m-clicked__icon--Color);
4815
- --pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-secondary--m-danger--Color);
4816
- --pf-v6-c-button--m-danger__icon--Color: var(--pf-v6-c-button--m-secondary--m-danger__icon--Color);
4817
- --pf-v6-c-button--m-danger--hover--Color: var(--pf-v6-c-button--m-secondary--m-danger--hover--Color);
4818
- --pf-v6-c-button--m-danger--hover__icon--Color: var(--pf-v6-c-button--m-secondary--m-danger--hover__icon--Color);
4819
- --pf-v6-c-button--m-danger--m-clicked--Color: var(--pf-v6-c-button--m-secondary--m-danger--m-clicked--Color);
4820
- --pf-v6-c-button--m-danger--m-clicked__icon--Color: var(--pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color);
4517
+ .pf-v6-c-check__label {
4518
+ font-size: var(--pf-v6-c-check__label--FontSize);
4519
+ font-weight: var(--pf-v6-c-check__label--FontWeight);
4520
+ line-height: var(--pf-v6-c-check__label--LineHeight);
4521
+ color: var(--pf-v6-c-check__label--Color);
4821
4522
  }
4822
4523
 
4823
- .pf-v6-c-button.pf-m-secondary.pf-m-danger {
4824
- --pf-v6-c-button--m-secondary--BorderColor: var(--pf-v6-c-button--m-secondary--m-danger--BorderColor);
4825
- --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-v6-c-button--m-secondary--m-danger--hover--BorderColor);
4826
- --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-v6-c-button--m-secondary--m-danger--m-clicked--BorderColor);
4827
- --pf-v6-c-button--m-danger--BackgroundColor: transparent;
4828
- --pf-v6-c-button--m-danger--hover--BackgroundColor: transparent;
4829
- --pf-v6-c-button--m-danger--m-clicked--BackgroundColor: transparent;
4524
+ .pf-v6-c-check__description {
4525
+ grid-column: 2;
4526
+ font-size: var(--pf-v6-c-check__description--FontSize);
4527
+ color: var(--pf-v6-c-check__description--Color);
4830
4528
  }
4831
4529
 
4832
- .pf-v6-c-button.pf-m-tertiary {
4833
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-tertiary--Color);
4834
- --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-tertiary--BorderColor);
4835
- --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-tertiary--TransitionDuration);
4836
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-tertiary__icon--Color);
4837
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-tertiary--hover--Color);
4838
- --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-tertiary--hover--BorderColor);
4839
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-tertiary--hover__icon--Color);
4840
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-tertiary--m-clicked--Color);
4841
- --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-tertiary--m-clicked--BorderColor);
4842
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-tertiary--m-clicked__icon--Color);
4530
+ .pf-v6-c-check__body {
4531
+ grid-column: 2;
4843
4532
  }
4844
4533
 
4845
- .pf-v6-c-button.pf-m-link {
4846
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-link--PaddingInlineEnd);
4847
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-link--PaddingInlineStart);
4848
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-link--Color);
4849
- --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-link--BorderRadius);
4850
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-link--BackgroundColor);
4851
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-link__icon--Color);
4852
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-link--hover--Color);
4853
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-link--hover--BackgroundColor);
4854
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-link--hover__icon--Color);
4855
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-link--m-clicked--Color);
4856
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-link--m-clicked--BackgroundColor);
4857
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-link--m-clicked__icon--Color);
4858
- --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-link--m-small--PaddingInlineEnd);
4859
- --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-small--PaddingInlineStart);
4534
+ .pf-v6-c-check__label,
4535
+ .pf-v6-c-check__input {
4536
+ justify-self: start;
4860
4537
  }
4861
4538
 
4862
- .pf-v6-c-button.pf-m-link.pf-m-inline {
4863
- --pf-v6-c-button--Display: var(--pf-v6-c-button--m-link--m-inline--Display);
4864
- --pf-v6-c-button--JustifyContent: var(--pf-v6-c-button--m-link--m-inline--JustifyContent);
4865
- --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-link--m-inline--FontSize);
4866
- --pf-v6-c-button--LineHeight: var(--pf-v6-c-button--m-link--m-inline--LineHeight);
4867
- --pf-v6-c-button--FontWeight: var(--pf-v6-c-button--m-link--m-inline--FontWeight);
4868
- --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-link--m-inline--PaddingBlockStart);
4869
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineEnd);
4870
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-link--m-inline--PaddingBlockEnd);
4871
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineStart);
4872
- --pf-v6-c-button--BackgroundColor: transparent;
4873
- --pf-v6-c-button__progress--InsetInlineStart: var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart);
4874
- --pf-v6-c-button--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--TextDecorationLine);
4875
- --pf-v6-c-button--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--TextDecorationStyle);
4876
- --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
4877
- --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
4878
- --pf-v6-c-button--hover--BackgroundColor: transparent;
4879
- --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
4880
- --pf-v6-c-button--disabled--BackgroundColor: transparent;
4881
- --pf-v6-c-button--disabled--Color: var(--pf-v6-c-button--m-link--m-inline--disabled--Color);
4882
- --pf-v6-c-button--disabled__icon--Color: var(--pf-v6-c-button--m-link--m-inline--disabled__icon--Color);
4883
- --pf-v6-c-button--m-link--Color: var(--pf-v6-c-button--m-link--m-inline--Color);
4884
- --pf-v6-c-button--m-link__icon--Color: var(--pf-v6-c-button--m-link--m-inline__icon--Color);
4885
- --pf-v6-c-button--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--TextDecorationColor);
4886
- --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
4887
- --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
4888
- --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
4889
- text-align: start;
4890
- white-space: normal;
4891
- outline-offset: 0.125rem;
4892
- }
4893
-
4894
- span.pf-v6-c-button.pf-m-link.pf-m-inline {
4895
- --pf-v6-c-button--m-link--m-inline--Display: var(--pf-v6-c-button--span--m-link--m-inline--Display);
4896
- --pf-v6-c-button__icon--m-start--MarginInlineEnd: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd);
4897
- --pf-v6-c-button__icon--m-end--MarginInlineStart: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart);
4539
+ label.pf-v6-c-check, .pf-v6-c-check__label,
4540
+ .pf-v6-c-check__input {
4541
+ cursor: pointer;
4898
4542
  }
4899
4543
 
4900
- .pf-v6-c-button.pf-m-link.pf-m-danger {
4901
- --pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-link--m-danger--Color);
4902
- --pf-v6-c-button--m-danger--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--BackgroundColor);
4903
- --pf-v6-c-button--m-danger__icon--Color: var(--pf-v6-c-button--m-link--m-danger__icon--Color);
4904
- --pf-v6-c-button--m-danger--hover--Color: var(--pf-v6-c-button--m-link--m-danger--hover--Color);
4905
- --pf-v6-c-button--m-danger--hover--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--hover--BackgroundColor);
4906
- --pf-v6-c-button--m-danger--hover__icon--Color: var(--pf-v6-c-button--m-link--m-danger--hover__icon--Color);
4907
- --pf-v6-c-button--m-danger--m-clicked--Color: var(--pf-v6-c-button--m-link--m-danger--m-clicked--Color);
4908
- --pf-v6-c-button--m-danger--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor);
4909
- --pf-v6-c-button--m-danger--m-clicked__icon--Color: var(--pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color);
4544
+ .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
4545
+ .pf-v6-c-check__input:disabled,
4546
+ .pf-v6-c-check__input.pf-m-disabled {
4547
+ --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
4548
+ cursor: not-allowed;
4910
4549
  }
4911
4550
 
4912
- .pf-v6-c-button.pf-m-link.pf-m-display-lg {
4913
- --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-link--m-display-lg--FontSize);
4551
+ .pf-v6-c-check__label-required {
4552
+ margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
4553
+ font-size: var(--pf-v6-c-check__label-required--FontSize);
4554
+ color: var(--pf-v6-c-check__label-required--Color);
4914
4555
  }
4915
4556
 
4916
- .pf-v6-c-button.pf-m-warning {
4917
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-warning--Color);
4918
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-warning--BackgroundColor);
4919
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-warning__icon--Color);
4920
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-warning--hover--Color);
4921
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-warning--hover--BackgroundColor);
4922
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-warning--hover__icon--Color);
4923
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-warning--m-clicked--Color);
4924
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-warning--m-clicked--BackgroundColor);
4925
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-warning--m-clicked__icon--Color);
4557
+ .pf-v6-c-menu-toggle {
4558
+ --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
4559
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
4560
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
4561
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
4562
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
4563
+ --pf-v6-c-menu-toggle--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
4564
+ --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
4565
+ --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
4566
+ --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
4567
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
4568
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
4569
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
4570
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--action--default);
4571
+ --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
4572
+ --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
4573
+ --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
4574
+ --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
4575
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
4576
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
4577
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--action--default);
4578
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
4579
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
4580
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
4581
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
4582
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
4583
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
4584
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
4585
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
4586
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
4587
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
4588
+ --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
4589
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
4590
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
4591
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
4592
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
4593
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
4594
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
4595
+ --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
4596
+ --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
4597
+ --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
4598
+ --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
4599
+ --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
4600
+ --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
4601
+ --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
4602
+ --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
4603
+ --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
4604
+ --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
4605
+ --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
4606
+ --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
4607
+ --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
4608
+ --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
4609
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
4610
+ --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
4611
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
4612
+ --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
4613
+ --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
4614
+ --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
4615
+ --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
4616
+ --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
4617
+ --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
4618
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
4619
+ --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
4620
+ --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
4621
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
4622
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
4623
+ --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
4624
+ --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
4625
+ --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
4626
+ --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
4627
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
4628
+ --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
4629
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
4630
+ --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
4631
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
4632
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
4633
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
4634
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
4635
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
4636
+ --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
4637
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
4638
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
4639
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
4640
+ --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
4641
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
4642
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
4643
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
4644
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
4645
+ --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
4646
+ --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
4647
+ --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
4648
+ --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
4649
+ --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
4650
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
4651
+ --pf-v6-c-menu-toggle__button--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
4652
+ --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
4653
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
4654
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
4655
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
4656
+ --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
4657
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
4658
+ --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
4659
+ --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
4660
+ --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
4661
+ --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
4662
+ --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
4663
+ --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
4664
+ --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
4665
+ --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
4666
+ --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
4667
+ --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
4668
+ --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
4669
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
4670
+ --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
4671
+ --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
4672
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
4673
+ --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
4674
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
4675
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
4676
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
4677
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
4678
+ --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
4679
+ --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
4680
+ --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
4681
+ --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
4682
+ --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
4683
+ --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
4684
+ --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
4685
+ --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
4686
+ --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
4687
+ --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
4688
+ --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
4926
4689
  }
4927
4690
 
4928
- .pf-v6-c-button.pf-m-danger {
4929
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-danger--Color);
4930
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-danger--BackgroundColor);
4931
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-danger__icon--Color);
4932
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-danger--hover--Color);
4933
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-danger--hover--BackgroundColor);
4934
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-danger--hover__icon--Color);
4935
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-danger--m-clicked--Color);
4936
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-danger--m-clicked--BackgroundColor);
4937
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-danger--m-clicked__icon--Color);
4691
+ .pf-v6-c-menu-toggle {
4692
+ position: relative;
4693
+ display: inline-flex;
4694
+ gap: var(--pf-v6-c-menu-toggle--Gap);
4695
+ align-items: center;
4696
+ justify-content: center;
4697
+ min-width: var(--pf-v6-c-menu-toggle--MinWidth);
4698
+ max-width: 100%;
4699
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
4700
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
4701
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
4702
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
4703
+ font-size: var(--pf-v6-c-menu-toggle--FontSize);
4704
+ line-height: var(--pf-v6-c-menu-toggle--LineHeight);
4705
+ color: var(--pf-v6-c-menu-toggle--Color);
4706
+ cursor: pointer;
4707
+ background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
4708
+ border: 0;
4709
+ transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
4710
+ transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
4711
+ transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
4938
4712
  }
4939
4713
 
4940
- .pf-v6-c-button.pf-m-control {
4941
- --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-control--BorderRadius);
4942
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-control--PaddingInlineStart);
4943
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-control--PaddingInlineEnd);
4944
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-control--Color);
4945
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-control--BackgroundColor);
4946
- --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-control--BorderColor);
4947
- --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-control--BorderWidth);
4948
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-control__icon--Color);
4949
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-control--hover--Color);
4950
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-control--hover--BackgroundColor);
4951
- --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-control--hover--BorderColor);
4952
- --pf-v6-c-button--hover--BorderWidth: var(--pf-v6-c-button--m-control--hover--BorderWidth);
4953
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-control--hover__icon--Color);
4954
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-control--m-clicked--Color);
4955
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-control--m-clicked--BackgroundColor);
4956
- --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-control--m-clicked--BorderColor);
4957
- --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-v6-c-button--m-control--m-clicked--BorderWidth);
4958
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-control--m-clicked__icon--Color);
4959
- --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-control--m-small--PaddingInlineEnd);
4960
- --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-control--m-small--PaddingInlineStart);
4714
+ .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
4715
+ border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
4961
4716
  }
4962
4717
 
4963
- .pf-v6-c-button.pf-m-stateful {
4964
- --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-stateful--BorderRadius);
4965
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-stateful--PaddingInlineStart);
4966
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-stateful--PaddingInlineEnd);
4967
- --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-stateful--m-small--PaddingInlineEnd);
4968
- --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-stateful--m-small--PaddingInlineStart);
4718
+ .pf-v6-c-menu-toggle::before {
4719
+ position: absolute;
4720
+ inset-block-start: 0;
4721
+ inset-block-end: 0;
4722
+ inset-inline-start: 0;
4723
+ inset-inline-end: 0;
4724
+ z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
4725
+ pointer-events: none;
4726
+ content: "";
4727
+ border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
4728
+ transition: inherit;
4969
4729
  }
4970
4730
 
4971
- .pf-v6-c-button.pf-m-read {
4972
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-read--BackgroundColor);
4973
- --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-read--BorderColor);
4974
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-read--hover--BackgroundColor);
4975
- --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-read--hover--BorderColor);
4976
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-read--m-clicked--BackgroundColor);
4977
- --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-read--m-clicked--BorderColor);
4731
+ .pf-v6-c-menu-toggle.pf-m-primary {
4732
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
4733
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
4734
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
4735
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
4736
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
4737
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
4738
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
4739
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
4740
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
4741
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
4742
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
4743
+ --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
4744
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
4745
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
4746
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
4747
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
4748
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
4978
4749
  }
4979
4750
 
4980
- .pf-v6-c-button.pf-m-unread {
4981
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-unread--Color);
4982
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-unread--BackgroundColor);
4983
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-unread__icon--Color);
4984
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-unread--hover--Color);
4985
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-unread--hover--BackgroundColor);
4986
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-unread--hover__icon--Color);
4987
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-unread--m-clicked--Color);
4988
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-unread--m-clicked--BackgroundColor);
4989
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-unread--m-clicked__icon--Color);
4751
+ .pf-v6-c-menu-toggle.pf-m-secondary {
4752
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
4753
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
4754
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
4755
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
4756
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
4757
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
4758
+ --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
4759
+ --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
4760
+ --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
4761
+ --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
4762
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
4763
+ --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
4764
+ --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
4765
+ --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
4766
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
4767
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
4768
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
4990
4769
  }
4991
4770
 
4992
- .pf-v6-c-button.pf-m-attention {
4993
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-attention--Color);
4994
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-attention--BackgroundColor);
4995
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-attention__icon--Color);
4996
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-attention--hover--Color);
4997
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-attention--hover--BackgroundColor);
4998
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-attention--hover__icon--Color);
4999
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-attention--m-clicked--Color);
5000
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-attention--m-clicked--BackgroundColor);
5001
- --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-attention--m-clicked__icon--Color);
4771
+ .pf-v6-c-menu-toggle.pf-m-full-height {
4772
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
4773
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
4774
+ --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
4775
+ align-items: center;
4776
+ height: 100%;
5002
4777
  }
5003
4778
 
5004
- .pf-v6-c-button.pf-m-plain {
5005
- --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-plain--BorderRadius);
5006
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-plain--Color);
5007
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-plain__icon--Color);
5008
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-plain--BackgroundColor);
5009
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--PaddingInlineEnd);
5010
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-plain--PaddingInlineStart);
5011
- --pf-v6-c-button__progress--Color: var(--pf-v6-c-button--m-in-progress--m-plain--Color);
5012
- --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-plain--hover--Color);
5013
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-plain--hover--BackgroundColor);
5014
- --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-plain--m-clicked--Color);
5015
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-plain--m-clicked--BackgroundColor);
5016
- --pf-v6-c-button--disabled--Color: var(--pf-v6-c-button--m-plain--disabled--Color);
5017
- --pf-v6-c-button--disabled__icon--Color: var(--pf-v6-c-button--m-plain--disabled__icon--Color);
5018
- --pf-v6-c-button--disabled--BackgroundColor: var(--pf-v6-c-button--m-plain--disabled--BackgroundColor);
5019
- --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineEnd);
5020
- --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineStart);
4779
+ .pf-v6-c-menu-toggle.pf-m-full-width {
4780
+ width: 100%;
5021
4781
  }
5022
4782
 
5023
- .pf-v6-c-button.pf-m-plain.pf-m-no-padding {
5024
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding__icon--Color);
5025
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--BackgroundColor);
5026
- --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor);
5027
- --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor);
5028
- --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart);
5029
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd);
5030
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd);
5031
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart);
5032
- --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineEnd);
5033
- --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineStart);
5034
- min-width: var(--pf-v6-c-button--m-plain--m-no-padding--MinWidth);
4783
+ .pf-v6-c-menu-toggle.pf-m-plain {
4784
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
4785
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
4786
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
4787
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
4788
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
4789
+ --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
4790
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
4791
+ --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
4792
+ --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
4793
+ --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
4794
+ --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
4795
+ --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
4796
+ --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
4797
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
4798
+ --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
5035
4799
  }
5036
4800
 
5037
- .pf-v6-c-button.pf-m-block {
5038
- --pf-v6-c-button--Display: var(--pf-v6-c-button--m-block--Display);
5039
- width: var(--pf-v6-c-button--m-block--Width);
4801
+ .pf-v6-c-menu-toggle.pf-m-plain::before {
4802
+ border: none;
5040
4803
  }
5041
4804
 
5042
- .pf-v6-c-button.pf-m-small {
5043
- --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-small--PaddingBlockStart);
5044
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-small--PaddingInlineEnd);
5045
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-small--PaddingBlockEnd);
5046
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-small--PaddingInlineStart);
4805
+ .pf-v6-c-menu-toggle:is(:hover, :focus) {
4806
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
4807
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
4808
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
4809
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
4810
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
5047
4811
  }
5048
4812
 
5049
- .pf-v6-c-button.pf-m-display-lg {
5050
- --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-display-lg--PaddingBlockStart);
5051
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-display-lg--PaddingInlineEnd);
5052
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-display-lg--PaddingBlockEnd);
5053
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-display-lg--PaddingInlineStart);
5054
- --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-display-lg--FontSize);
4813
+ .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
4814
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
4815
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
4816
+ --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
4817
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
4818
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
5055
4819
  }
5056
4820
 
5057
- .pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
5058
- display: grid;
5059
- transition-timing-function: var(--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction);
5060
- transition-duration: var(--pf-v6-c-button--m-favorite__icon--TransitionDuration);
5061
- transition-property: color;
4821
+ .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
4822
+ border: 0;
5062
4823
  }
5063
4824
 
5064
- .pf-v6-c-button.pf-m-favorited {
5065
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
5066
- --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
5067
- --pf-v6-c-button__icon--favorite--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorite--Opacity);
5068
- --pf-v6-c-button__icon--favorited--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorited--Opacity);
4825
+ .pf-v6-c-menu-toggle.pf-m-small {
4826
+ --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
4827
+ --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
4828
+ --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
4829
+ --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
4830
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
4831
+ --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
4832
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset);
4833
+ --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset);
5069
4834
  }
5070
4835
 
5071
- .pf-v6-c-button.pf-m-favorited .pf-v6-c-button__icon {
5072
- animation-name: pf-v6-c-button-icon-favorited;
5073
- animation-duration: var(--pf-v6-c-button--m-favorited__icon--AnimationDuration);
5074
- animation-timing-function: var(--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction);
4836
+ .pf-v6-c-menu-toggle.pf-m-success {
4837
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
4838
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
5075
4839
  }
5076
4840
 
5077
- .pf-v6-c-button:hover, .pf-v6-c-button:focus {
5078
- --pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
5079
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
5080
- --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--hover--BorderColor);
5081
- --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
5082
- --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
5083
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
5084
- text-decoration-line: var(--pf-v6-c-button--hover--TextDecorationLine);
5085
- text-decoration-style: var(--pf-v6-c-button--hover--TextDecorationStyle);
5086
- text-decoration-color: var(--pf-v6-c-button--hover--TextDecorationColor);
4841
+ .pf-v6-c-menu-toggle.pf-m-warning {
4842
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
4843
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
5087
4844
  }
5088
4845
 
5089
- .pf-v6-c-button.pf-m-clicked {
5090
- --pf-v6-c-button--Color: var(--pf-v6-c-button--m-clicked--Color);
5091
- --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-clicked--BackgroundColor);
5092
- --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-clicked--BorderWidth);
5093
- --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-clicked--BorderColor);
5094
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-clicked__icon--Color);
4846
+ .pf-v6-c-menu-toggle.pf-m-danger {
4847
+ --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
4848
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
5095
4849
  }
5096
4850
 
5097
- .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled {
5098
- pointer-events: none;
4851
+ @media screen and (prefers-reduced-motion: no-preference) {
4852
+ .pf-v6-c-menu-toggle.pf-m-danger {
4853
+ transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
4854
+ animation-name: pf-v6-c-menu-toggle-m-danger-motion;
4855
+ animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
4856
+ animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
4857
+ animation-fill-mode: both;
4858
+ }
5099
4859
  }
5100
-
5101
- .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled, .pf-v6-c-button.pf-m-aria-disabled {
5102
- color: var(--pf-v6-c-button--disabled--Color);
5103
- text-decoration-color: var(--pf-v6-c-button--disabled--TextDecorationColor);
5104
- background-color: var(--pf-v6-c-button--disabled--BackgroundColor);
4860
+ .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
4861
+ animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
4862
+ animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
4863
+ animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
5105
4864
  }
5106
4865
 
5107
- .pf-v6-c-button:disabled::after, .pf-v6-c-button.pf-m-disabled::after, .pf-v6-c-button.pf-m-aria-disabled::after {
5108
- border-color: transparent;
4866
+ @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
4867
+ from {
4868
+ opacity: 0;
4869
+ }
4870
+ to {
4871
+ opacity: 1;
4872
+ }
4873
+ }
4874
+ .pf-v6-c-menu-toggle.pf-m-placeholder {
4875
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
5109
4876
  }
5110
4877
 
5111
- .pf-v6-c-button:disabled .pf-v6-c-button__icon, .pf-v6-c-button.pf-m-disabled .pf-v6-c-button__icon, .pf-v6-c-button.pf-m-aria-disabled .pf-v6-c-button__icon {
5112
- color: var(--pf-v6-c-button--disabled__icon--Color);
4878
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
4879
+ --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
4880
+ --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
4881
+ --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
4882
+ --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
4883
+ --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
5113
4884
  }
5114
4885
 
5115
- .pf-v6-c-button.pf-m-aria-disabled {
5116
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-v6-c-button--TextDecorationLine);
5117
- --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-v6-c-button--TextDecorationStyle);
5118
- cursor: default;
4886
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
4887
+ .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
4888
+ pointer-events: none;
5119
4889
  }
5120
4890
 
5121
- .pf-v6-c-button.pf-m-progress {
5122
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-progress--PaddingInlineEnd);
5123
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-progress--PaddingInlineStart);
4891
+ @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
4892
+ syntax: "<length>";
4893
+ inherits: false;
4894
+ initial-value: 0;
4895
+ }
4896
+ @media (prefers-reduced-motion: no-preference) {
4897
+ @keyframes pf-v6-c-menu-toggle-m-danger-motion {
4898
+ 33% {
4899
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
4900
+ }
4901
+ 66% {
4902
+ --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
4903
+ }
4904
+ }
4905
+ }
4906
+ .pf-v6-c-menu-toggle.pf-m-split-button {
4907
+ --pf-v6-c-menu-toggle--Gap: 0;
4908
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
4909
+ padding: 0;
5124
4910
  }
5125
4911
 
5126
- .pf-v6-c-button.pf-m-in-progress {
5127
- --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart);
4912
+ .pf-v6-c-menu-toggle.pf-m-split-button > * {
4913
+ position: relative;
4914
+ padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
4915
+ padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
4916
+ padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
4917
+ padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5128
4918
  }
5129
4919
 
5130
- .pf-v6-c-button.pf-m-in-progress:not(.pf-m-plain) {
5131
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-in-progress--PaddingInlineEnd);
5132
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-in-progress--PaddingInlineStart);
4920
+ .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
4921
+ border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
4922
+ border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5133
4923
  }
5134
4924
 
5135
- .pf-v6-c-button.pf-m-in-progress.pf-m-plain {
5136
- --pf-v6-c-button__progress--InsetInlineStart: var(--pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart);
5137
- --pf-v6-c-button__progress--TranslateX: var(--pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX);
4925
+ .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
4926
+ border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
4927
+ border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5138
4928
  }
5139
4929
 
5140
- .pf-v6-c-button.pf-m-in-progress.pf-m-plain > :not(.pf-v6-c-button__progress) {
5141
- opacity: 0;
4930
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
4931
+ --pf-v6-c-check__label--Color: currentcolor;
4932
+ --pf-v6-c-check__label--disabled--Color: currentcolor;
4933
+ align-items: center;
4934
+ align-self: stretch;
5142
4935
  }
5143
4936
 
5144
- .pf-v6-c-button.pf-m-notify .pf-v6-c-button__icon {
5145
- animation-name: pf-v6-c-button-icon-notify;
5146
- animation-duration: var(--pf-v6-c-button--m-notify__icon--AnimationDuration--notify);
5147
- animation-timing-function: var(--pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify);
4937
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
4938
+ --pf-v6-c-check__input--TranslateY: 0;
4939
+ align-self: center;
5148
4940
  }
5149
4941
 
5150
- .pf-v6-c-button__icon {
5151
- margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
5152
- margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
5153
- color: var(--pf-v6-c-button__icon--Color);
4942
+ .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
4943
+ border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor);
5154
4944
  }
5155
4945
 
5156
- .pf-v6-c-button__icon.pf-m-start {
5157
- --pf-v6-c-button__icon--MarginInlineEnd: var(--pf-v6-c-button__icon--m-start--MarginInlineEnd);
4946
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
4947
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
5158
4948
  }
5159
4949
 
5160
- .pf-v6-c-button__icon.pf-m-end {
5161
- --pf-v6-c-button__icon--MarginInlineStart: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
4950
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
4951
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
4952
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
5162
4953
  }
5163
4954
 
5164
- .pf-v6-c-button__icon-favorite,
5165
- .pf-v6-c-button__icon-favorited {
5166
- grid-area: 1/1/1/1;
5167
- transition-duration: var(--pf-v6-c-button__icon--favorite--TransitionDuration);
5168
- transition-property: opacity;
4955
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
4956
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
4957
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor);
5169
4958
  }
5170
4959
 
5171
- .pf-v6-c-button__icon-favorite {
5172
- opacity: var(--pf-v6-c-button__icon--favorite--Opacity);
4960
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
4961
+ --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor);
5173
4962
  }
5174
4963
 
5175
- .pf-v6-c-button__icon-favorited {
5176
- opacity: var(--pf-v6-c-button__icon--favorited--Opacity);
4964
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
4965
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
5177
4966
  }
5178
4967
 
5179
- .pf-v6-c-button__progress {
5180
- position: absolute;
5181
- inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
5182
- inset-inline-start: var(--pf-v6-c-button__progress--InsetInlineStart);
5183
- line-height: 1;
5184
- color: var(--pf-v6-c-button__progress--Color);
5185
- transform: translate(var(--pf-v6-c-button__progress--TranslateX), var(--pf-v6-c-button__progress--TranslateY));
4968
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
4969
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):first-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
4970
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
4971
+ padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
5186
4972
  }
5187
4973
 
5188
- .pf-v6-c-button__progress .pf-v6-c-spinner {
5189
- --pf-v6-c-spinner--Color: currentcolor;
4974
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
4975
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):last-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
4976
+ .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
4977
+ padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
5190
4978
  }
5191
4979
 
5192
- .pf-v6-c-button__text {
5193
- text-decoration: inherit;
4980
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
4981
+ --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
5194
4982
  }
5195
4983
 
5196
- .pf-v6-c-button__count {
5197
- display: inline-flex;
5198
- align-items: center;
4984
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
4985
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
4986
+ color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
4987
+ background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
5199
4988
  }
5200
4989
 
5201
- @keyframes pf-v6-c-button-icon-notify {
5202
- 33% {
5203
- transform: rotate(30deg);
5204
- }
5205
- 66% {
5206
- transform: rotate(-60deg);
5207
- }
4990
+ .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
4991
+ content: none;
5208
4992
  }
5209
- @keyframes pf-v6-c-button-icon-favorited {
5210
- 50% {
5211
- transform: scale(1.5);
5212
- }
4993
+
4994
+ .pf-v6-c-menu-toggle.pf-m-typeahead {
4995
+ --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
4996
+ --pf-v6-c-menu-toggle--Gap: 0;
4997
+ align-items: stretch;
4998
+ padding: 0;
5213
4999
  }
5214
- .pf-v6-c-check {
5215
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
5216
- --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
5217
- --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
5218
- --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
5219
- --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
5220
- --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
5221
- --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
5222
- --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
5223
- --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
5224
- --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
5225
- --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
5226
- --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
5227
- --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
5228
- --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
5000
+
5001
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
5002
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
5229
5003
  }
5230
5004
 
5231
- .pf-v6-c-check {
5232
- display: grid;
5233
- grid-template-columns: auto 1fr;
5234
- grid-gap: var(--pf-v6-c-check--GridGap);
5235
- accent-color: var(--pf-v6-c-check--AccentColor);
5005
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
5006
+ --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
5007
+ display: flex;
5008
+ align-items: stretch;
5236
5009
  }
5237
5010
 
5238
- .pf-v6-c-check.pf-m-standalone {
5239
- display: inline-grid;
5240
- grid-template-columns: auto;
5241
- min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
5011
+ .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
5012
+ --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
5013
+ flex: 1;
5242
5014
  }
5243
5015
 
5244
- .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
5245
- align-self: center;
5246
- transform: none;
5016
+ .pf-v6-c-menu-toggle__button {
5017
+ gap: var(--pf-v6-c-menu-toggle__button--Gap);
5018
+ align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
5019
+ min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
5020
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
5021
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
5022
+ color: inherit;
5023
+ background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
5024
+ border: 0;
5247
5025
  }
5248
5026
 
5249
- .pf-v6-c-check__input {
5250
- align-self: start;
5251
- font-size: var(--pf-v6-c-check__label--FontSize);
5252
- line-height: var(--pf-v6-c-check__label--LineHeight);
5253
- transform: translateY(var(--pf-v6-c-check__input--TranslateY));
5027
+ .pf-v6-c-menu-toggle__button.pf-m-text {
5028
+ display: inline-flex;
5029
+ align-items: baseline;
5254
5030
  }
5255
5031
 
5256
- .pf-v6-c-check__label {
5257
- font-size: var(--pf-v6-c-check__label--FontSize);
5258
- font-weight: var(--pf-v6-c-check__label--FontWeight);
5259
- line-height: var(--pf-v6-c-check__label--LineHeight);
5260
- color: var(--pf-v6-c-check__label--Color);
5032
+ .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check.pf-m-standalone, .pf-v6-c-menu-toggle__button:has(> .pf-v6-c-menu-toggle__controls:only-child) {
5033
+ padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
5034
+ padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
5261
5035
  }
5262
5036
 
5263
- .pf-v6-c-check__description {
5264
- grid-column: 2;
5265
- font-size: var(--pf-v6-c-check__description--FontSize);
5266
- color: var(--pf-v6-c-check__description--Color);
5037
+ .pf-v6-c-menu-toggle__text {
5038
+ overflow: hidden;
5039
+ text-overflow: ellipsis;
5040
+ white-space: nowrap;
5041
+ min-width: 0;
5267
5042
  }
5268
5043
 
5269
- .pf-v6-c-check__body {
5270
- grid-column: 2;
5044
+ .pf-v6-c-menu-toggle__count {
5045
+ display: flex;
5046
+ flex-wrap: nowrap;
5271
5047
  }
5272
5048
 
5273
- .pf-v6-c-check__label,
5274
- .pf-v6-c-check__input {
5275
- justify-self: start;
5049
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
5050
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
5051
+ .pf-v6-c-menu-toggle__icon.pf-m-avatar svg, .pf-v6-c-menu-toggle:not(.pf-m-plain) .pf-v6-c-menu-toggle__icon {
5052
+ margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
5053
+ margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
5276
5054
  }
5277
5055
 
5278
- label.pf-v6-c-check, .pf-v6-c-check__label,
5279
- .pf-v6-c-check__input {
5280
- cursor: pointer;
5056
+ .pf-v6-c-menu-toggle__icon {
5057
+ flex-shrink: 0;
5281
5058
  }
5282
5059
 
5283
- .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
5284
- .pf-v6-c-check__input:disabled,
5285
- .pf-v6-c-check__input.pf-m-disabled {
5286
- --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
5287
- cursor: not-allowed;
5060
+ .pf-v6-c-menu-toggle__icon :where(picture, img) {
5061
+ vertical-align: middle;
5288
5062
  }
5289
5063
 
5290
- .pf-v6-c-check__label-required {
5291
- margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
5292
- font-size: var(--pf-v6-c-check__label-required--FontSize);
5293
- color: var(--pf-v6-c-check__label-required--Color);
5064
+ .pf-v6-c-menu-toggle__controls {
5065
+ display: flex;
5066
+ gap: var(--pf-v6-c-menu-toggle__controls--Gap);
5067
+ align-items: center;
5068
+ justify-content: center;
5069
+ margin-inline-start: auto;
5294
5070
  }
5295
5071
 
5296
- .pf-v6-c-menu-toggle {
5297
- --pf-v6-c-menu-toggle--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5298
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5299
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5300
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
5301
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5302
- --pf-v6-c-menu-toggle--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5303
- --pf-v6-c-menu-toggle--FontSize: var(--pf-t--global--font--size--body--default);
5304
- --pf-v6-c-menu-toggle--Color: var(--pf-t--global--text--color--regular);
5305
- --pf-v6-c-menu-toggle--LineHeight: var(--pf-t--global--font--line-height--body);
5306
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
5307
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-t--global--border--radius--small);
5308
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-t--global--border--color--default);
5309
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-t--global--border--width--action--default);
5310
- --pf-v6-c-menu-toggle--border--ZIndex: var(--pf-t--global--z-index--xs);
5311
- --pf-v6-c-menu-toggle--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
5312
- --pf-v6-c-menu-toggle--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5313
- --pf-v6-c-menu-toggle--TransitionProperty: color, background-color, border-width, border-color;
5314
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-t--global--text--color--regular);
5315
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5316
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-t--global--border--width--action--default);
5317
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-t--global--border--color--hover);
5318
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5319
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-t--global--text--color--regular);
5320
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-t--global--background--color--control--default);
5321
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5322
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-t--global--border--color--clicked);
5323
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5324
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5325
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
5326
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
5327
- --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
5328
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5329
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
5330
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
5331
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
5332
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
5333
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5334
- --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5335
- --pf-v6-c-menu-toggle--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
5336
- --pf-v6-c-menu-toggle--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
5337
- --pf-v6-c-menu-toggle--m-primary--BorderRadius: var(--pf-t--global--border--radius--pill);
5338
- --pf-v6-c-menu-toggle--m-primary--BorderColor: transparent;
5339
- --pf-v6-c-menu-toggle--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
5340
- --pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5341
- --pf-v6-c-menu-toggle--m-primary--hover--BorderColor: transparent;
5342
- --pf-v6-c-menu-toggle--m-primary--expanded--Color: var(--pf-t--global--text--color--on-brand--clicked);
5343
- --pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5344
- --pf-v6-c-menu-toggle--m-primary--expanded--BorderColor: transparent;
5345
- --pf-v6-c-menu-toggle--m-primary__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
5346
- --pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
5347
- --pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
5348
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
5349
- --pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
5350
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5351
- --pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5352
- --pf-v6-c-menu-toggle--m-secondary--BackgroundColor: transparent;
5353
- --pf-v6-c-menu-toggle--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
5354
- --pf-v6-c-menu-toggle--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
5355
- --pf-v6-c-menu-toggle--m-secondary--BorderRadius: var(--pf-t--global--border--radius--pill);
5356
- --pf-v6-c-menu-toggle--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5357
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
5358
- --pf-v6-c-menu-toggle--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
5359
- --pf-v6-c-menu-toggle--m-secondary--expanded--Color: var(--pf-t--global--text--color--brand--clicked);
5360
- --pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor: transparent;
5361
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5362
- --pf-v6-c-menu-toggle--m-secondary--expanded--BorderColor: var(--pf-t--global--border--color--brand--clicked);
5363
- --pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
5364
- --pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--hover);
5365
- --pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5366
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
5367
- --pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
5368
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--spacious);
5369
- --pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--spacious);
5370
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-t--global--text--color--on-disabled);
5371
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
5372
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth: var(--pf-t--global--border--width--action--default);
5373
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5374
- --pf-v6-c-menu-toggle--m-split-button--child--BorderRadius: var(--pf-t--global--border--radius--pill);
5375
- --pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor: var(--pf-t--global--icon--color--on-disabled);
5376
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--default);
5377
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--default);
5378
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset: var(--pf-t--global--spacer--control--horizontal--compact);
5379
- --pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset: var(--pf-t--global--spacer--control--horizontal--compact);
5380
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-t--global--color--brand--default);
5381
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5382
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor: var(--pf-t--global--border--color--default);
5383
- --pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5384
- --pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor: var(--pf-t--global--color--brand--default);
5385
- --pf-v6-c-menu-toggle__button--BackgroundColor: transparent;
5386
- --pf-v6-c-menu-toggle__button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5387
- --pf-v6-c-menu-toggle__button--AlignSelf: baseline;
5388
- --pf-v6-c-menu-toggle__button--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--plain);
5389
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--plain);
5390
- --pf-v6-c-menu-toggle__button--MinWidth: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight) + var(--pf-v6-c-menu-toggle--PaddingBlockStart) + var(--pf-v6-c-menu-toggle--PaddingBlockEnd));
5391
- --pf-v6-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-t--global--spacer--sm);
5392
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5393
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5394
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5395
- --pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5396
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5397
- --pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5398
- --pf-v6-c-menu-toggle--m-plain--Color: var(--pf-t--global--icon--color--regular);
5399
- --pf-v6-c-menu-toggle--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5400
- --pf-v6-c-menu-toggle--m-plain--BorderColor: transparent;
5401
- --pf-v6-c-menu-toggle--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
5402
- --pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5403
- --pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5404
- --pf-v6-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
5405
- --pf-v6-c-menu-toggle--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5406
- --pf-v6-c-menu-toggle--m-plain--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
5407
- --pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
5408
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5409
- --pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5410
- --pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
5411
- --pf-v6-c-menu-toggle--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
5412
- --pf-v6-c-menu-toggle--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
5413
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5414
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5415
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-t--global--icon--color--regular);
5416
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--icon--default);
5417
- --pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
5418
- --pf-v6-c-menu-toggle--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
5419
- --pf-v6-c-menu-toggle--m-success__status-icon--Color: var(--pf-t--global--icon--color--status--success--default);
5420
- --pf-v6-c-menu-toggle--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
5421
- --pf-v6-c-menu-toggle--m-warning__status-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
5422
- --pf-v6-c-menu-toggle--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5423
- --pf-v6-c-menu-toggle--m-danger__status-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5424
- --pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform: var(--pf-t--global--motion--duration--fade--default);
5425
- --pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform: var(--pf-t--global--motion--timing-function--default);
5426
- --pf-v6-c-menu-toggle--m-placeholder--Color: var(--pf-t--global--text--color--placeholder);
5427
- --pf-v6-c-menu-toggle__controls--Gap: var(--pf-t--global--spacer--sm);
5072
+ .pf-v6-c-menu-toggle__toggle-icon {
5073
+ min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
5074
+ color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
5428
5075
  }
5429
5076
 
5430
- .pf-v6-c-menu-toggle {
5431
- position: relative;
5432
- display: inline-flex;
5433
- gap: var(--pf-v6-c-menu-toggle--Gap);
5434
- align-items: center;
5435
- justify-content: center;
5436
- min-width: var(--pf-v6-c-menu-toggle--MinWidth);
5437
- max-width: 100%;
5438
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
5439
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
5440
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
5441
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5442
- font-size: var(--pf-v6-c-menu-toggle--FontSize);
5443
- line-height: var(--pf-v6-c-menu-toggle--LineHeight);
5444
- color: var(--pf-v6-c-menu-toggle--Color);
5445
- cursor: pointer;
5446
- background-color: var(--pf-v6-c-menu-toggle--BackgroundColor);
5447
- border: 0;
5448
- transition-timing-function: var(--pf-v6-c-menu-toggle--TransitionTimingFunction);
5449
- transition-duration: var(--pf-v6-c-menu-toggle--TransitionDuration);
5450
- transition-property: var(--pf-v6-c-menu-toggle--TransitionProperty);
5077
+ .pf-v6-c-menu-toggle__status-icon {
5078
+ color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
5451
5079
  }
5452
5080
 
5453
- .pf-v6-c-menu-toggle, .pf-v6-c-menu-toggle::before {
5454
- border-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5081
+ .pf-v6-c-divider {
5082
+ --pf-v6-c-divider--Display: flex;
5083
+ --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
5084
+ --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
5085
+ --pf-v6-c-divider--before--FlexBasis: 100%;
5455
5086
  }
5456
5087
 
5457
- .pf-v6-c-menu-toggle::before {
5458
- position: absolute;
5459
- inset-block-start: 0;
5460
- inset-block-end: 0;
5461
- inset-inline-start: 0;
5462
- inset-inline-end: 0;
5463
- z-index: var(--pf-v6-c-menu-toggle--border--ZIndex);
5464
- pointer-events: none;
5465
- content: "";
5466
- border: var(--pf-v6-c-menu-toggle--BorderWidth) solid var(--pf-v6-c-menu-toggle--BorderColor);
5467
- transition: inherit;
5088
+ .pf-v6-c-divider {
5089
+ flex-direction: row;
5090
+ width: 100%;
5091
+ height: var(--pf-v6-c-divider--Size);
5092
+ --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
5093
+ --pf-v6-hidden-visible--hidden--Display: none;
5094
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5095
+ display: var(--pf-v6-hidden-visible--Display);
5096
+ flex-shrink: 0;
5097
+ align-items: stretch;
5098
+ align-self: stretch;
5099
+ justify-content: center;
5100
+ border: 0;
5468
5101
  }
5469
5102
 
5470
- .pf-v6-c-menu-toggle.pf-m-primary {
5471
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineStart);
5472
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd);
5473
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-primary--Color);
5474
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--BackgroundColor);
5475
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-primary--BorderRadius);
5476
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--BorderColor);
5477
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-primary--hover--Color);
5478
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BackgroundColor);
5479
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--hover--BorderColor);
5480
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded--Color);
5481
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BackgroundColor);
5482
- --pf-v6-c-menu-toggle--expanded--BorderColor: var(--pf-v6-c-menu-toggle--m-primary--expanded--BorderColor);
5483
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--hover__toggle-icon--Color);
5484
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary--expanded__toggle-icon--Color);
5485
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-primary__toggle-icon--Color);
5486
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineStart);
5487
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-primary--m-small--PaddingInlineEnd);
5103
+ .pf-v6-c-divider.pf-m-hidden {
5104
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5488
5105
  }
5489
5106
 
5490
- .pf-v6-c-menu-toggle.pf-m-secondary {
5491
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineStart);
5492
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--PaddingInlineEnd);
5493
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-secondary--Color);
5494
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--BackgroundColor);
5495
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--BorderColor);
5496
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-secondary--BorderRadius);
5497
- --pf-v6-c-menu-toggle--hover--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover--Color);
5498
- --pf-v6-c-menu-toggle--hover--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderWidth);
5499
- --pf-v6-c-menu-toggle--hover--BorderColor: var(--pf-v6-c-menu-toggle--m-secondary--hover--BorderColor);
5500
- --pf-v6-c-menu-toggle--expanded--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded--Color);
5501
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BackgroundColor);
5502
- --pf-v6-c-menu-toggle--expanded--BorderWidth: var(--pf-v6-c-menu-toggle--m-secondary--expanded--BorderWidth);
5503
- --pf-v6-c-menu-toggle--hover__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--hover__toggle-icon--Color);
5504
- --pf-v6-c-menu-toggle--expanded__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary--expanded__toggle-icon--Color);
5505
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-secondary__toggle-icon--Color);
5506
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineStart);
5507
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-secondary--m-small--PaddingInlineEnd);
5107
+ @media screen and (min-width: 36rem) {
5108
+ .pf-v6-c-divider.pf-m-hidden-on-sm {
5109
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5110
+ }
5111
+ .pf-v6-c-divider.pf-m-visible-on-sm {
5112
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5113
+ }
5508
5114
  }
5509
-
5510
- .pf-v6-c-menu-toggle.pf-m-full-height {
5511
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineEnd);
5512
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-full-height--PaddingInlineStart);
5513
- --pf-v6-c-menu-toggle--BorderBlockStartWidth: var(--pf-v6-c-menu-toggle--m-full-height__toggle--BorderBlockStartWidth);
5514
- align-items: center;
5515
- height: 100%;
5115
+ @media screen and (min-width: 48rem) {
5116
+ .pf-v6-c-divider.pf-m-hidden-on-md {
5117
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5118
+ }
5119
+ .pf-v6-c-divider.pf-m-visible-on-md {
5120
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5121
+ }
5516
5122
  }
5517
-
5518
- .pf-v6-c-menu-toggle.pf-m-full-width {
5519
- width: 100%;
5123
+ @media screen and (min-width: 62rem) {
5124
+ .pf-v6-c-divider.pf-m-hidden-on-lg {
5125
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5126
+ }
5127
+ .pf-v6-c-divider.pf-m-visible-on-lg {
5128
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5129
+ }
5520
5130
  }
5521
-
5522
- .pf-v6-c-menu-toggle.pf-m-plain {
5523
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineStart);
5524
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--PaddingInlineEnd);
5525
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-plain--Color);
5526
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
5527
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-plain--BorderColor);
5528
- --pf-v6-c-menu-toggle--BorderRadius: var(--pf-v6-c-menu-toggle--m-plain--BorderRadius);
5529
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--BackgroundColor);
5530
- --pf-v6-c-menu-toggle--hover--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--hover--BackgroundColor);
5531
- --pf-v6-c-menu-toggle--expanded--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--expanded--BackgroundColor);
5532
- --pf-v6-c-menu-toggle--disabled--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled--Color);
5533
- --pf-v6-c-menu-toggle--disabled__icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5534
- --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-v6-c-menu-toggle--m-plain--disabled__icon--Color);
5535
- --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-v6-c-menu-toggle--m-plain--disabled--BackgroundColor);
5536
- --pf-v6-c-menu-toggle--m-small--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineStart);
5537
- --pf-v6-c-menu-toggle--m-small--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-plain--m-small--PaddingInlineEnd);
5131
+ @media screen and (min-width: 75rem) {
5132
+ .pf-v6-c-divider.pf-m-hidden-on-xl {
5133
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5134
+ }
5135
+ .pf-v6-c-divider.pf-m-visible-on-xl {
5136
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5137
+ }
5538
5138
  }
5539
-
5540
- .pf-v6-c-menu-toggle.pf-m-plain::before {
5541
- border: none;
5139
+ @media screen and (min-width: 90.625rem) {
5140
+ .pf-v6-c-divider.pf-m-hidden-on-2xl {
5141
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
5142
+ }
5143
+ .pf-v6-c-divider.pf-m-visible-on-2xl {
5144
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
5145
+ }
5542
5146
  }
5543
-
5544
- .pf-v6-c-menu-toggle:is(:hover, :focus) {
5545
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--hover--Color);
5546
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--hover--BackgroundColor);
5547
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--hover--BorderWidth);
5548
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--hover--BorderColor);
5549
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--hover__toggle-icon--Color);
5147
+ .pf-v6-c-divider::before {
5148
+ flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
5149
+ content: "";
5150
+ background-color: var(--pf-v6-c-divider--Color);
5550
5151
  }
5551
5152
 
5552
- .pf-v6-c-menu-toggle:is(.pf-m-expanded, [aria-expanded=true]) {
5553
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--expanded--Color);
5554
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--expanded--BackgroundColor);
5555
- --pf-v6-c-menu-toggle--BorderWidth: var(--pf-v6-c-menu-toggle--expanded--BorderWidth);
5556
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--expanded--BorderColor);
5557
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--expanded__toggle-icon--Color);
5153
+ .pf-v6-c-divider.pf-m-horizontal {
5154
+ flex-direction: row;
5155
+ width: 100%;
5156
+ height: var(--pf-v6-c-divider--Size);
5558
5157
  }
5559
5158
 
5560
- .pf-v6-c-menu-toggle.pf-m-primary::before, .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled)::before {
5561
- border: 0;
5159
+ .pf-v6-c-divider.pf-m-vertical {
5160
+ flex-direction: column;
5161
+ width: var(--pf-v6-c-divider--Size);
5162
+ height: inherit;
5562
5163
  }
5563
5164
 
5564
- .pf-v6-c-menu-toggle.pf-m-small {
5565
- --pf-v6-c-menu-toggle--PaddingBlockStart: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockStart);
5566
- --pf-v6-c-menu-toggle--PaddingBlockEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingBlockEnd);
5567
- --pf-v6-c-menu-toggle--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineStart);
5568
- --pf-v6-c-menu-toggle--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small--PaddingInlineEnd);
5569
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineStart);
5570
- --pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd: var(--pf-v6-c-menu-toggle--m-small__button--toggle-icon--PaddingInlineEnd);
5571
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineStart--offset);
5572
- --pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset: var(--pf-v6-c-menu-toggle--m-split-button--m-small--pill--child--PaddingInlineEnd--offset);
5165
+ .pf-v6-c-divider.pf-m-inset-none {
5166
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
5573
5167
  }
5574
5168
 
5575
- .pf-v6-c-menu-toggle.pf-m-success {
5576
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-success--BorderColor);
5577
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-success__status-icon--Color);
5169
+ .pf-v6-c-divider.pf-m-inset-xs {
5170
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5578
5171
  }
5579
5172
 
5580
- .pf-v6-c-menu-toggle.pf-m-warning {
5581
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-warning--BorderColor);
5582
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-warning__status-icon--Color);
5173
+ .pf-v6-c-divider.pf-m-inset-sm {
5174
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5583
5175
  }
5584
5176
 
5585
- .pf-v6-c-menu-toggle.pf-m-danger {
5586
- --pf-v6-c-menu-toggle--BorderColor: var(--pf-v6-c-menu-toggle--m-danger--BorderColor);
5587
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--m-danger__status-icon--Color);
5177
+ .pf-v6-c-divider.pf-m-inset-md {
5178
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5588
5179
  }
5589
5180
 
5590
- @media screen and (prefers-reduced-motion: no-preference) {
5591
- .pf-v6-c-menu-toggle.pf-m-danger {
5592
- transform: translateX(var(--pf-v6-c-menu-toggle--m-danger--TranslateX, 0));
5593
- animation-name: pf-v6-c-menu-toggle-m-danger-motion;
5594
- animation-duration: var(--pf-v6-c-menu-toggle--m-danger--AnimationDuration--Transform);
5595
- animation-timing-function: var(--pf-v6-c-menu-toggle--m-danger--AnimationTimingFunction--Transform);
5596
- animation-fill-mode: both;
5597
- }
5598
- }
5599
- .pf-v6-c-menu-toggle.pf-m-danger .pf-v6-c-menu-toggle__status-icon {
5600
- animation-name: pf-v6-c-menu-toggle-status-icon-fade-in;
5601
- animation-duration: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionDuration--Opacity);
5602
- animation-timing-function: var(--pf-v6-c-menu-toggle__status-icon--m-danger--TransitionTimingFunction--Opacity);
5181
+ .pf-v6-c-divider.pf-m-inset-lg {
5182
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5603
5183
  }
5604
5184
 
5605
- @keyframes pf-v6-c-menu-toggle-status-icon-fade-in {
5606
- from {
5607
- opacity: 0;
5608
- }
5609
- to {
5610
- opacity: 1;
5611
- }
5612
- }
5613
- .pf-v6-c-menu-toggle.pf-m-placeholder {
5614
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--m-placeholder--Color);
5185
+ .pf-v6-c-divider.pf-m-inset-xl {
5186
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5615
5187
  }
5616
5188
 
5617
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) {
5618
- --pf-v6-c-menu-toggle--Color: var(--pf-v6-c-menu-toggle--disabled--Color);
5619
- --pf-v6-c-menu-toggle__icon--Color: var(--pf-v6-c-menu-toggle--disabled__icon--Color);
5620
- --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-v6-c-menu-toggle--disabled__toggle-icon--Color);
5621
- --pf-v6-c-menu-toggle__status-icon--Color: var(--pf-v6-c-menu-toggle--disabled__status-icon--Color);
5622
- --pf-v6-c-menu-toggle--BackgroundColor: var(--pf-v6-c-menu-toggle--disabled--BackgroundColor);
5189
+ .pf-v6-c-divider.pf-m-inset-2xl {
5190
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5623
5191
  }
5624
5192
 
5625
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled),
5626
- .pf-v6-c-menu-toggle:is(:disabled, .pf-m-disabled) .pf-v6-c-button {
5627
- pointer-events: none;
5193
+ .pf-v6-c-divider.pf-m-inset-3xl {
5194
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5628
5195
  }
5629
5196
 
5630
- @property --pf-v6-c-menu-toggle--m-danger--TranslateX {
5631
- syntax: "<length>";
5632
- inherits: false;
5633
- initial-value: 0;
5634
- }
5635
- @media (prefers-reduced-motion: no-preference) {
5636
- @keyframes pf-v6-c-menu-toggle-m-danger-motion {
5637
- 33% {
5638
- --pf-v6-c-menu-toggle--m-danger--TranslateX: -2px;
5639
- }
5640
- 66% {
5641
- --pf-v6-c-menu-toggle--m-danger--TranslateX: 3px;
5642
- }
5197
+ @media (min-width: 36rem) {
5198
+ .pf-v6-c-divider.pf-m-horizontal-on-sm {
5199
+ flex-direction: row;
5200
+ width: 100%;
5201
+ height: var(--pf-v6-c-divider--Size);
5643
5202
  }
5644
5203
  }
5645
- .pf-v6-c-menu-toggle.pf-m-split-button {
5646
- --pf-v6-c-menu-toggle--Gap: 0;
5647
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--BorderColor);
5648
- padding: 0;
5649
- }
5650
-
5651
- .pf-v6-c-menu-toggle.pf-m-split-button > * {
5652
- position: relative;
5653
- padding-block-start: var(--pf-v6-c-menu-toggle--PaddingBlockStart);
5654
- padding-block-end: var(--pf-v6-c-menu-toggle--PaddingBlockEnd);
5655
- padding-inline-start: var(--pf-v6-c-menu-toggle--PaddingInlineStart);
5656
- padding-inline-end: var(--pf-v6-c-menu-toggle--PaddingInlineEnd);
5657
- }
5658
-
5659
- .pf-v6-c-menu-toggle.pf-m-split-button > :first-child {
5660
- border-start-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5661
- border-end-start-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5204
+ @media (min-width: 36rem) {
5205
+ .pf-v6-c-divider.pf-m-vertical-on-sm {
5206
+ flex-direction: column;
5207
+ width: var(--pf-v6-c-divider--Size);
5208
+ height: inherit;
5209
+ }
5662
5210
  }
5663
-
5664
- .pf-v6-c-menu-toggle.pf-m-split-button > :last-child {
5665
- border-start-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5666
- border-end-end-radius: var(--pf-v6-c-menu-toggle--BorderRadius);
5211
+ @media (min-width: 36rem) {
5212
+ .pf-v6-c-divider.pf-m-inset-none-on-sm {
5213
+ --pf-v6-c-divider--before--FlexBasis: 100%;
5214
+ }
5215
+ .pf-v6-c-divider.pf-m-inset-xs-on-sm {
5216
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5217
+ }
5218
+ .pf-v6-c-divider.pf-m-inset-sm-on-sm {
5219
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5220
+ }
5221
+ .pf-v6-c-divider.pf-m-inset-md-on-sm {
5222
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5223
+ }
5224
+ .pf-v6-c-divider.pf-m-inset-lg-on-sm {
5225
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5226
+ }
5227
+ .pf-v6-c-divider.pf-m-inset-xl-on-sm {
5228
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5229
+ }
5230
+ .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
5231
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5232
+ }
5233
+ .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
5234
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5235
+ }
5667
5236
  }
5668
-
5669
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check {
5670
- --pf-v6-c-check__label--Color: currentcolor;
5671
- --pf-v6-c-check__label--disabled--Color: currentcolor;
5672
- align-items: center;
5673
- align-self: stretch;
5237
+ @media (min-width: 48rem) {
5238
+ .pf-v6-c-divider.pf-m-horizontal-on-md {
5239
+ flex-direction: row;
5240
+ width: 100%;
5241
+ height: var(--pf-v6-c-divider--Size);
5242
+ }
5674
5243
  }
5675
-
5676
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check .pf-v6-c-check__input {
5677
- --pf-v6-c-check__input--TranslateY: 0;
5678
- align-self: center;
5244
+ @media (min-width: 48rem) {
5245
+ .pf-v6-c-divider.pf-m-vertical-on-md {
5246
+ flex-direction: column;
5247
+ width: var(--pf-v6-c-divider--Size);
5248
+ height: inherit;
5249
+ }
5679
5250
  }
5680
-
5681
- .pf-v6-c-menu-toggle.pf-m-split-button > :not(:first-child) {
5682
- border-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartWidth) solid var(--pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor);
5251
+ @media (min-width: 48rem) {
5252
+ .pf-v6-c-divider.pf-m-inset-none-on-md {
5253
+ --pf-v6-c-divider--before--FlexBasis: 100%;
5254
+ }
5255
+ .pf-v6-c-divider.pf-m-inset-xs-on-md {
5256
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5257
+ }
5258
+ .pf-v6-c-divider.pf-m-inset-sm-on-md {
5259
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5260
+ }
5261
+ .pf-v6-c-divider.pf-m-inset-md-on-md {
5262
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5263
+ }
5264
+ .pf-v6-c-divider.pf-m-inset-lg-on-md {
5265
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5266
+ }
5267
+ .pf-v6-c-divider.pf-m-inset-xl-on-md {
5268
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5269
+ }
5270
+ .pf-v6-c-divider.pf-m-inset-2xl-on-md {
5271
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5272
+ }
5273
+ .pf-v6-c-divider.pf-m-inset-3xl-on-md {
5274
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5275
+ }
5683
5276
  }
5684
-
5685
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary {
5686
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BorderInlineStartColor);
5277
+ @media (min-width: 62rem) {
5278
+ .pf-v6-c-divider.pf-m-horizontal-on-lg {
5279
+ flex-direction: row;
5280
+ width: 100%;
5281
+ height: var(--pf-v6-c-divider--Size);
5282
+ }
5687
5283
  }
5688
-
5689
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button,
5690
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check {
5691
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor);
5284
+ @media (min-width: 62rem) {
5285
+ .pf-v6-c-divider.pf-m-vertical-on-lg {
5286
+ flex-direction: column;
5287
+ width: var(--pf-v6-c-divider--Size);
5288
+ height: inherit;
5289
+ }
5692
5290
  }
5693
-
5694
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-menu-toggle__button:is(:hover, :focus),
5695
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary > .pf-v6-c-check:is(:hover, :focus) {
5696
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--child--hover--BackgroundColor);
5697
- }
5698
-
5699
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary.pf-m-expanded {
5700
- --pf-v6-c-menu-toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-v6-c-menu-toggle--m-split-button--m-primary--expanded--child--BackgroundColor);
5701
- }
5702
-
5703
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary {
5704
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--m-secondary--child--BorderInlineStartColor);
5705
- }
5706
-
5707
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
5708
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):first-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):first-child,
5709
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):first-child {
5710
- padding-inline-end: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineEnd--offset);
5711
- }
5712
-
5713
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
5714
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-primary .pf-v6-c-check:not(.pf-m-standalone):last-child, .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-menu-toggle__button:not(:has(.pf-v6-c-menu-toggle__controls:only-child)):last-child,
5715
- .pf-v6-c-menu-toggle.pf-m-split-button.pf-m-secondary .pf-v6-c-check:not(.pf-m-standalone):last-child {
5716
- padding-inline-start: var(--pf-v6-c-menu-toggle--m-split-button--pill--child--PaddingInlineStart--offset);
5717
- }
5718
-
5719
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) {
5720
- --pf-v6-c-menu-toggle--m-split-button--child--BorderInlineStartColor: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BorderInlineStartColor);
5721
- }
5722
-
5723
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-menu-toggle__button,
5724
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled) > .pf-v6-c-check {
5725
- color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--Color);
5726
- background-color: var(--pf-v6-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
5727
- }
5728
-
5729
- .pf-v6-c-menu-toggle.pf-m-split-button:is(.pf-m-disabled, :disabled)::before {
5730
- content: none;
5731
- }
5732
-
5733
- .pf-v6-c-menu-toggle.pf-m-typeahead {
5734
- --pf-v6-c-menu-toggle__button--AlignSelf: var(--pf-v6-c-menu-toggle--m-typeahead__button--AlignSelf);
5735
- --pf-v6-c-menu-toggle--Gap: 0;
5736
- align-items: stretch;
5737
- padding: 0;
5738
- }
5739
-
5740
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__button {
5741
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
5742
- }
5743
-
5744
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-menu-toggle__controls {
5745
- --pf-v6-c-menu-toggle__button--PaddingInlineEnd: 0;
5746
- display: flex;
5747
- align-items: stretch;
5748
- }
5749
-
5750
- .pf-v6-c-menu-toggle.pf-m-typeahead .pf-v6-c-text-input-group {
5751
- --pf-v6-c-text-input-group__utilities--MarginInlineEnd: 0;
5752
- flex: 1;
5753
- }
5754
-
5755
- .pf-v6-c-menu-toggle__button {
5756
- gap: var(--pf-v6-c-menu-toggle__button--Gap);
5757
- align-self: var(--pf-v6-c-menu-toggle__button--AlignSelf);
5758
- min-width: var(--pf-v6-c-menu-toggle__button--MinWidth);
5759
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--PaddingInlineStart);
5760
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--PaddingInlineEnd);
5761
- color: inherit;
5762
- background-color: var(--pf-v6-c-menu-toggle__button--BackgroundColor);
5763
- border: 0;
5764
- }
5765
-
5766
- .pf-v6-c-menu-toggle__button.pf-m-text {
5767
- display: inline-flex;
5768
- align-items: baseline;
5769
- }
5770
-
5771
- .pf-v6-c-menu-toggle.pf-m-split-button > .pf-v6-c-check.pf-m-standalone, .pf-v6-c-menu-toggle__button:has(> .pf-v6-c-menu-toggle__controls:only-child) {
5772
- padding-inline-start: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineStart);
5773
- padding-inline-end: var(--pf-v6-c-menu-toggle__button--toggle-icon--PaddingInlineEnd);
5774
- }
5775
-
5776
- .pf-v6-c-menu-toggle__text {
5777
- overflow: hidden;
5778
- text-overflow: ellipsis;
5779
- white-space: nowrap;
5780
- min-width: 0;
5781
- }
5782
-
5783
- .pf-v6-c-menu-toggle__count {
5784
- display: flex;
5785
- flex-wrap: nowrap;
5291
+ @media (min-width: 62rem) {
5292
+ .pf-v6-c-divider.pf-m-inset-none-on-lg {
5293
+ --pf-v6-c-divider--before--FlexBasis: 100%;
5294
+ }
5295
+ .pf-v6-c-divider.pf-m-inset-xs-on-lg {
5296
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5297
+ }
5298
+ .pf-v6-c-divider.pf-m-inset-sm-on-lg {
5299
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5300
+ }
5301
+ .pf-v6-c-divider.pf-m-inset-md-on-lg {
5302
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5303
+ }
5304
+ .pf-v6-c-divider.pf-m-inset-lg-on-lg {
5305
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5306
+ }
5307
+ .pf-v6-c-divider.pf-m-inset-xl-on-lg {
5308
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5309
+ }
5310
+ .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
5311
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5312
+ }
5313
+ .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
5314
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5315
+ }
5786
5316
  }
5787
-
5788
- .pf-v6-c-menu-toggle__icon.pf-m-avatar .pf-v6-c-avatar,
5789
- .pf-v6-c-menu-toggle__icon.pf-m-avatar img,
5790
- .pf-v6-c-menu-toggle__icon.pf-m-avatar svg, .pf-v6-c-menu-toggle:not(.pf-m-plain) .pf-v6-c-menu-toggle__icon {
5791
- margin-block-start: calc(var(--pf-v6-c-menu-toggle--PaddingBlockStart) * -1);
5792
- margin-block-end: calc(var(--pf-v6-c-menu-toggle--PaddingBlockEnd) * -1);
5317
+ @media (min-width: 75rem) {
5318
+ .pf-v6-c-divider.pf-m-horizontal-on-xl {
5319
+ flex-direction: row;
5320
+ width: 100%;
5321
+ height: var(--pf-v6-c-divider--Size);
5322
+ }
5793
5323
  }
5794
-
5795
- .pf-v6-c-menu-toggle__icon {
5796
- flex-shrink: 0;
5324
+ @media (min-width: 75rem) {
5325
+ .pf-v6-c-divider.pf-m-vertical-on-xl {
5326
+ flex-direction: column;
5327
+ width: var(--pf-v6-c-divider--Size);
5328
+ height: inherit;
5329
+ }
5797
5330
  }
5798
-
5799
- .pf-v6-c-menu-toggle__icon :where(picture, img) {
5800
- vertical-align: middle;
5331
+ @media (min-width: 75rem) {
5332
+ .pf-v6-c-divider.pf-m-inset-none-on-xl {
5333
+ --pf-v6-c-divider--before--FlexBasis: 100%;
5334
+ }
5335
+ .pf-v6-c-divider.pf-m-inset-xs-on-xl {
5336
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5337
+ }
5338
+ .pf-v6-c-divider.pf-m-inset-sm-on-xl {
5339
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5340
+ }
5341
+ .pf-v6-c-divider.pf-m-inset-md-on-xl {
5342
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5343
+ }
5344
+ .pf-v6-c-divider.pf-m-inset-lg-on-xl {
5345
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5346
+ }
5347
+ .pf-v6-c-divider.pf-m-inset-xl-on-xl {
5348
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5349
+ }
5350
+ .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
5351
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5352
+ }
5353
+ .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
5354
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5355
+ }
5801
5356
  }
5802
-
5803
- .pf-v6-c-menu-toggle__controls {
5804
- display: flex;
5805
- gap: var(--pf-v6-c-menu-toggle__controls--Gap);
5806
- align-items: center;
5807
- justify-content: center;
5808
- margin-inline-start: auto;
5357
+ @media (min-width: 90.625rem) {
5358
+ .pf-v6-c-divider.pf-m-horizontal-on-2xl {
5359
+ flex-direction: row;
5360
+ width: 100%;
5361
+ height: var(--pf-v6-c-divider--Size);
5362
+ }
5809
5363
  }
5810
-
5811
- .pf-v6-c-menu-toggle__toggle-icon {
5812
- min-height: var(--pf-v6-c-menu-toggle__toggle-icon--MinHeight);
5813
- color: var(--pf-v6-c-menu-toggle__toggle-icon--Color, inherit);
5364
+ @media (min-width: 90.625rem) {
5365
+ .pf-v6-c-divider.pf-m-vertical-on-2xl {
5366
+ flex-direction: column;
5367
+ width: var(--pf-v6-c-divider--Size);
5368
+ height: inherit;
5369
+ }
5814
5370
  }
5815
-
5816
- .pf-v6-c-menu-toggle__status-icon {
5817
- color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
5371
+ @media (min-width: 90.625rem) {
5372
+ .pf-v6-c-divider.pf-m-inset-none-on-2xl {
5373
+ --pf-v6-c-divider--before--FlexBasis: 100%;
5374
+ }
5375
+ .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
5376
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
5377
+ }
5378
+ .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
5379
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
5380
+ }
5381
+ .pf-v6-c-divider.pf-m-inset-md-on-2xl {
5382
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
5383
+ }
5384
+ .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
5385
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
5386
+ }
5387
+ .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
5388
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
5389
+ }
5390
+ .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
5391
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
5392
+ }
5393
+ .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
5394
+ --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
5395
+ }
5818
5396
  }
5819
-
5820
5397
  .pf-v6-c-action-list {
5821
5398
  --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
5822
5399
  --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal--default);
@@ -5849,226 +5426,6 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
5849
5426
  column-gap: var(--pf-v6-c-action-list--m-icons--ColumnGap);
5850
5427
  }
5851
5428
 
5852
- .pf-v6-c-popover {
5853
- --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
5854
- --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
5855
- --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
5856
- --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
5857
- --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
5858
- --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5859
- --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
5860
- --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
5861
- --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
5862
- --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
5863
- --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5864
- --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
5865
- --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
5866
- --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
5867
- --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
5868
- --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
5869
- --pf-v6-c-popover__arrow--Width: 0.9375rem;
5870
- --pf-v6-c-popover__arrow--Height: 0.9375rem;
5871
- --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
5872
- --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
5873
- --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
5874
- --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
5875
- --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
5876
- --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
5877
- --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
5878
- --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
5879
- --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
5880
- --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
5881
- --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
5882
- --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
5883
- --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
5884
- --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
5885
- --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
5886
- --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
5887
- --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
5888
- --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
5889
- --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
5890
- --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
5891
- --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
5892
- --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
5893
- --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
5894
- --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
5895
- --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
5896
- --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
5897
- --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
5898
- --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
5899
- --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
5900
- }
5901
-
5902
- .pf-v6-c-popover {
5903
- position: relative;
5904
- min-width: var(--pf-v6-c-popover--MinWidth);
5905
- max-width: var(--pf-v6-c-popover--MaxWidth);
5906
- font-size: var(--pf-v6-c-popover--FontSize);
5907
- border-radius: var(--pf-v6-c-popover--BorderRadius);
5908
- box-shadow: var(--pf-v6-c-popover--BoxShadow);
5909
- }
5910
-
5911
- .pf-v6-c-popover.pf-m-no-padding {
5912
- --pf-v6-c-popover__content--PaddingBlockStart: 0px;
5913
- --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
5914
- --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
5915
- --pf-v6-c-popover__content--PaddingInlineStart: 0px;
5916
- }
5917
-
5918
- .pf-v6-c-popover.pf-m-width-auto {
5919
- --pf-v6-c-popover--MinWidth: auto;
5920
- --pf-v6-c-popover--MaxWidth: none;
5921
- }
5922
-
5923
- .pf-v6-c-popover:is(.pf-m-top,
5924
- .pf-m-top-left,
5925
- .pf-m-top-right) {
5926
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
5927
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
5928
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
5929
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
5930
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
5931
- }
5932
-
5933
- .pf-v6-c-popover:is(.pf-m-bottom,
5934
- .pf-m-bottom-left,
5935
- .pf-m-bottom-right) {
5936
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
5937
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
5938
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
5939
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
5940
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
5941
- }
5942
-
5943
- .pf-v6-c-popover:is(.pf-m-left,
5944
- .pf-m-left-top,
5945
- .pf-m-left-bottom) {
5946
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
5947
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
5948
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
5949
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
5950
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
5951
- }
5952
-
5953
- .pf-v6-c-popover:is(.pf-m-right,
5954
- .pf-m-right-top,
5955
- .pf-m-right-bottom) {
5956
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
5957
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
5958
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
5959
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
5960
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
5961
- }
5962
-
5963
- .pf-v6-c-popover:is(.pf-m-left-top,
5964
- .pf-m-right-top) {
5965
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
5966
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
5967
- }
5968
-
5969
- .pf-v6-c-popover:is(.pf-m-left-bottom,
5970
- .pf-m-right-bottom) {
5971
- --pf-v6-c-popover__arrow--InsetBlockStart: auto;
5972
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
5973
- }
5974
-
5975
- .pf-v6-c-popover:is(.pf-m-top-left,
5976
- .pf-m-bottom-left) {
5977
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
5978
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
5979
- }
5980
-
5981
- .pf-v6-c-popover:is(.pf-m-top-right,
5982
- .pf-m-bottom-right) {
5983
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
5984
- --pf-v6-c-popover__arrow--InsetInlineStart: auto;
5985
- }
5986
-
5987
- .pf-v6-c-popover.pf-m-danger {
5988
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
5989
- }
5990
-
5991
- .pf-v6-c-popover.pf-m-warning {
5992
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
5993
- }
5994
-
5995
- .pf-v6-c-popover.pf-m-success {
5996
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
5997
- }
5998
-
5999
- .pf-v6-c-popover.pf-m-custom {
6000
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
6001
- }
6002
-
6003
- .pf-v6-c-popover.pf-m-info {
6004
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
6005
- }
6006
-
6007
- .pf-v6-c-popover__content {
6008
- position: relative;
6009
- padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
6010
- padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
6011
- padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
6012
- padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6013
- background-color: var(--pf-v6-c-popover__content--BackgroundColor);
6014
- border-radius: var(--pf-v6-c-popover__content--BorderRadius);
6015
- }
6016
-
6017
- .pf-v6-c-popover__close {
6018
- position: absolute;
6019
- inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
6020
- inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
6021
- }
6022
-
6023
- .pf-v6-c-popover__close + * {
6024
- padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
6025
- }
6026
-
6027
- .pf-v6-c-popover__arrow {
6028
- position: absolute;
6029
- top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
6030
- right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
6031
- bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
6032
- left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
6033
- width: var(--pf-v6-c-popover__arrow--Width);
6034
- height: var(--pf-v6-c-popover__arrow--Height);
6035
- pointer-events: none;
6036
- background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
6037
- box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
6038
- 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));
6039
- }
6040
-
6041
- .pf-v6-c-popover__header {
6042
- margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
6043
- }
6044
-
6045
- .pf-v6-c-popover__title {
6046
- display: flex;
6047
- flex: 0 0 auto;
6048
- }
6049
-
6050
- .pf-v6-c-popover__title-icon {
6051
- margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
6052
- font-size: var(--pf-v6-c-popover__title-icon--FontSize);
6053
- color: var(--pf-v6-c-popover__title-icon--Color);
6054
- }
6055
-
6056
- .pf-v6-c-popover__title-text {
6057
- min-width: 0;
6058
- font-size: var(--pf-v6-c-popover__title-text--FontSize);
6059
- font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
6060
- color: var(--pf-v6-c-popover__title-text--Color);
6061
- overflow-wrap: break-word;
6062
- }
6063
-
6064
- .pf-v6-c-popover__body {
6065
- word-wrap: break-word;
6066
- }
6067
-
6068
- .pf-v6-c-popover__footer {
6069
- margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
6070
- }
6071
-
6072
5429
  .pf-v6-c-form-control {
6073
5430
  --pf-v6-c-form-control--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
6074
5431
  --pf-v6-c-form-control--Color: var(--pf-t--global--text--color--regular);
@@ -6180,612 +5537,1255 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
6180
5537
  --pf-v6-c-form-control--m-disabled__toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
6181
5538
  }
6182
5539
 
6183
- .pf-v6-c-form-control {
5540
+ .pf-v6-c-form-control {
5541
+ position: relative;
5542
+ display: grid;
5543
+ grid-template-columns: 1fr auto;
5544
+ column-gap: var(--pf-v6-c-form-control--ColumnGap);
5545
+ align-items: start;
5546
+ width: var(--pf-v6-c-form-control--Width);
5547
+ font-size: var(--pf-v6-c-form-control--FontSize);
5548
+ line-height: var(--pf-v6-c-form-control--LineHeight);
5549
+ resize: var(--pf-v6-c-form-control--Resize);
5550
+ background-color: var(--pf-v6-c-form-control--BackgroundColor);
5551
+ border-radius: var(--pf-v6-c-form-control--BorderRadius);
5552
+ }
5553
+
5554
+ .pf-v6-c-form-control::before, .pf-v6-c-form-control::after {
5555
+ position: absolute;
5556
+ inset: 0;
5557
+ pointer-events: none;
5558
+ content: "";
5559
+ }
5560
+
5561
+ .pf-v6-c-form-control::before {
5562
+ border-color: var(--pf-v6-c-form-control--before--BorderColor);
5563
+ border-style: var(--pf-v6-c-form-control--before--BorderStyle);
5564
+ border-width: var(--pf-v6-c-form-control--before--BorderWidth);
5565
+ border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
5566
+ }
5567
+
5568
+ .pf-v6-c-form-control::after {
5569
+ border: var(--pf-v6-c-form-control--after--BorderWidth) var(--pf-v6-c-form-control--after--BorderStyle) var(--pf-v6-c-form-control--after--BorderColor);
5570
+ border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
5571
+ }
5572
+
5573
+ .pf-v6-c-form-control > :is(input, select, textarea) {
5574
+ grid-row: 1/2;
5575
+ grid-column: 1/-1;
5576
+ padding-block-start: var(--pf-v6-c-form-control--PaddingBlockStart);
5577
+ padding-block-end: var(--pf-v6-c-form-control--PaddingBlockEnd);
5578
+ padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
5579
+ padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
5580
+ color: var(--pf-v6-c-form-control--Color);
5581
+ appearance: none;
5582
+ background-color: transparent;
5583
+ border: none;
5584
+ border-radius: var(--pf-v6-c-form-control--BorderRadius);
5585
+ outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
5586
+ }
5587
+
5588
+ .pf-v6-c-form-control > ::placeholder {
5589
+ color: var(--pf-v6-c-form-control--m-placeholder--Color);
5590
+ }
5591
+
5592
+ .pf-v6-c-form-control > :is(input, select) {
5593
+ text-overflow: ellipsis;
5594
+ }
5595
+
5596
+ .pf-v6-c-form-control:has(input) {
5597
+ --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__input--PaddingBlockStart);
5598
+ --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__input--PaddingBlockEnd);
5599
+ --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__input--PaddingInlineStart);
5600
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control__input--PaddingInlineEnd);
5601
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd);
5602
+ }
5603
+
5604
+ .pf-v6-c-form-control.pf-m-textarea {
5605
+ padding-block-start: var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset);
5606
+ padding-block-end: var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset);
5607
+ padding-inline-start: var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset);
5608
+ padding-inline-end: var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset);
5609
+ }
5610
+
5611
+ .pf-v6-c-form-control.pf-m-textarea.pf-m-success, .pf-v6-c-form-control.pf-m-textarea.pf-m-warning, .pf-v6-c-form-control.pf-m-textarea.pf-m-error {
5612
+ --pf-v6-c-form-control--m-status--PaddingInlineEnd--offset: calc(var(--pf-v6-c-form-control__icon--FontSize) + var(--pf-v6-c-form-control--ColumnGap));
5613
+ }
5614
+
5615
+ .pf-v6-c-form-control.pf-m-textarea:has(textarea) {
5616
+ --pf-v6-c-form-control--PaddingBlockStart: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
5617
+ --pf-v6-c-form-control--PaddingBlockEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockEnd) - var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset));
5618
+ --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineStart) - var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset));
5619
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineEnd) - var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset) + var(--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset, 0px));
5620
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd);
5621
+ }
5622
+
5623
+ .pf-v6-c-form-control.pf-m-textarea > textarea {
5624
+ outline-offset: 0;
5625
+ scrollbar-gutter: stable;
5626
+ }
5627
+
5628
+ .pf-v6-c-form-control.pf-m-textarea .pf-v6-c-form-control__utilities {
5629
+ padding-block-start: var(--pf-v6-c-form-control__utilities--textarea--PaddingBlockStart);
5630
+ }
5631
+
5632
+ .pf-v6-c-form-control.pf-m-readonly {
5633
+ --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
5634
+ --pf-v6-c-form-control--before--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
5635
+ }
5636
+
5637
+ .pf-v6-c-form-control.pf-m-readonly:hover {
5638
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
5639
+ }
5640
+
5641
+ .pf-v6-c-form-control.pf-m-readonly:not(.pf-m-success, .pf-m-warning, .pf-m-error) {
5642
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
5643
+ }
5644
+
5645
+ .pf-v6-c-form-control.pf-m-readonly.pf-m-plain {
5646
+ --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor);
5647
+ --pf-v6-c-form-control--m-readonly--BorderColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BorderColor);
5648
+ --pf-v6-c-form-control--inset--base: var(--pf-v6-c-form-control--m-readonly--m-plain--inset--base);
5649
+ --pf-v6-c-form-control--before--BorderStyle: none;
5650
+ --pf-v6-c-form-control--after--BorderStyle: none;
5651
+ --pf-v6-c-form-control--OutlineOffset: var(--pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset);
5652
+ }
5653
+
5654
+ .pf-v6-c-form-control.pf-m-expanded {
5655
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-expanded--after--BorderColor);
5656
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-expanded--after--BorderWidth);
5657
+ }
5658
+
5659
+ .pf-v6-c-form-control.pf-m-disabled {
5660
+ --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-disabled--BackgroundColor);
5661
+ --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-disabled--Color);
5662
+ --pf-v6-c-form-control--m-placeholder--Color: var(--pf-v6-c-form-control--m-disabled--Color);
5663
+ --pf-v6-c-form-control__toggle-icon--Color: var(--pf-v6-c-form-control--m-disabled__toggle-icon--Color);
5664
+ --pf-v6-c-form-control--before--BorderStyle: none;
5665
+ --pf-v6-c-form-control--after--BorderStyle: none;
5666
+ cursor: not-allowed;
5667
+ }
5668
+
5669
+ .pf-v6-c-form-control.pf-m-error {
5670
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-error--after--BorderColor);
5671
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-error--hover--after--BorderColor);
5672
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
5673
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
5674
+ }
5675
+
5676
+ .pf-v6-c-form-control.pf-m-error > textarea {
5677
+ padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd));
5678
+ }
5679
+
5680
+ .pf-v6-c-form-control.pf-m-error > input {
5681
+ padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-error--PaddingInlineEnd));
5682
+ }
5683
+
5684
+ .pf-v6-c-form-control.pf-m-error > select {
5685
+ padding-inline-end: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-error--PaddingInlineEnd));
5686
+ }
5687
+
5688
+ .pf-v6-c-form-control.pf-m-error.pf-m-icon > :is(input) {
5689
+ padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
5690
+ }
5691
+
5692
+ .pf-v6-c-form-control.pf-m-success {
5693
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-success--after--BorderColor);
5694
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-success--hover--after--BorderColor);
5695
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-success__icon--m-status--Color);
5696
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-success--after--BorderWidth);
5697
+ }
5698
+
5699
+ .pf-v6-c-form-control.pf-m-success > textarea {
5700
+ padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-success--PaddingInlineEnd));
5701
+ }
5702
+
5703
+ .pf-v6-c-form-control.pf-m-success > input {
5704
+ padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-success--PaddingInlineEnd));
5705
+ }
5706
+
5707
+ .pf-v6-c-form-control.pf-m-success > select {
5708
+ padding-inline-end: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-success--PaddingInlineEnd));
5709
+ }
5710
+
5711
+ .pf-v6-c-form-control.pf-m-success.pf-m-icon > :is(input) {
5712
+ padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
5713
+ }
5714
+
5715
+ .pf-v6-c-form-control.pf-m-warning {
5716
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-warning--after--BorderColor);
5717
+ --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-warning--hover--after--BorderColor);
5718
+ --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-warning__icon--m-status--Color);
5719
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-warning--after--BorderWidth);
5720
+ }
5721
+
5722
+ .pf-v6-c-form-control.pf-m-warning > textarea {
5723
+ padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-warning--PaddingInlineEnd));
5724
+ }
5725
+
5726
+ .pf-v6-c-form-control.pf-m-warning > input {
5727
+ padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-warning--PaddingInlineEnd));
5728
+ }
5729
+
5730
+ .pf-v6-c-form-control.pf-m-warning > select {
5731
+ padding-inline-end: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-warning--PaddingInlineEnd));
5732
+ }
5733
+
5734
+ .pf-v6-c-form-control.pf-m-warning.pf-m-icon > :is(input) {
5735
+ padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
5736
+ }
5737
+
5738
+ .pf-v6-c-form-control:hover {
5739
+ --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
5740
+ --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--hover--after--BorderWidth);
5741
+ }
5742
+
5743
+ .pf-v6-c-form-control.pf-m-icon {
5744
+ --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
5745
+ }
5746
+
5747
+ .pf-v6-c-form-control:has(select) {
5748
+ --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__select--PaddingBlockStart);
5749
+ --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__select--PaddingBlockEnd);
5750
+ --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
5751
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) + var(--pf-v6-c-form-control__icon--FontSize));
5752
+ --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
5753
+ background-color: var(--pf-v6-c-form-control--BackgroundColor);
5754
+ }
5755
+
5756
+ .pf-v6-c-form-control:has(select) .pf-v6-c-form-control__utilities {
5757
+ padding-inline-end: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
5758
+ }
5759
+
5760
+ @-moz-document url-prefix() {
5761
+ .pf-v6-c-form-control:has(select) {
5762
+ --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
5763
+ --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
5764
+ }
5765
+ }
5766
+ .pf-v6-c-form-control.pf-m-placeholder > select {
5767
+ --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
5768
+ }
5769
+
5770
+ .pf-v6-c-form-control.pf-m-placeholder > select * {
5771
+ color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
5772
+ }
5773
+
5774
+ .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
5775
+ color: revert;
5776
+ }
5777
+
5778
+ .pf-v6-c-form-control > textarea {
5779
+ width: 100%;
5780
+ height: 100%;
5781
+ vertical-align: bottom;
5782
+ resize: none;
5783
+ }
5784
+
5785
+ .pf-v6-c-form-control.pf-m-resize-vertical {
5786
+ --pf-v6-c-form-control--Resize: vertical;
5787
+ overflow: auto;
5788
+ }
5789
+
5790
+ .pf-v6-c-form-control.pf-m-resize-horizontal {
5791
+ --pf-v6-c-form-control--Resize: horizontal;
5792
+ overflow: auto;
5793
+ }
5794
+
5795
+ .pf-v6-c-form-control.pf-m-resize-both {
5796
+ --pf-v6-c-form-control--Resize: both;
5797
+ overflow: auto;
5798
+ }
5799
+
5800
+ .pf-v6-c-form-control__icon {
5801
+ font-size: var(--pf-v6-c-form-control__icon--FontSize);
5802
+ color: var(--pf-v6-c-form-control__icon--Color);
5803
+ }
5804
+
5805
+ .pf-v6-c-form-control__icon.pf-m-status {
5806
+ --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
5807
+ }
5808
+
5809
+ .pf-v6-c-form-control__toggle-icon {
5810
+ grid-row: 1/2;
5811
+ grid-column: 3;
5812
+ padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
5813
+ padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
5814
+ font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
5815
+ color: var(--pf-v6-c-form-control__toggle-icon--Color);
5816
+ pointer-events: none;
5817
+ }
5818
+
5819
+ .pf-v6-c-form-control__utilities {
5820
+ display: flex;
5821
+ flex-wrap: nowrap;
5822
+ grid-row: 1/2;
5823
+ grid-column: 2;
5824
+ gap: var(--pf-v6-c-form-control__utilities--Gap);
5825
+ padding-block-start: var(--pf-v6-c-form-control__utilities--PaddingBlockStart);
5826
+ padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
5827
+ pointer-events: none;
5828
+ }
5829
+
5830
+ .pf-v6-c-button {
5831
+ --pf-v6-c-button--Display: inline-flex;
5832
+ --pf-v6-c-button--AlignItems: baseline;
5833
+ --pf-v6-c-button--JustifyContent: center;
5834
+ --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
5835
+ --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));
5836
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
5837
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
5838
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
5839
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
5840
+ --pf-v6-c-button--Color: var(--pf-t--global--text--color--regular);
5841
+ --pf-v6-c-button--LineHeight: var(--pf-t--global--font--line-height--body);
5842
+ --pf-v6-c-button--FontWeight: var(--pf-t--global--font--weight--body--default);
5843
+ --pf-v6-c-button--FontSize: var(--pf-t--global--font--size--body--default);
5844
+ --pf-v6-c-button--BackgroundColor: transparent;
5845
+ --pf-v6-c-button--BorderColor: transparent;
5846
+ --pf-v6-c-button--BorderWidth: var(--pf-t--global--border--width--action--default);
5847
+ --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
5848
+ --pf-v6-c-button--TextDecorationLine: none;
5849
+ --pf-v6-c-button--TextDecorationStyle: none;
5850
+ --pf-v6-c-button--TextDecorationColor: currentcolor;
5851
+ --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
5852
+ --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
5853
+ --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
5854
+ --pf-v6-c-button--hover--BackgroundColor: transparent;
5855
+ --pf-v6-c-button--hover--BorderColor: transparent;
5856
+ --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
5857
+ --pf-v6-c-button--hover--TextDecorationLine: none;
5858
+ --pf-v6-c-button--hover--TextDecorationStyle: none;
5859
+ --pf-v6-c-button--hover--TextDecorationColor: currentcolor;
5860
+ --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
5861
+ --pf-v6-c-button--m-clicked--BorderColor: transparent;
5862
+ --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
5863
+ --pf-v6-c-button--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
5864
+ --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
5865
+ --pf-v6-c-button--m-primary__icon--Color: var(--pf-t--global--icon--color--on-brand--default);
5866
+ --pf-v6-c-button--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
5867
+ --pf-v6-c-button--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
5868
+ --pf-v6-c-button--m-primary--hover__icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
5869
+ --pf-v6-c-button--m-primary--m-clicked--Color: var(--pf-t--global--text--color--on-brand--clicked);
5870
+ --pf-v6-c-button--m-primary--m-clicked--BackgroundColor: var(--pf-t--global--color--brand--clicked);
5871
+ --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
5872
+ --pf-v6-c-button--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
5873
+ --pf-v6-c-button--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
5874
+ --pf-v6-c-button--m-secondary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5875
+ --pf-v6-c-button--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--default);
5876
+ --pf-v6-c-button--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5877
+ --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
5878
+ --pf-v6-c-button--m-secondary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5879
+ --pf-v6-c-button--m-secondary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5880
+ --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-t--global--border--color--brand--clicked);
5881
+ --pf-v6-c-button--m-secondary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5882
+ --pf-v6-c-button--m-secondary--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
5883
+ --pf-v6-c-button--m-secondary--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
5884
+ --pf-v6-c-button--m-secondary--m-danger__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
5885
+ --pf-v6-c-button--m-secondary--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
5886
+ --pf-v6-c-button--m-secondary--m-danger--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
5887
+ --pf-v6-c-button--m-secondary--m-danger--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
5888
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
5889
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked--BorderColor: var(--pf-t--global--border--color--status--danger--clicked);
5890
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--danger--clicked);
5891
+ --pf-v6-c-button--m-tertiary--Color: var(--pf-t--global--text--color--brand--default);
5892
+ --pf-v6-c-button--m-tertiary--BorderColor: var(--pf-t--global--border--color--default);
5893
+ --pf-v6-c-button--m-tertiary--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
5894
+ --pf-v6-c-button--m-tertiary__icon--Color: var(--pf-t--global--icon--color--brand--default);
5895
+ --pf-v6-c-button--m-tertiary--hover--Color: var(--pf-t--global--text--color--brand--hover);
5896
+ --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--hover);
5897
+ --pf-v6-c-button--m-tertiary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5898
+ --pf-v6-c-button--m-tertiary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5899
+ --pf-v6-c-button--m-tertiary--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
5900
+ --pf-v6-c-button--m-tertiary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
5901
+ --pf-v6-c-button--m-link--BorderRadius: var(--pf-t--global--border--radius--small);
5902
+ --pf-v6-c-button--m-link--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5903
+ --pf-v6-c-button--m-link--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5904
+ --pf-v6-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
5905
+ --pf-v6-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5906
+ --pf-v6-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
5907
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
5908
+ --pf-v6-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5909
+ --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-t--global--text--color--brand--hover);
5910
+ --pf-v6-c-button--m-link--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
5911
+ --pf-v6-c-button--m-link--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5912
+ --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-t--global--text--color--brand--clicked);
5913
+ --pf-v6-c-button--m-link--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5914
+ --pf-v6-c-button--m-link--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5915
+ --pf-v6-c-button--m-link--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
5916
+ --pf-v6-c-button--m-link--m-danger--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5917
+ --pf-v6-c-button--m-link--m-danger__icon--Color: var(--pf-t--global--text--color--status--danger--default);
5918
+ --pf-v6-c-button--m-link--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
5919
+ --pf-v6-c-button--m-link--m-danger--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5920
+ --pf-v6-c-button--m-link--m-danger--hover__icon--Color: var(--pf-t--global--text--color--status--danger--hover);
5921
+ --pf-v6-c-button--m-link--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
5922
+ --pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5923
+ --pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color: var(--pf-t--global--text--color--status--danger--clicked);
5924
+ --pf-v6-c-button--m-link--m-inline--Display: inline-flex;
5925
+ --pf-v6-c-button--m-link--m-inline--JustifyContent: flex-start;
5926
+ --pf-v6-c-button--m-link--m-inline--FontSize: initial;
5927
+ --pf-v6-c-button--m-link--m-inline--LineHeight: initial;
5928
+ --pf-v6-c-button--m-link--m-inline--FontWeight: initial;
5929
+ --pf-v6-c-button--m-link--m-inline--PaddingBlockStart: 0;
5930
+ --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
5931
+ --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
5932
+ --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
5933
+ --pf-v6-c-button--m-link--m-inline--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
5934
+ --pf-v6-c-button--m-link--m-inline--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
5935
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
5936
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
5937
+ --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
5938
+ --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));
5939
+ --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
5940
+ --pf-v6-c-button--m-link--m-inline--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5941
+ --pf-v6-c-button--span--m-link--m-inline--Display: inline;
5942
+ --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
5943
+ --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--gap--text-to-element--default);
5944
+ --pf-v6-c-button--m-link--m-inline--Color: var(--pf-t--global--text--color--brand--default);
5945
+ --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
5946
+ --pf-v6-c-button--m-link--m-inline--TextDecorationColor: currentcolor;
5947
+ --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
5948
+ --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
5949
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: currentcolor;
5950
+ --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
5951
+ --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
5952
+ --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
5953
+ --pf-v6-c-button--m-plain--Color: var(--pf-t--global--icon--color--regular);
5954
+ --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--text--color--regular);
5955
+ --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
5956
+ --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
5957
+ --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
5958
+ --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
5959
+ --pf-v6-c-button--m-plain--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
5960
+ --pf-v6-c-button--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
5961
+ --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
5962
+ --pf-v6-c-button--m-plain--disabled--BackgroundColor: transparent;
5963
+ --pf-v6-c-button--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5964
+ --pf-v6-c-button--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--compact);
5965
+ --pf-v6-c-button--m-plain--m-no-padding--MinWidth: auto;
5966
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: 0;
5967
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
5968
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: 0;
5969
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: 0;
5970
+ --pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineStart: 0;
5971
+ --pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineEnd: 0;
5972
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-t--global--icon--color--subtle);
5973
+ --pf-v6-c-button--m-plain--m-no-padding--BackgroundColor: transparent;
5974
+ --pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color: var(--pf-t--global--icon--color--regular);
5975
+ --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
5976
+ --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
5977
+ --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
5978
+ --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--small);
5979
+ --pf-v6-c-button--m-control--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
5980
+ --pf-v6-c-button--m-control--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
5981
+ --pf-v6-c-button--m-control--Color: var(--pf-t--global--text--color--regular);
5982
+ --pf-v6-c-button--m-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
5983
+ --pf-v6-c-button--m-control--BorderColor: var(--pf-t--global--border--color--default);
5984
+ --pf-v6-c-button--m-control--BorderWidth: var(--pf-t--global--border--width--control--default);
5985
+ --pf-v6-c-button--m-control__icon--Color: var(--pf-t--global--icon--color--regular);
5986
+ --pf-v6-c-button--m-control--hover--Color: var(--pf-t--global--text--color--regular);
5987
+ --pf-v6-c-button--m-control--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
5988
+ --pf-v6-c-button--m-control--hover--BorderColor: var(--pf-t--global--border--color--hover);
5989
+ --pf-v6-c-button--m-control--hover--BorderWidth: var(--pf-t--global--border--width--control--hover);
5990
+ --pf-v6-c-button--m-control--hover__icon--Color: var(--pf-t--global--icon--color--regular);
5991
+ --pf-v6-c-button--m-control--m-clicked--Color: var(--pf-t--global--text--color--regular);
5992
+ --pf-v6-c-button--m-control--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
5993
+ --pf-v6-c-button--m-control--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
5994
+ --pf-v6-c-button--m-control--m-clicked--BorderWidth: var(--pf-t--global--border--width--control--clicked);
5995
+ --pf-v6-c-button--m-control--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
5996
+ --pf-v6-c-button--m-control--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
5997
+ --pf-v6-c-button--m-control--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
5998
+ --pf-v6-c-button--m-stateful--BorderRadius: var(--pf-t--global--border--radius--small);
5999
+ --pf-v6-c-button--m-stateful--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
6000
+ --pf-v6-c-button--m-stateful--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
6001
+ --pf-v6-c-button--m-stateful--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--compact);
6002
+ --pf-v6-c-button--m-stateful--m-small--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--compact);
6003
+ --pf-v6-c-button--m-read--BackgroundColor: var(--pf-t--global--background--color--control--default);
6004
+ --pf-v6-c-button--m-read--BorderColor: var(--pf-t--global--border--color--default);
6005
+ --pf-v6-c-button--m-read--hover--BackgroundColor: var(--pf-t--global--background--color--control--default);
6006
+ --pf-v6-c-button--m-read--hover--BorderColor: var(--pf-t--global--border--color--hover);
6007
+ --pf-v6-c-button--m-read--m-clicked--BackgroundColor: var(--pf-t--global--background--color--control--default);
6008
+ --pf-v6-c-button--m-read--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
6009
+ --pf-v6-c-button--m-unread--Color: var(--pf-t--global--text--color--status--unread--on-default--default);
6010
+ --pf-v6-c-button--m-unread--BackgroundColor: var(--pf-t--global--color--status--unread--default);
6011
+ --pf-v6-c-button--m-unread__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--default);
6012
+ --pf-v6-c-button--m-unread--hover--Color: var(--pf-t--global--text--color--status--unread--on-default--hover);
6013
+ --pf-v6-c-button--m-unread--hover--BackgroundColor: var(--pf-t--global--color--status--unread--hover);
6014
+ --pf-v6-c-button--m-unread--hover__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--hover);
6015
+ --pf-v6-c-button--m-unread--m-clicked--Color: var(--pf-t--global--text--color--status--unread--on-default--clicked);
6016
+ --pf-v6-c-button--m-unread--m-clicked--BackgroundColor: var(--pf-t--global--color--status--unread--clicked);
6017
+ --pf-v6-c-button--m-unread--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--unread--on-default--clicked);
6018
+ --pf-v6-c-button--m-attention--Color: var(--pf-t--global--text--color--status--unread--on-attention--default);
6019
+ --pf-v6-c-button--m-attention--BackgroundColor: var(--pf-t--global--color--status--unread--attention--default);
6020
+ --pf-v6-c-button--m-attention__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--default);
6021
+ --pf-v6-c-button--m-attention--hover--Color: var(--pf-t--global--text--color--status--unread--on-attention--hover);
6022
+ --pf-v6-c-button--m-attention--hover--BackgroundColor: var(--pf-t--global--color--status--unread--attention--hover);
6023
+ --pf-v6-c-button--m-attention--hover__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--hover);
6024
+ --pf-v6-c-button--m-attention--m-clicked--Color: var(--pf-t--global--text--color--status--unread--on-attention--clicked);
6025
+ --pf-v6-c-button--m-attention--m-clicked--BackgroundColor: var(--pf-t--global--color--status--unread--attention--clicked);
6026
+ --pf-v6-c-button--m-attention--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--unread--on-attention--clicked);
6027
+ --pf-v6-c-button--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
6028
+ --pf-v6-c-button--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
6029
+ --pf-v6-c-button--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
6030
+ --pf-v6-c-button--m-warning--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
6031
+ --pf-v6-c-button--m-warning--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
6032
+ --pf-v6-c-button--m-warning--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
6033
+ --pf-v6-c-button--m-warning--m-clicked--Color: var(--pf-t--global--text--color--status--on-warning--clicked);
6034
+ --pf-v6-c-button--m-warning--m-clicked--BackgroundColor: var(--pf-t--global--color--status--warning--clicked);
6035
+ --pf-v6-c-button--m-warning--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--on-warning--clicked);
6036
+ --pf-v6-c-button--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
6037
+ --pf-v6-c-button--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
6038
+ --pf-v6-c-button--m-danger__icon--Color: var(--pf-t--global--icon--color--status--on-danger--default);
6039
+ --pf-v6-c-button--m-danger--hover--Color: var(--pf-t--global--text--color--status--on-danger--hover);
6040
+ --pf-v6-c-button--m-danger--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
6041
+ --pf-v6-c-button--m-danger--hover__icon--Color: var(--pf-t--global--icon--color--status--on-danger--hover);
6042
+ --pf-v6-c-button--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--on-danger--clicked);
6043
+ --pf-v6-c-button--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--color--status--danger--clicked);
6044
+ --pf-v6-c-button--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--on-danger--clicked);
6045
+ --pf-v6-c-button--m-display-lg--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--spacious);
6046
+ --pf-v6-c-button--m-display-lg--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--spacious);
6047
+ --pf-v6-c-button--m-display-lg--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--spacious);
6048
+ --pf-v6-c-button--m-display-lg--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--spacious);
6049
+ --pf-v6-c-button--m-display-lg--FontWeight: var(--pf-t--global--font--weight--body--bold);
6050
+ --pf-v6-c-button--m-link--m-display-lg--FontSize: var(--pf-t--global--font--size--body--lg);
6051
+ --pf-v6-c-button--m-small--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--compact);
6052
+ --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--compact);
6053
+ --pf-v6-c-button--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--compact);
6054
+ --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--compact);
6055
+ --pf-v6-c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
6056
+ --pf-v6-c-button--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
6057
+ --pf-v6-c-button--disabled--TextDecorationColor: currentcolor;
6058
+ --pf-v6-c-button--disabled--BorderColor: transparent;
6059
+ --pf-v6-c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
6060
+ --pf-v6-c-button__icon--Color: var(--pf-t--global--icon--color--regular);
6061
+ --pf-v6-c-button--hover__icon--Color: var(--pf-t--global--icon--color--regular);
6062
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
6063
+ --pf-v6-c-button__icon--MarginInlineStart: 0;
6064
+ --pf-v6-c-button__icon--MarginInlineEnd: 0;
6065
+ --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
6066
+ --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
6067
+ --pf-v6-c-button--m-notify__icon--AnimationDuration--notify: var(--pf-t--global--motion--duration--3xl);
6068
+ --pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify: var(--pf-t--global--motion--timing-function--default);
6069
+ --pf-v6-c-button--m-favorite__icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
6070
+ --pf-v6-c-button--m-favorite__icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
6071
+ --pf-v6-c-button--m-favorited__icon--Color: var(--pf-t--global--color--favorite--default);
6072
+ --pf-v6-c-button--m-favorited--hover__icon--Color: var(--pf-t--global--color--favorite--hover);
6073
+ --pf-v6-c-button--m-favorited__icon--AnimationDuration: var(--pf-t--global--motion--duration--icon--long);
6074
+ --pf-v6-c-button--m-favorited__icon--AnimationTimingFunction: var(--pf-t--global--motion--timing-function--default);
6075
+ --pf-v6-c-button__icon--favorite--Opacity: 1;
6076
+ --pf-v6-c-button__icon--favorited--Opacity: 0;
6077
+ --pf-v6-c-button--m-favorited__icon--favorite--Opacity: 0;
6078
+ --pf-v6-c-button--m-favorited__icon--favorited--Opacity: 1;
6079
+ --pf-v6-c-button__icon--favorite--TransitionDuration: var(--pf-t--global--motion--duration--icon--default);
6080
+ --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
6081
+ --pf-v6-c-button__progress--Opacity: 0;
6082
+ --pf-v6-c-button__progress--TranslateY: -50%;
6083
+ --pf-v6-c-button__progress--TranslateX: 0;
6084
+ --pf-v6-c-button__progress--InsetBlockStart: 50%;
6085
+ --pf-v6-c-button__progress--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
6086
+ --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
6087
+ --pf-v6-c-button--m-progress--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
6088
+ --pf-v6-c-button--m-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
6089
+ --pf-v6-c-button--m-in-progress--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
6090
+ --pf-v6-c-button--m-in-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width));
6091
+ --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
6092
+ --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
6093
+ --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
6094
+ --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
6095
+ --pf-v6-c-button--m-block--Display: flex;
6096
+ --pf-v6-c-button--m-block--Width: 100%;
6097
+ }
6098
+
6099
+ .pf-v6-c-button {
6184
6100
  position: relative;
6185
- display: grid;
6186
- grid-template-columns: 1fr auto;
6187
- column-gap: var(--pf-v6-c-form-control--ColumnGap);
6188
- align-items: start;
6189
- width: var(--pf-v6-c-form-control--Width);
6190
- font-size: var(--pf-v6-c-form-control--FontSize);
6191
- line-height: var(--pf-v6-c-form-control--LineHeight);
6192
- resize: var(--pf-v6-c-form-control--Resize);
6193
- background-color: var(--pf-v6-c-form-control--BackgroundColor);
6194
- border-radius: var(--pf-v6-c-form-control--BorderRadius);
6101
+ display: var(--pf-v6-c-button--Display);
6102
+ gap: var(--pf-v6-c-button--Gap);
6103
+ align-items: var(--pf-v6-c-button--AlignItems);
6104
+ justify-content: var(--pf-v6-c-button--JustifyContent);
6105
+ min-width: var(--pf-v6-c-button--MinWidth);
6106
+ padding-block-start: var(--pf-v6-c-button--PaddingBlockStart);
6107
+ padding-block-end: var(--pf-v6-c-button--PaddingBlockEnd);
6108
+ padding-inline-start: var(--pf-v6-c-button--PaddingInlineStart);
6109
+ padding-inline-end: var(--pf-v6-c-button--PaddingInlineEnd);
6110
+ font-size: var(--pf-v6-c-button--FontSize, inherit);
6111
+ font-weight: var(--pf-v6-c-button--FontWeight, inherit);
6112
+ line-height: var(--pf-v6-c-button--LineHeight, inherit);
6113
+ color: var(--pf-v6-c-button--Color);
6114
+ text-align: center;
6115
+ text-decoration-line: var(--pf-v6-c-button--TextDecorationLine);
6116
+ text-decoration-style: var(--pf-v6-c-button--TextDecorationStyle);
6117
+ text-decoration-color: var(--pf-v6-c-button--TextDecorationColor);
6118
+ white-space: nowrap;
6119
+ cursor: pointer;
6120
+ user-select: none;
6121
+ background-color: var(--pf-v6-c-button--BackgroundColor);
6122
+ border: 0;
6123
+ border-start-start-radius: var(--pf-v6-c-button--BorderStartStartRadius, var(--pf-v6-c-button--BorderRadius));
6124
+ border-start-end-radius: var(--pf-v6-c-button--BorderStartEndRadius, var(--pf-v6-c-button--BorderRadius));
6125
+ border-end-start-radius: var(--pf-v6-c-button--BorderEndStartRadius, var(--pf-v6-c-button--BorderRadius));
6126
+ border-end-end-radius: var(--pf-v6-c-button--BorderEndEndRadius, var(--pf-v6-c-button--BorderRadius));
6127
+ transition-timing-function: var(--pf-v6-c-button--TransitionTimingFunction);
6128
+ transition-duration: var(--pf-v6-c-button--TransitionDuration);
6129
+ transition-property: var(--pf-v6-c-button--TransitionProperty);
6195
6130
  }
6196
6131
 
6197
- .pf-v6-c-form-control::before, .pf-v6-c-form-control::after {
6132
+ .pf-v6-c-button::after {
6198
6133
  position: absolute;
6199
6134
  inset: 0;
6200
6135
  pointer-events: none;
6201
6136
  content: "";
6137
+ border: var(--pf-v6-c-button--BorderWidth) solid;
6138
+ border-color: var(--pf-v6-c-button--BorderColor);
6139
+ border-radius: inherit;
6140
+ transition: inherit;
6202
6141
  }
6203
6142
 
6204
- .pf-v6-c-form-control::before {
6205
- border-color: var(--pf-v6-c-form-control--before--BorderColor);
6206
- border-style: var(--pf-v6-c-form-control--before--BorderStyle);
6207
- border-width: var(--pf-v6-c-form-control--before--BorderWidth);
6208
- border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
6209
- }
6210
-
6211
- .pf-v6-c-form-control::after {
6212
- border: var(--pf-v6-c-form-control--after--BorderWidth) var(--pf-v6-c-form-control--after--BorderStyle) var(--pf-v6-c-form-control--after--BorderColor);
6213
- border-radius: var(--pf-v6-c-form-control--before--BorderRadius);
6214
- }
6215
-
6216
- .pf-v6-c-form-control > :is(input, select, textarea) {
6217
- grid-row: 1/2;
6218
- grid-column: 1/-1;
6219
- padding-block-start: var(--pf-v6-c-form-control--PaddingBlockStart);
6220
- padding-block-end: var(--pf-v6-c-form-control--PaddingBlockEnd);
6221
- padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
6222
- padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
6223
- color: var(--pf-v6-c-form-control--Color);
6224
- appearance: none;
6225
- background-color: transparent;
6226
- border: none;
6227
- border-radius: var(--pf-v6-c-form-control--BorderRadius);
6228
- outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
6229
- }
6230
-
6231
- .pf-v6-c-form-control > ::placeholder {
6232
- color: var(--pf-v6-c-form-control--m-placeholder--Color);
6143
+ .pf-v6-c-button.pf-m-primary {
6144
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-primary--Color);
6145
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-primary--BackgroundColor);
6146
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-primary__icon--Color);
6147
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-primary--hover--Color);
6148
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-primary--hover--BackgroundColor);
6149
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-primary--hover__icon--Color);
6150
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-primary--m-clicked--Color);
6151
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-primary--m-clicked--BackgroundColor);
6152
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-primary--m-clicked__icon--Color);
6233
6153
  }
6234
6154
 
6235
- .pf-v6-c-form-control > :is(input, select) {
6236
- text-overflow: ellipsis;
6155
+ .pf-v6-c-button.pf-m-primary .pf-v6-c-badge.pf-m-unread {
6156
+ --pf-v6-c-badge--BorderColor: var(--pf-v6-c-button--m-primary__c-badge--BorderColor);
6237
6157
  }
6238
6158
 
6239
- .pf-v6-c-form-control:has(input) {
6240
- --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__input--PaddingBlockStart);
6241
- --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__input--PaddingBlockEnd);
6242
- --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__input--PaddingInlineStart);
6243
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control__input--PaddingInlineEnd);
6244
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--input--PaddingInlineEnd);
6159
+ .pf-v6-c-button.pf-m-secondary {
6160
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-secondary--Color);
6161
+ --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-secondary--BorderColor);
6162
+ --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-secondary--TransitionDuration);
6163
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-secondary__icon--Color);
6164
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-secondary--hover--Color);
6165
+ --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-secondary--hover--BorderColor);
6166
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-secondary--hover__icon--Color);
6167
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-secondary--m-clicked--Color);
6168
+ --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-secondary--m-clicked--BorderColor);
6169
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-secondary--m-clicked__icon--Color);
6170
+ --pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-secondary--m-danger--Color);
6171
+ --pf-v6-c-button--m-danger__icon--Color: var(--pf-v6-c-button--m-secondary--m-danger__icon--Color);
6172
+ --pf-v6-c-button--m-danger--hover--Color: var(--pf-v6-c-button--m-secondary--m-danger--hover--Color);
6173
+ --pf-v6-c-button--m-danger--hover__icon--Color: var(--pf-v6-c-button--m-secondary--m-danger--hover__icon--Color);
6174
+ --pf-v6-c-button--m-danger--m-clicked--Color: var(--pf-v6-c-button--m-secondary--m-danger--m-clicked--Color);
6175
+ --pf-v6-c-button--m-danger--m-clicked__icon--Color: var(--pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color);
6245
6176
  }
6246
6177
 
6247
- .pf-v6-c-form-control.pf-m-textarea {
6248
- padding-block-start: var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset);
6249
- padding-block-end: var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset);
6250
- padding-inline-start: var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset);
6251
- padding-inline-end: var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset);
6178
+ .pf-v6-c-button.pf-m-secondary.pf-m-danger {
6179
+ --pf-v6-c-button--m-secondary--BorderColor: var(--pf-v6-c-button--m-secondary--m-danger--BorderColor);
6180
+ --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-v6-c-button--m-secondary--m-danger--hover--BorderColor);
6181
+ --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-v6-c-button--m-secondary--m-danger--m-clicked--BorderColor);
6182
+ --pf-v6-c-button--m-danger--BackgroundColor: transparent;
6183
+ --pf-v6-c-button--m-danger--hover--BackgroundColor: transparent;
6184
+ --pf-v6-c-button--m-danger--m-clicked--BackgroundColor: transparent;
6252
6185
  }
6253
6186
 
6254
- .pf-v6-c-form-control.pf-m-textarea.pf-m-success, .pf-v6-c-form-control.pf-m-textarea.pf-m-warning, .pf-v6-c-form-control.pf-m-textarea.pf-m-error {
6255
- --pf-v6-c-form-control--m-status--PaddingInlineEnd--offset: calc(var(--pf-v6-c-form-control__icon--FontSize) + var(--pf-v6-c-form-control--ColumnGap));
6187
+ .pf-v6-c-button.pf-m-tertiary {
6188
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-tertiary--Color);
6189
+ --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-tertiary--BorderColor);
6190
+ --pf-v6-c-button--TransitionDuration: var(--pf-v6-c-button--m-tertiary--TransitionDuration);
6191
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-tertiary__icon--Color);
6192
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-tertiary--hover--Color);
6193
+ --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-tertiary--hover--BorderColor);
6194
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-tertiary--hover__icon--Color);
6195
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-tertiary--m-clicked--Color);
6196
+ --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-tertiary--m-clicked--BorderColor);
6197
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-tertiary--m-clicked__icon--Color);
6256
6198
  }
6257
6199
 
6258
- .pf-v6-c-form-control.pf-m-textarea:has(textarea) {
6259
- --pf-v6-c-form-control--PaddingBlockStart: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockStart) - var(--pf-v6-c-form-control--textarea--PaddingBlockStart--offset));
6260
- --pf-v6-c-form-control--PaddingBlockEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingBlockEnd) - var(--pf-v6-c-form-control--textarea--PaddingBlockEnd--offset));
6261
- --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineStart) - var(--pf-v6-c-form-control--textarea--PaddingInlineStart--offset));
6262
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__textarea--PaddingInlineEnd) - var(--pf-v6-c-form-control--textarea--PaddingInlineEnd--offset) + var(--pf-v6-c-form-control--m-status--PaddingInlineEnd--offset, 0px));
6263
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--textarea--PaddingInlineEnd);
6200
+ .pf-v6-c-button.pf-m-link {
6201
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-link--PaddingInlineEnd);
6202
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-link--PaddingInlineStart);
6203
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-link--Color);
6204
+ --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-link--BorderRadius);
6205
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-link--BackgroundColor);
6206
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-link__icon--Color);
6207
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-link--hover--Color);
6208
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-link--hover--BackgroundColor);
6209
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-link--hover__icon--Color);
6210
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-link--m-clicked--Color);
6211
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-link--m-clicked--BackgroundColor);
6212
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-link--m-clicked__icon--Color);
6213
+ --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-link--m-small--PaddingInlineEnd);
6214
+ --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-small--PaddingInlineStart);
6264
6215
  }
6265
6216
 
6266
- .pf-v6-c-form-control.pf-m-textarea > textarea {
6267
- outline-offset: 0;
6268
- scrollbar-gutter: stable;
6217
+ .pf-v6-c-button.pf-m-link.pf-m-inline {
6218
+ --pf-v6-c-button--Display: var(--pf-v6-c-button--m-link--m-inline--Display);
6219
+ --pf-v6-c-button--JustifyContent: var(--pf-v6-c-button--m-link--m-inline--JustifyContent);
6220
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-link--m-inline--FontSize);
6221
+ --pf-v6-c-button--LineHeight: var(--pf-v6-c-button--m-link--m-inline--LineHeight);
6222
+ --pf-v6-c-button--FontWeight: var(--pf-v6-c-button--m-link--m-inline--FontWeight);
6223
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-link--m-inline--PaddingBlockStart);
6224
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineEnd);
6225
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-link--m-inline--PaddingBlockEnd);
6226
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-inline--PaddingInlineStart);
6227
+ --pf-v6-c-button--BackgroundColor: transparent;
6228
+ --pf-v6-c-button__progress--InsetInlineStart: var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart);
6229
+ --pf-v6-c-button--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--TextDecorationLine);
6230
+ --pf-v6-c-button--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--TextDecorationStyle);
6231
+ --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
6232
+ --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
6233
+ --pf-v6-c-button--hover--BackgroundColor: transparent;
6234
+ --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
6235
+ --pf-v6-c-button--disabled--BackgroundColor: transparent;
6236
+ --pf-v6-c-button--disabled--Color: var(--pf-v6-c-button--m-link--m-inline--disabled--Color);
6237
+ --pf-v6-c-button--disabled__icon--Color: var(--pf-v6-c-button--m-link--m-inline--disabled__icon--Color);
6238
+ --pf-v6-c-button--m-link--Color: var(--pf-v6-c-button--m-link--m-inline--Color);
6239
+ --pf-v6-c-button--m-link__icon--Color: var(--pf-v6-c-button--m-link--m-inline__icon--Color);
6240
+ --pf-v6-c-button--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--TextDecorationColor);
6241
+ --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
6242
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
6243
+ --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
6244
+ text-align: start;
6245
+ white-space: normal;
6246
+ outline-offset: 0.125rem;
6269
6247
  }
6270
6248
 
6271
- .pf-v6-c-form-control.pf-m-textarea .pf-v6-c-form-control__utilities {
6272
- padding-block-start: var(--pf-v6-c-form-control__utilities--textarea--PaddingBlockStart);
6249
+ span.pf-v6-c-button.pf-m-link.pf-m-inline {
6250
+ --pf-v6-c-button--m-link--m-inline--Display: var(--pf-v6-c-button--span--m-link--m-inline--Display);
6251
+ --pf-v6-c-button__icon--m-start--MarginInlineEnd: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd);
6252
+ --pf-v6-c-button__icon--m-end--MarginInlineStart: var(--pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart);
6273
6253
  }
6274
6254
 
6275
- .pf-v6-c-form-control.pf-m-readonly {
6276
- --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--BackgroundColor);
6277
- --pf-v6-c-form-control--before--BorderColor: var(--pf-v6-c-form-control--m-readonly--BorderColor);
6255
+ .pf-v6-c-button.pf-m-link.pf-m-danger {
6256
+ --pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-link--m-danger--Color);
6257
+ --pf-v6-c-button--m-danger--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--BackgroundColor);
6258
+ --pf-v6-c-button--m-danger__icon--Color: var(--pf-v6-c-button--m-link--m-danger__icon--Color);
6259
+ --pf-v6-c-button--m-danger--hover--Color: var(--pf-v6-c-button--m-link--m-danger--hover--Color);
6260
+ --pf-v6-c-button--m-danger--hover--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--hover--BackgroundColor);
6261
+ --pf-v6-c-button--m-danger--hover__icon--Color: var(--pf-v6-c-button--m-link--m-danger--hover__icon--Color);
6262
+ --pf-v6-c-button--m-danger--m-clicked--Color: var(--pf-v6-c-button--m-link--m-danger--m-clicked--Color);
6263
+ --pf-v6-c-button--m-danger--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor);
6264
+ --pf-v6-c-button--m-danger--m-clicked__icon--Color: var(--pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color);
6278
6265
  }
6279
6266
 
6280
- .pf-v6-c-form-control.pf-m-readonly:hover {
6281
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
6267
+ .pf-v6-c-button.pf-m-link.pf-m-display-lg {
6268
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-link--m-display-lg--FontSize);
6282
6269
  }
6283
6270
 
6284
- .pf-v6-c-form-control.pf-m-readonly:not(.pf-m-success, .pf-m-warning, .pf-m-error) {
6285
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-readonly--hover--after--BorderColor);
6271
+ .pf-v6-c-button.pf-m-warning {
6272
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-warning--Color);
6273
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-warning--BackgroundColor);
6274
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-warning__icon--Color);
6275
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-warning--hover--Color);
6276
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-warning--hover--BackgroundColor);
6277
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-warning--hover__icon--Color);
6278
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-warning--m-clicked--Color);
6279
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-warning--m-clicked--BackgroundColor);
6280
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-warning--m-clicked__icon--Color);
6286
6281
  }
6287
6282
 
6288
- .pf-v6-c-form-control.pf-m-readonly.pf-m-plain {
6289
- --pf-v6-c-form-control--m-readonly--BackgroundColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BackgroundColor);
6290
- --pf-v6-c-form-control--m-readonly--BorderColor: var(--pf-v6-c-form-control--m-readonly--m-plain--BorderColor);
6291
- --pf-v6-c-form-control--inset--base: var(--pf-v6-c-form-control--m-readonly--m-plain--inset--base);
6292
- --pf-v6-c-form-control--before--BorderStyle: none;
6293
- --pf-v6-c-form-control--after--BorderStyle: none;
6294
- --pf-v6-c-form-control--OutlineOffset: var(--pf-v6-c-form-control--m-readonly--m-plain--OutlineOffset);
6283
+ .pf-v6-c-button.pf-m-danger {
6284
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-danger--Color);
6285
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-danger--BackgroundColor);
6286
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-danger__icon--Color);
6287
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-danger--hover--Color);
6288
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-danger--hover--BackgroundColor);
6289
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-danger--hover__icon--Color);
6290
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-danger--m-clicked--Color);
6291
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-danger--m-clicked--BackgroundColor);
6292
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-danger--m-clicked__icon--Color);
6295
6293
  }
6296
6294
 
6297
- .pf-v6-c-form-control.pf-m-expanded {
6298
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-expanded--after--BorderColor);
6299
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-expanded--after--BorderWidth);
6295
+ .pf-v6-c-button.pf-m-control {
6296
+ --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-control--BorderRadius);
6297
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-control--PaddingInlineStart);
6298
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-control--PaddingInlineEnd);
6299
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-control--Color);
6300
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-control--BackgroundColor);
6301
+ --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-control--BorderColor);
6302
+ --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-control--BorderWidth);
6303
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-control__icon--Color);
6304
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-control--hover--Color);
6305
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-control--hover--BackgroundColor);
6306
+ --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-control--hover--BorderColor);
6307
+ --pf-v6-c-button--hover--BorderWidth: var(--pf-v6-c-button--m-control--hover--BorderWidth);
6308
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-control--hover__icon--Color);
6309
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-control--m-clicked--Color);
6310
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-control--m-clicked--BackgroundColor);
6311
+ --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-control--m-clicked--BorderColor);
6312
+ --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-v6-c-button--m-control--m-clicked--BorderWidth);
6313
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-control--m-clicked__icon--Color);
6314
+ --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-control--m-small--PaddingInlineEnd);
6315
+ --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-control--m-small--PaddingInlineStart);
6300
6316
  }
6301
6317
 
6302
- .pf-v6-c-form-control.pf-m-disabled {
6303
- --pf-v6-c-form-control--BackgroundColor: var(--pf-v6-c-form-control--m-disabled--BackgroundColor);
6304
- --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-disabled--Color);
6305
- --pf-v6-c-form-control--m-placeholder--Color: var(--pf-v6-c-form-control--m-disabled--Color);
6306
- --pf-v6-c-form-control__toggle-icon--Color: var(--pf-v6-c-form-control--m-disabled__toggle-icon--Color);
6307
- --pf-v6-c-form-control--before--BorderStyle: none;
6308
- --pf-v6-c-form-control--after--BorderStyle: none;
6309
- cursor: not-allowed;
6318
+ .pf-v6-c-button.pf-m-stateful {
6319
+ --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-stateful--BorderRadius);
6320
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-stateful--PaddingInlineStart);
6321
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-stateful--PaddingInlineEnd);
6322
+ --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-stateful--m-small--PaddingInlineEnd);
6323
+ --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-stateful--m-small--PaddingInlineStart);
6310
6324
  }
6311
6325
 
6312
- .pf-v6-c-form-control.pf-m-error {
6313
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-error--after--BorderColor);
6314
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-error--hover--after--BorderColor);
6315
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-error__icon--m-status--Color);
6316
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-error--after--BorderWidth);
6326
+ .pf-v6-c-button.pf-m-read {
6327
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-read--BackgroundColor);
6328
+ --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-read--BorderColor);
6329
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-read--hover--BackgroundColor);
6330
+ --pf-v6-c-button--hover--BorderColor: var(--pf-v6-c-button--m-read--hover--BorderColor);
6331
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-read--m-clicked--BackgroundColor);
6332
+ --pf-v6-c-button--m-clicked--BorderColor: var(--pf-v6-c-button--m-read--m-clicked--BorderColor);
6317
6333
  }
6318
6334
 
6319
- .pf-v6-c-form-control.pf-m-error > textarea {
6320
- padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-error--PaddingInlineEnd));
6335
+ .pf-v6-c-button.pf-m-unread {
6336
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-unread--Color);
6337
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-unread--BackgroundColor);
6338
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-unread__icon--Color);
6339
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-unread--hover--Color);
6340
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-unread--hover--BackgroundColor);
6341
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-unread--hover__icon--Color);
6342
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-unread--m-clicked--Color);
6343
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-unread--m-clicked--BackgroundColor);
6344
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-unread--m-clicked__icon--Color);
6321
6345
  }
6322
6346
 
6323
- .pf-v6-c-form-control.pf-m-error > input {
6324
- padding-inline-end: var(--pf-v6-c-form-control--m-error--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-error--PaddingInlineEnd));
6347
+ .pf-v6-c-button.pf-m-attention {
6348
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-attention--Color);
6349
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-attention--BackgroundColor);
6350
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-attention__icon--Color);
6351
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-attention--hover--Color);
6352
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-attention--hover--BackgroundColor);
6353
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-attention--hover__icon--Color);
6354
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-attention--m-clicked--Color);
6355
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-attention--m-clicked--BackgroundColor);
6356
+ --pf-v6-c-button--m-clicked__icon--Color: var(--pf-v6-c-button--m-attention--m-clicked__icon--Color);
6325
6357
  }
6326
6358
 
6327
- .pf-v6-c-form-control.pf-m-error > select {
6328
- padding-inline-end: var(--pf-v6-c-form-control__select--m-error--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-error--PaddingInlineEnd));
6359
+ .pf-v6-c-button.pf-m-plain {
6360
+ --pf-v6-c-button--BorderRadius: var(--pf-v6-c-button--m-plain--BorderRadius);
6361
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-plain--Color);
6362
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-plain__icon--Color);
6363
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-plain--BackgroundColor);
6364
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--PaddingInlineEnd);
6365
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-plain--PaddingInlineStart);
6366
+ --pf-v6-c-button__progress--Color: var(--pf-v6-c-button--m-in-progress--m-plain--Color);
6367
+ --pf-v6-c-button--hover--Color: var(--pf-v6-c-button--m-plain--hover--Color);
6368
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-plain--hover--BackgroundColor);
6369
+ --pf-v6-c-button--m-clicked--Color: var(--pf-v6-c-button--m-plain--m-clicked--Color);
6370
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-plain--m-clicked--BackgroundColor);
6371
+ --pf-v6-c-button--disabled--Color: var(--pf-v6-c-button--m-plain--disabled--Color);
6372
+ --pf-v6-c-button--disabled__icon--Color: var(--pf-v6-c-button--m-plain--disabled__icon--Color);
6373
+ --pf-v6-c-button--disabled--BackgroundColor: var(--pf-v6-c-button--m-plain--disabled--BackgroundColor);
6374
+ --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineEnd);
6375
+ --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-small--PaddingInlineStart);
6329
6376
  }
6330
6377
 
6331
- .pf-v6-c-form-control.pf-m-error.pf-m-icon > :is(input) {
6332
- padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6378
+ .pf-v6-c-button.pf-m-plain.pf-m-no-padding {
6379
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding__icon--Color);
6380
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--BackgroundColor);
6381
+ --pf-v6-c-button--hover--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor);
6382
+ --pf-v6-c-button--m-clicked--BackgroundColor: var(--pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor);
6383
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart);
6384
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd);
6385
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd);
6386
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart);
6387
+ --pf-v6-c-button--m-small--PaddingInlineEnd: var(--pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineEnd);
6388
+ --pf-v6-c-button--m-small--PaddingInlineStart: var(--pf-v6-c-button--m-plain--m-no-padding--m-small--PaddingInlineStart);
6389
+ min-width: var(--pf-v6-c-button--m-plain--m-no-padding--MinWidth);
6333
6390
  }
6334
6391
 
6335
- .pf-v6-c-form-control.pf-m-success {
6336
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-success--after--BorderColor);
6337
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-success--hover--after--BorderColor);
6338
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-success__icon--m-status--Color);
6339
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-success--after--BorderWidth);
6392
+ .pf-v6-c-button.pf-m-block {
6393
+ --pf-v6-c-button--Display: var(--pf-v6-c-button--m-block--Display);
6394
+ width: var(--pf-v6-c-button--m-block--Width);
6340
6395
  }
6341
6396
 
6342
- .pf-v6-c-form-control.pf-m-success > textarea {
6343
- padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-success--PaddingInlineEnd));
6397
+ .pf-v6-c-button.pf-m-small {
6398
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-small--PaddingBlockStart);
6399
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-small--PaddingInlineEnd);
6400
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-small--PaddingBlockEnd);
6401
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-small--PaddingInlineStart);
6344
6402
  }
6345
6403
 
6346
- .pf-v6-c-form-control.pf-m-success > input {
6347
- padding-inline-end: var(--pf-v6-c-form-control--m-success--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-success--PaddingInlineEnd));
6404
+ .pf-v6-c-button.pf-m-display-lg {
6405
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-button--m-display-lg--PaddingBlockStart);
6406
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-display-lg--PaddingInlineEnd);
6407
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-button--m-display-lg--PaddingBlockEnd);
6408
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-display-lg--PaddingInlineStart);
6409
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-button--m-display-lg--FontSize);
6410
+ }
6411
+
6412
+ .pf-v6-c-button.pf-m-favorite .pf-v6-c-button__icon {
6413
+ display: grid;
6414
+ transition-timing-function: var(--pf-v6-c-button--m-favorite__icon--TransitionTimingFunction);
6415
+ transition-duration: var(--pf-v6-c-button--m-favorite__icon--TransitionDuration);
6416
+ transition-property: color;
6348
6417
  }
6349
6418
 
6350
- .pf-v6-c-form-control.pf-m-success > select {
6351
- padding-inline-end: var(--pf-v6-c-form-control__select--m-success--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-success--PaddingInlineEnd));
6419
+ .pf-v6-c-button.pf-m-favorited {
6420
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-favorited__icon--Color);
6421
+ --pf-v6-c-button--hover__icon--Color: var(--pf-v6-c-button--m-favorited--hover__icon--Color);
6422
+ --pf-v6-c-button__icon--favorite--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorite--Opacity);
6423
+ --pf-v6-c-button__icon--favorited--Opacity: var(--pf-v6-c-button--m-favorited__icon--favorited--Opacity);
6352
6424
  }
6353
6425
 
6354
- .pf-v6-c-form-control.pf-m-success.pf-m-icon > :is(input) {
6355
- padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6426
+ .pf-v6-c-button.pf-m-favorited .pf-v6-c-button__icon {
6427
+ animation-name: pf-v6-c-button-icon-favorited;
6428
+ animation-duration: var(--pf-v6-c-button--m-favorited__icon--AnimationDuration);
6429
+ animation-timing-function: var(--pf-v6-c-button--m-favorited__icon--AnimationTimingFunction);
6356
6430
  }
6357
6431
 
6358
- .pf-v6-c-form-control.pf-m-warning {
6359
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--m-warning--after--BorderColor);
6360
- --pf-v6-c-form-control--hover--after--BorderColor: var(--pf-v6-c-form-control--m-warning--hover--after--BorderColor);
6361
- --pf-v6-c-form-control__icon--m-status--Color: var(--pf-v6-c-form-control--m-warning__icon--m-status--Color);
6362
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--m-warning--after--BorderWidth);
6432
+ .pf-v6-c-button:hover, .pf-v6-c-button:focus {
6433
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--hover--Color);
6434
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--hover--BackgroundColor);
6435
+ --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--hover--BorderColor);
6436
+ --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--hover--BorderWidth);
6437
+ --pf-v6-c-button--m-plain--m-no-padding__icon--Color: var(--pf-v6-c-button--m-plain--m-no-padding--hover__icon--Color);
6438
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--hover__icon--Color);
6439
+ text-decoration-line: var(--pf-v6-c-button--hover--TextDecorationLine);
6440
+ text-decoration-style: var(--pf-v6-c-button--hover--TextDecorationStyle);
6441
+ text-decoration-color: var(--pf-v6-c-button--hover--TextDecorationColor);
6363
6442
  }
6364
6443
 
6365
- .pf-v6-c-form-control.pf-m-warning > textarea {
6366
- padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__textarea--m-warning--PaddingInlineEnd));
6444
+ .pf-v6-c-button.pf-m-clicked {
6445
+ --pf-v6-c-button--Color: var(--pf-v6-c-button--m-clicked--Color);
6446
+ --pf-v6-c-button--BackgroundColor: var(--pf-v6-c-button--m-clicked--BackgroundColor);
6447
+ --pf-v6-c-button--BorderWidth: var(--pf-v6-c-button--m-clicked--BorderWidth);
6448
+ --pf-v6-c-button--BorderColor: var(--pf-v6-c-button--m-clicked--BorderColor);
6449
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-button--m-clicked__icon--Color);
6367
6450
  }
6368
6451
 
6369
- .pf-v6-c-form-control.pf-m-warning > input {
6370
- padding-inline-end: var(--pf-v6-c-form-control--m-warning--PaddingInlineEnd, var(--pf-v6-c-form-control__input--m-warning--PaddingInlineEnd));
6452
+ .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled {
6453
+ pointer-events: none;
6371
6454
  }
6372
6455
 
6373
- .pf-v6-c-form-control.pf-m-warning > select {
6374
- padding-inline-end: var(--pf-v6-c-form-control__select--m-warning--m-status--PaddingInlineEnd, var(--pf-v6-c-form-control__select--m-warning--PaddingInlineEnd));
6456
+ .pf-v6-c-button:disabled, .pf-v6-c-button.pf-m-disabled, .pf-v6-c-button.pf-m-aria-disabled {
6457
+ color: var(--pf-v6-c-button--disabled--Color);
6458
+ text-decoration-color: var(--pf-v6-c-button--disabled--TextDecorationColor);
6459
+ background-color: var(--pf-v6-c-button--disabled--BackgroundColor);
6375
6460
  }
6376
6461
 
6377
- .pf-v6-c-form-control.pf-m-warning.pf-m-icon > :is(input) {
6378
- padding-inline-end: var(--pf-v6-c-form-control--m-icon--icon--PaddingInlineEnd);
6462
+ .pf-v6-c-button:disabled::after, .pf-v6-c-button.pf-m-disabled::after, .pf-v6-c-button.pf-m-aria-disabled::after {
6463
+ border-color: transparent;
6379
6464
  }
6380
6465
 
6381
- .pf-v6-c-form-control:hover {
6382
- --pf-v6-c-form-control--after--BorderColor: var(--pf-v6-c-form-control--hover--after--BorderColor);
6383
- --pf-v6-c-form-control--after--BorderWidth: var(--pf-v6-c-form-control--hover--after--BorderWidth);
6466
+ .pf-v6-c-button:disabled .pf-v6-c-button__icon, .pf-v6-c-button.pf-m-disabled .pf-v6-c-button__icon, .pf-v6-c-button.pf-m-aria-disabled .pf-v6-c-button__icon {
6467
+ color: var(--pf-v6-c-button--disabled__icon--Color);
6384
6468
  }
6385
6469
 
6386
- .pf-v6-c-form-control.pf-m-icon {
6387
- --pf-v6-c-form-control--PaddingInlineEnd: var(--pf-v6-c-form-control--m-icon--PaddingInlineEnd);
6470
+ .pf-v6-c-button.pf-m-aria-disabled {
6471
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-v6-c-button--TextDecorationLine);
6472
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-v6-c-button--TextDecorationStyle);
6473
+ cursor: default;
6388
6474
  }
6389
6475
 
6390
- .pf-v6-c-form-control:has(select) {
6391
- --pf-v6-c-form-control--PaddingBlockStart: var(--pf-v6-c-form-control__select--PaddingBlockStart);
6392
- --pf-v6-c-form-control--PaddingBlockEnd: var(--pf-v6-c-form-control__select--PaddingBlockEnd);
6393
- --pf-v6-c-form-control--PaddingInlineStart: var(--pf-v6-c-form-control__select--PaddingInlineStart);
6394
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) + var(--pf-v6-c-form-control__icon--FontSize));
6395
- --pf-v6-c-form-control__utilities--PaddingInlineEnd: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
6396
- background-color: var(--pf-v6-c-form-control--BackgroundColor);
6476
+ .pf-v6-c-button.pf-m-progress {
6477
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-progress--PaddingInlineEnd);
6478
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-progress--PaddingInlineStart);
6397
6479
  }
6398
6480
 
6399
- .pf-v6-c-form-control:has(select) .pf-v6-c-form-control__utilities {
6400
- padding-inline-end: var(--pf-v6-c-form-control__utilities--select--PaddingInlineEnd);
6481
+ .pf-v6-c-button.pf-m-in-progress {
6482
+ --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: var(--pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart);
6401
6483
  }
6402
6484
 
6403
- @-moz-document url-prefix() {
6404
- .pf-v6-c-form-control:has(select) {
6405
- --pf-v6-c-form-control--PaddingInlineEnd: calc(var(--pf-v6-c-form-control__select--PaddingInlineEnd) - 1px);
6406
- --pf-v6-c-form-control--PaddingInlineStart: calc(var(--pf-v6-c-form-control__select--PaddingInlineStart) - 4px);
6407
- }
6408
- }
6409
- .pf-v6-c-form-control.pf-m-placeholder > select {
6410
- --pf-v6-c-form-control--Color: var(--pf-v6-c-form-control--m-placeholder--Color);
6485
+ .pf-v6-c-button.pf-m-in-progress:not(.pf-m-plain) {
6486
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-button--m-in-progress--PaddingInlineEnd);
6487
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-button--m-in-progress--PaddingInlineStart);
6411
6488
  }
6412
6489
 
6413
- .pf-v6-c-form-control.pf-m-placeholder > select * {
6414
- color: var(--pf-v6-c-form-control--m-placeholder--child--Color);
6490
+ .pf-v6-c-button.pf-m-in-progress.pf-m-plain {
6491
+ --pf-v6-c-button__progress--InsetInlineStart: var(--pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart);
6492
+ --pf-v6-c-button__progress--TranslateX: var(--pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX);
6415
6493
  }
6416
6494
 
6417
- .pf-v6-c-form-control.pf-m-placeholder > select *:disabled {
6418
- color: revert;
6495
+ .pf-v6-c-button.pf-m-in-progress.pf-m-plain > :not(.pf-v6-c-button__progress) {
6496
+ opacity: 0;
6419
6497
  }
6420
6498
 
6421
- .pf-v6-c-form-control > textarea {
6422
- width: 100%;
6423
- height: 100%;
6424
- vertical-align: bottom;
6425
- resize: none;
6499
+ .pf-v6-c-button.pf-m-notify .pf-v6-c-button__icon {
6500
+ animation-name: pf-v6-c-button-icon-notify;
6501
+ animation-duration: var(--pf-v6-c-button--m-notify__icon--AnimationDuration--notify);
6502
+ animation-timing-function: var(--pf-v6-c-button--m-notify__icon--AnimationTimingFunction--notify);
6426
6503
  }
6427
6504
 
6428
- .pf-v6-c-form-control.pf-m-resize-vertical {
6429
- --pf-v6-c-form-control--Resize: vertical;
6430
- overflow: auto;
6505
+ .pf-v6-c-button__icon {
6506
+ margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
6507
+ margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
6508
+ color: var(--pf-v6-c-button__icon--Color);
6431
6509
  }
6432
6510
 
6433
- .pf-v6-c-form-control.pf-m-resize-horizontal {
6434
- --pf-v6-c-form-control--Resize: horizontal;
6435
- overflow: auto;
6511
+ .pf-v6-c-button__icon.pf-m-start {
6512
+ --pf-v6-c-button__icon--MarginInlineEnd: var(--pf-v6-c-button__icon--m-start--MarginInlineEnd);
6436
6513
  }
6437
6514
 
6438
- .pf-v6-c-form-control.pf-m-resize-both {
6439
- --pf-v6-c-form-control--Resize: both;
6440
- overflow: auto;
6515
+ .pf-v6-c-button__icon.pf-m-end {
6516
+ --pf-v6-c-button__icon--MarginInlineStart: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
6441
6517
  }
6442
6518
 
6443
- .pf-v6-c-form-control__icon {
6444
- font-size: var(--pf-v6-c-form-control__icon--FontSize);
6445
- color: var(--pf-v6-c-form-control__icon--Color);
6519
+ .pf-v6-c-button__icon-favorite,
6520
+ .pf-v6-c-button__icon-favorited {
6521
+ grid-area: 1/1/1/1;
6522
+ transition-duration: var(--pf-v6-c-button__icon--favorite--TransitionDuration);
6523
+ transition-property: opacity;
6446
6524
  }
6447
6525
 
6448
- .pf-v6-c-form-control__icon.pf-m-status {
6449
- --pf-v6-c-form-control__icon--Color: var(--pf-v6-c-form-control__icon--m-status--Color);
6526
+ .pf-v6-c-button__icon-favorite {
6527
+ opacity: var(--pf-v6-c-button__icon--favorite--Opacity);
6450
6528
  }
6451
6529
 
6452
- .pf-v6-c-form-control__toggle-icon {
6453
- grid-row: 1/2;
6454
- grid-column: 3;
6455
- padding-inline-start: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineStart);
6456
- padding-inline-end: var(--pf-v6-c-form-control__toggle-icon--PaddingInlineEnd);
6457
- font-size: var(--pf-v6-c-form-control__toggle-icon--FontSize);
6458
- color: var(--pf-v6-c-form-control__toggle-icon--Color);
6459
- pointer-events: none;
6530
+ .pf-v6-c-button__icon-favorited {
6531
+ opacity: var(--pf-v6-c-button__icon--favorited--Opacity);
6460
6532
  }
6461
6533
 
6462
- .pf-v6-c-form-control__utilities {
6463
- display: flex;
6464
- flex-wrap: nowrap;
6465
- grid-row: 1/2;
6466
- grid-column: 2;
6467
- gap: var(--pf-v6-c-form-control__utilities--Gap);
6468
- padding-block-start: var(--pf-v6-c-form-control__utilities--PaddingBlockStart);
6469
- padding-inline-end: var(--pf-v6-c-form-control__utilities--PaddingInlineEnd);
6470
- pointer-events: none;
6534
+ .pf-v6-c-button__progress {
6535
+ position: absolute;
6536
+ inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
6537
+ inset-inline-start: var(--pf-v6-c-button__progress--InsetInlineStart);
6538
+ line-height: 1;
6539
+ color: var(--pf-v6-c-button__progress--Color);
6540
+ transform: translate(var(--pf-v6-c-button__progress--TranslateX), var(--pf-v6-c-button__progress--TranslateY));
6471
6541
  }
6472
6542
 
6473
- .pf-v6-c-divider {
6474
- --pf-v6-c-divider--Display: flex;
6475
- --pf-v6-c-divider--Color: var(--pf-t--global--border--color--default);
6476
- --pf-v6-c-divider--Size: var(--pf-t--global--border--width--divider--default);
6477
- --pf-v6-c-divider--before--FlexBasis: 100%;
6543
+ .pf-v6-c-button__progress .pf-v6-c-spinner {
6544
+ --pf-v6-c-spinner--Color: currentcolor;
6478
6545
  }
6479
6546
 
6480
- .pf-v6-c-divider {
6481
- flex-direction: row;
6482
- width: 100%;
6483
- height: var(--pf-v6-c-divider--Size);
6484
- --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
6485
- --pf-v6-hidden-visible--hidden--Display: none;
6486
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6487
- display: var(--pf-v6-hidden-visible--Display);
6488
- flex-shrink: 0;
6489
- align-items: stretch;
6490
- align-self: stretch;
6491
- justify-content: center;
6492
- border: 0;
6547
+ .pf-v6-c-button__text {
6548
+ text-decoration: inherit;
6493
6549
  }
6494
6550
 
6495
- .pf-v6-c-divider.pf-m-hidden {
6496
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6551
+ .pf-v6-c-button__count {
6552
+ display: inline-flex;
6553
+ align-items: center;
6497
6554
  }
6498
6555
 
6499
- @media screen and (min-width: 36rem) {
6500
- .pf-v6-c-divider.pf-m-hidden-on-sm {
6501
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6502
- }
6503
- .pf-v6-c-divider.pf-m-visible-on-sm {
6504
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6505
- }
6506
- }
6507
- @media screen and (min-width: 48rem) {
6508
- .pf-v6-c-divider.pf-m-hidden-on-md {
6509
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6510
- }
6511
- .pf-v6-c-divider.pf-m-visible-on-md {
6512
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6513
- }
6514
- }
6515
- @media screen and (min-width: 62rem) {
6516
- .pf-v6-c-divider.pf-m-hidden-on-lg {
6517
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6556
+ @keyframes pf-v6-c-button-icon-notify {
6557
+ 33% {
6558
+ transform: rotate(30deg);
6518
6559
  }
6519
- .pf-v6-c-divider.pf-m-visible-on-lg {
6520
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6560
+ 66% {
6561
+ transform: rotate(-60deg);
6521
6562
  }
6522
6563
  }
6523
- @media screen and (min-width: 75rem) {
6524
- .pf-v6-c-divider.pf-m-hidden-on-xl {
6525
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6526
- }
6527
- .pf-v6-c-divider.pf-m-visible-on-xl {
6528
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6564
+ @keyframes pf-v6-c-button-icon-favorited {
6565
+ 50% {
6566
+ transform: scale(1.5);
6529
6567
  }
6530
6568
  }
6531
- @media screen and (min-width: 90.625rem) {
6532
- .pf-v6-c-divider.pf-m-hidden-on-2xl {
6533
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
6534
- }
6535
- .pf-v6-c-divider.pf-m-visible-on-2xl {
6536
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
6537
- }
6569
+ .pf-v6-c-popover {
6570
+ --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
6571
+ --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
6572
+ --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
6573
+ --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
6574
+ --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
6575
+ --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
6576
+ --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
6577
+ --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
6578
+ --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
6579
+ --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
6580
+ --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
6581
+ --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
6582
+ --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
6583
+ --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
6584
+ --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
6585
+ --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
6586
+ --pf-v6-c-popover__arrow--Width: 0.9375rem;
6587
+ --pf-v6-c-popover__arrow--Height: 0.9375rem;
6588
+ --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
6589
+ --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
6590
+ --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
6591
+ --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
6592
+ --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
6593
+ --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
6594
+ --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
6595
+ --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
6596
+ --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
6597
+ --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
6598
+ --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
6599
+ --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
6600
+ --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
6601
+ --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
6602
+ --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
6603
+ --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
6604
+ --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
6605
+ --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
6606
+ --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
6607
+ --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6608
+ --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
6609
+ --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
6610
+ --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
6611
+ --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
6612
+ --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
6613
+ --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
6614
+ --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
6615
+ --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
6616
+ --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
6538
6617
  }
6539
- .pf-v6-c-divider::before {
6540
- flex-basis: var(--pf-v6-c-divider--before--FlexBasis);
6541
- content: "";
6542
- background-color: var(--pf-v6-c-divider--Color);
6618
+
6619
+ .pf-v6-c-popover {
6620
+ position: relative;
6621
+ min-width: var(--pf-v6-c-popover--MinWidth);
6622
+ max-width: var(--pf-v6-c-popover--MaxWidth);
6623
+ font-size: var(--pf-v6-c-popover--FontSize);
6624
+ border-radius: var(--pf-v6-c-popover--BorderRadius);
6625
+ box-shadow: var(--pf-v6-c-popover--BoxShadow);
6543
6626
  }
6544
6627
 
6545
- .pf-v6-c-divider.pf-m-horizontal {
6546
- flex-direction: row;
6547
- width: 100%;
6548
- height: var(--pf-v6-c-divider--Size);
6628
+ .pf-v6-c-popover.pf-m-no-padding {
6629
+ --pf-v6-c-popover__content--PaddingBlockStart: 0px;
6630
+ --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
6631
+ --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
6632
+ --pf-v6-c-popover__content--PaddingInlineStart: 0px;
6549
6633
  }
6550
6634
 
6551
- .pf-v6-c-divider.pf-m-vertical {
6552
- flex-direction: column;
6553
- width: var(--pf-v6-c-divider--Size);
6554
- height: inherit;
6635
+ .pf-v6-c-popover.pf-m-width-auto {
6636
+ --pf-v6-c-popover--MinWidth: auto;
6637
+ --pf-v6-c-popover--MaxWidth: none;
6555
6638
  }
6556
6639
 
6557
- .pf-v6-c-divider.pf-m-inset-none {
6558
- --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
6640
+ .pf-v6-c-popover:is(.pf-m-top,
6641
+ .pf-m-top-left,
6642
+ .pf-m-top-right) {
6643
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
6644
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
6645
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
6646
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6647
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
6559
6648
  }
6560
6649
 
6561
- .pf-v6-c-divider.pf-m-inset-xs {
6562
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
6650
+ .pf-v6-c-popover:is(.pf-m-bottom,
6651
+ .pf-m-bottom-left,
6652
+ .pf-m-bottom-right) {
6653
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
6654
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
6655
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
6656
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
6657
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
6563
6658
  }
6564
6659
 
6565
- .pf-v6-c-divider.pf-m-inset-sm {
6566
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
6660
+ .pf-v6-c-popover:is(.pf-m-left,
6661
+ .pf-m-left-top,
6662
+ .pf-m-left-bottom) {
6663
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
6664
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
6665
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6666
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
6667
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
6567
6668
  }
6568
6669
 
6569
- .pf-v6-c-divider.pf-m-inset-md {
6570
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
6670
+ .pf-v6-c-popover:is(.pf-m-right,
6671
+ .pf-m-right-top,
6672
+ .pf-m-right-bottom) {
6673
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
6674
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
6675
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
6676
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
6677
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
6571
6678
  }
6572
6679
 
6573
- .pf-v6-c-divider.pf-m-inset-lg {
6574
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
6680
+ .pf-v6-c-popover:is(.pf-m-left-top,
6681
+ .pf-m-right-top) {
6682
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
6683
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
6575
6684
  }
6576
6685
 
6577
- .pf-v6-c-divider.pf-m-inset-xl {
6578
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
6686
+ .pf-v6-c-popover:is(.pf-m-left-bottom,
6687
+ .pf-m-right-bottom) {
6688
+ --pf-v6-c-popover__arrow--InsetBlockStart: auto;
6689
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
6579
6690
  }
6580
6691
 
6581
- .pf-v6-c-divider.pf-m-inset-2xl {
6582
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6692
+ .pf-v6-c-popover:is(.pf-m-top-left,
6693
+ .pf-m-bottom-left) {
6694
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
6695
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
6583
6696
  }
6584
6697
 
6585
- .pf-v6-c-divider.pf-m-inset-3xl {
6586
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6698
+ .pf-v6-c-popover:is(.pf-m-top-right,
6699
+ .pf-m-bottom-right) {
6700
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
6701
+ --pf-v6-c-popover__arrow--InsetInlineStart: auto;
6587
6702
  }
6588
6703
 
6589
- @media (min-width: 36rem) {
6590
- .pf-v6-c-divider.pf-m-horizontal-on-sm {
6591
- flex-direction: row;
6592
- width: 100%;
6593
- height: var(--pf-v6-c-divider--Size);
6594
- }
6704
+ .pf-v6-c-popover.pf-m-danger {
6705
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
6595
6706
  }
6596
- @media (min-width: 36rem) {
6597
- .pf-v6-c-divider.pf-m-vertical-on-sm {
6598
- flex-direction: column;
6599
- width: var(--pf-v6-c-divider--Size);
6600
- height: inherit;
6601
- }
6707
+
6708
+ .pf-v6-c-popover.pf-m-warning {
6709
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
6602
6710
  }
6603
- @media (min-width: 36rem) {
6604
- .pf-v6-c-divider.pf-m-inset-none-on-sm {
6605
- --pf-v6-c-divider--before--FlexBasis: 100%;
6606
- }
6607
- .pf-v6-c-divider.pf-m-inset-xs-on-sm {
6608
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
6609
- }
6610
- .pf-v6-c-divider.pf-m-inset-sm-on-sm {
6611
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
6612
- }
6613
- .pf-v6-c-divider.pf-m-inset-md-on-sm {
6614
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
6615
- }
6616
- .pf-v6-c-divider.pf-m-inset-lg-on-sm {
6617
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
6618
- }
6619
- .pf-v6-c-divider.pf-m-inset-xl-on-sm {
6620
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
6621
- }
6622
- .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
6623
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6624
- }
6625
- .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
6626
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6627
- }
6711
+
6712
+ .pf-v6-c-popover.pf-m-success {
6713
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
6628
6714
  }
6629
- @media (min-width: 48rem) {
6630
- .pf-v6-c-divider.pf-m-horizontal-on-md {
6631
- flex-direction: row;
6632
- width: 100%;
6633
- height: var(--pf-v6-c-divider--Size);
6634
- }
6715
+
6716
+ .pf-v6-c-popover.pf-m-custom {
6717
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
6635
6718
  }
6636
- @media (min-width: 48rem) {
6637
- .pf-v6-c-divider.pf-m-vertical-on-md {
6638
- flex-direction: column;
6639
- width: var(--pf-v6-c-divider--Size);
6640
- height: inherit;
6641
- }
6719
+
6720
+ .pf-v6-c-popover.pf-m-info {
6721
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
6642
6722
  }
6643
- @media (min-width: 48rem) {
6644
- .pf-v6-c-divider.pf-m-inset-none-on-md {
6645
- --pf-v6-c-divider--before--FlexBasis: 100%;
6646
- }
6647
- .pf-v6-c-divider.pf-m-inset-xs-on-md {
6648
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
6649
- }
6650
- .pf-v6-c-divider.pf-m-inset-sm-on-md {
6651
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
6652
- }
6653
- .pf-v6-c-divider.pf-m-inset-md-on-md {
6654
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
6655
- }
6656
- .pf-v6-c-divider.pf-m-inset-lg-on-md {
6657
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
6658
- }
6659
- .pf-v6-c-divider.pf-m-inset-xl-on-md {
6660
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
6661
- }
6662
- .pf-v6-c-divider.pf-m-inset-2xl-on-md {
6663
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6664
- }
6665
- .pf-v6-c-divider.pf-m-inset-3xl-on-md {
6666
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6667
- }
6723
+
6724
+ .pf-v6-c-popover__content {
6725
+ position: relative;
6726
+ padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
6727
+ padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
6728
+ padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
6729
+ padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
6730
+ background-color: var(--pf-v6-c-popover__content--BackgroundColor);
6731
+ border-radius: var(--pf-v6-c-popover__content--BorderRadius);
6668
6732
  }
6669
- @media (min-width: 62rem) {
6670
- .pf-v6-c-divider.pf-m-horizontal-on-lg {
6671
- flex-direction: row;
6672
- width: 100%;
6673
- height: var(--pf-v6-c-divider--Size);
6674
- }
6733
+
6734
+ .pf-v6-c-popover__close {
6735
+ position: absolute;
6736
+ inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
6737
+ inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
6675
6738
  }
6676
- @media (min-width: 62rem) {
6677
- .pf-v6-c-divider.pf-m-vertical-on-lg {
6678
- flex-direction: column;
6679
- width: var(--pf-v6-c-divider--Size);
6680
- height: inherit;
6681
- }
6739
+
6740
+ .pf-v6-c-popover__close + * {
6741
+ padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
6682
6742
  }
6683
- @media (min-width: 62rem) {
6684
- .pf-v6-c-divider.pf-m-inset-none-on-lg {
6685
- --pf-v6-c-divider--before--FlexBasis: 100%;
6686
- }
6687
- .pf-v6-c-divider.pf-m-inset-xs-on-lg {
6688
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
6689
- }
6690
- .pf-v6-c-divider.pf-m-inset-sm-on-lg {
6691
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
6692
- }
6693
- .pf-v6-c-divider.pf-m-inset-md-on-lg {
6694
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
6695
- }
6696
- .pf-v6-c-divider.pf-m-inset-lg-on-lg {
6697
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
6698
- }
6699
- .pf-v6-c-divider.pf-m-inset-xl-on-lg {
6700
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
6701
- }
6702
- .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
6703
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6704
- }
6705
- .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
6706
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6707
- }
6743
+
6744
+ .pf-v6-c-popover__arrow {
6745
+ position: absolute;
6746
+ top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
6747
+ right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
6748
+ bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
6749
+ left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
6750
+ width: var(--pf-v6-c-popover__arrow--Width);
6751
+ height: var(--pf-v6-c-popover__arrow--Height);
6752
+ pointer-events: none;
6753
+ background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
6754
+ box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
6755
+ 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));
6708
6756
  }
6709
- @media (min-width: 75rem) {
6710
- .pf-v6-c-divider.pf-m-horizontal-on-xl {
6711
- flex-direction: row;
6712
- width: 100%;
6713
- height: var(--pf-v6-c-divider--Size);
6714
- }
6757
+
6758
+ .pf-v6-c-popover__header {
6759
+ margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
6715
6760
  }
6716
- @media (min-width: 75rem) {
6717
- .pf-v6-c-divider.pf-m-vertical-on-xl {
6718
- flex-direction: column;
6719
- width: var(--pf-v6-c-divider--Size);
6720
- height: inherit;
6721
- }
6761
+
6762
+ .pf-v6-c-popover__title {
6763
+ display: flex;
6764
+ flex: 0 0 auto;
6722
6765
  }
6723
- @media (min-width: 75rem) {
6724
- .pf-v6-c-divider.pf-m-inset-none-on-xl {
6725
- --pf-v6-c-divider--before--FlexBasis: 100%;
6726
- }
6727
- .pf-v6-c-divider.pf-m-inset-xs-on-xl {
6728
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
6729
- }
6730
- .pf-v6-c-divider.pf-m-inset-sm-on-xl {
6731
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
6732
- }
6733
- .pf-v6-c-divider.pf-m-inset-md-on-xl {
6734
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
6735
- }
6736
- .pf-v6-c-divider.pf-m-inset-lg-on-xl {
6737
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
6738
- }
6739
- .pf-v6-c-divider.pf-m-inset-xl-on-xl {
6740
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
6741
- }
6742
- .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
6743
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6744
- }
6745
- .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
6746
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6747
- }
6766
+
6767
+ .pf-v6-c-popover__title-icon {
6768
+ margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
6769
+ font-size: var(--pf-v6-c-popover__title-icon--FontSize);
6770
+ color: var(--pf-v6-c-popover__title-icon--Color);
6748
6771
  }
6749
- @media (min-width: 90.625rem) {
6750
- .pf-v6-c-divider.pf-m-horizontal-on-2xl {
6751
- flex-direction: row;
6752
- width: 100%;
6753
- height: var(--pf-v6-c-divider--Size);
6754
- }
6772
+
6773
+ .pf-v6-c-popover__title-text {
6774
+ min-width: 0;
6775
+ font-size: var(--pf-v6-c-popover__title-text--FontSize);
6776
+ font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
6777
+ color: var(--pf-v6-c-popover__title-text--Color);
6778
+ overflow-wrap: break-word;
6755
6779
  }
6756
- @media (min-width: 90.625rem) {
6757
- .pf-v6-c-divider.pf-m-vertical-on-2xl {
6758
- flex-direction: column;
6759
- width: var(--pf-v6-c-divider--Size);
6760
- height: inherit;
6761
- }
6780
+
6781
+ .pf-v6-c-popover__body {
6782
+ word-wrap: break-word;
6762
6783
  }
6763
- @media (min-width: 90.625rem) {
6764
- .pf-v6-c-divider.pf-m-inset-none-on-2xl {
6765
- --pf-v6-c-divider--before--FlexBasis: 100%;
6766
- }
6767
- .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
6768
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
6769
- }
6770
- .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
6771
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
6772
- }
6773
- .pf-v6-c-divider.pf-m-inset-md-on-2xl {
6774
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
6775
- }
6776
- .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
6777
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
6778
- }
6779
- .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
6780
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
6781
- }
6782
- .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
6783
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
6784
- }
6785
- .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
6786
- --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
6787
- }
6784
+
6785
+ .pf-v6-c-popover__footer {
6786
+ margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
6788
6787
  }
6788
+
6789
6789
  .pf-v6-c-menu {
6790
6790
  --pf-v6-c-menu--RowGap: var(--pf-t--global--spacer--sm);
6791
6791
  --pf-v6-c-menu--Width: auto;
@@ -7548,79 +7548,6 @@ button.pf-v6-c-breadcrumb__link {
7548
7548
  display: none;
7549
7549
  }
7550
7550
 
7551
- .pf-v6-c-badge {
7552
- --pf-v6-c-badge--BorderColor: transparent;
7553
- --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
7554
- --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
7555
- --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
7556
- --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
7557
- --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7558
- --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7559
- --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7560
- --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
7561
- --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
7562
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7563
- --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
7564
- --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7565
- --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7566
- --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
7567
- --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
7568
- --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
7569
- --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
7570
- --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
7571
- --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7572
- }
7573
-
7574
- .pf-v6-c-badge {
7575
- position: relative;
7576
- display: inline-block;
7577
- min-width: var(--pf-v6-c-badge--MinWidth);
7578
- padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
7579
- padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
7580
- font-size: var(--pf-v6-c-badge--FontSize);
7581
- font-weight: var(--pf-v6-c-badge--FontWeight);
7582
- color: var(--pf-v6-c-badge--Color);
7583
- text-align: center;
7584
- white-space: nowrap;
7585
- background-color: var(--pf-v6-c-badge--BackgroundColor);
7586
- border-radius: var(--pf-v6-c-badge--BorderRadius);
7587
- }
7588
-
7589
- .pf-v6-c-badge::after {
7590
- position: absolute;
7591
- inset: 0;
7592
- pointer-events: none;
7593
- content: "";
7594
- border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
7595
- border-radius: inherit;
7596
- }
7597
-
7598
- .pf-v6-c-badge.pf-m-read {
7599
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
7600
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
7601
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
7602
- }
7603
-
7604
- .pf-v6-c-badge.pf-m-unread {
7605
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
7606
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
7607
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
7608
- }
7609
-
7610
- .pf-v6-c-badge.pf-m-disabled {
7611
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
7612
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
7613
- }
7614
-
7615
- .pf-v6-c-badge.pf-m-disabled::after {
7616
- border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
7617
- }
7618
-
7619
- .pf-v6-c-badge__toggle-icon {
7620
- margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
7621
- color: var(--pf-v6-c-badge__toggle-icon--Color);
7622
- }
7623
-
7624
7551
  .pf-v6-c-spinner {
7625
7552
  --pf-v6-c-spinner--diameter: var(--pf-t--global--icon--size--2xl);
7626
7553
  --pf-v6-c-spinner--Width: var(--pf-v6-c-spinner--diameter);
@@ -7701,4 +7628,76 @@ button.pf-v6-c-breadcrumb__link {
7701
7628
  stroke-dashoffset: 280;
7702
7629
  transform: rotate(720deg);
7703
7630
  }
7631
+ }
7632
+ .pf-v6-c-badge {
7633
+ --pf-v6-c-badge--BorderColor: transparent;
7634
+ --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
7635
+ --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
7636
+ --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
7637
+ --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
7638
+ --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7639
+ --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7640
+ --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7641
+ --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
7642
+ --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
7643
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7644
+ --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
7645
+ --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
7646
+ --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
7647
+ --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
7648
+ --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
7649
+ --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
7650
+ --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
7651
+ --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
7652
+ --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7653
+ }
7654
+
7655
+ .pf-v6-c-badge {
7656
+ position: relative;
7657
+ display: inline-block;
7658
+ min-width: var(--pf-v6-c-badge--MinWidth);
7659
+ padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
7660
+ padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
7661
+ font-size: var(--pf-v6-c-badge--FontSize);
7662
+ font-weight: var(--pf-v6-c-badge--FontWeight);
7663
+ color: var(--pf-v6-c-badge--Color);
7664
+ text-align: center;
7665
+ white-space: nowrap;
7666
+ background-color: var(--pf-v6-c-badge--BackgroundColor);
7667
+ border-radius: var(--pf-v6-c-badge--BorderRadius);
7668
+ }
7669
+
7670
+ .pf-v6-c-badge::after {
7671
+ position: absolute;
7672
+ inset: 0;
7673
+ pointer-events: none;
7674
+ content: "";
7675
+ border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
7676
+ border-radius: inherit;
7677
+ }
7678
+
7679
+ .pf-v6-c-badge.pf-m-read {
7680
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
7681
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
7682
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
7683
+ }
7684
+
7685
+ .pf-v6-c-badge.pf-m-unread {
7686
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
7687
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
7688
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
7689
+ }
7690
+
7691
+ .pf-v6-c-badge.pf-m-disabled {
7692
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
7693
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
7694
+ }
7695
+
7696
+ .pf-v6-c-badge.pf-m-disabled::after {
7697
+ border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
7698
+ }
7699
+
7700
+ .pf-v6-c-badge__toggle-icon {
7701
+ margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
7702
+ color: var(--pf-v6-c-badge__toggle-icon--Color);
7704
7703
  }