@patternfly/react-core 4.250.7 → 4.251.0

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.
@@ -3435,89 +3435,6 @@ label.pf-c-check, .pf-c-check__label,
3435
3435
  --pf-c-chip--m-draggable--BackgroundColor: var(--pf-global--palette--black-600);
3436
3436
  }
3437
3437
 
3438
- .pf-c-chip-group {
3439
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
3440
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
3441
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
3442
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
3443
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
3444
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
3445
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
3446
- }
3447
-
3448
- .pf-c-chip-group {
3449
- color: var(--pf-global--Color--100);
3450
- --pf-c-chip-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
3451
- --pf-c-chip-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
3452
- --pf-c-chip-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
3453
- --pf-c-chip-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
3454
- --pf-c-chip-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
3455
- --pf-c-chip-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
3456
- --pf-c-chip-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
3457
- --pf-c-chip-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--200);
3458
- --pf-c-chip-group__label--MarginRight: var(--pf-global--spacer--sm);
3459
- --pf-c-chip-group__label--FontSize: var(--pf-global--FontSize--sm);
3460
- --pf-c-chip-group__label--MaxWidth: 18ch;
3461
- --pf-c-chip-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
3462
- --pf-c-chip-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
3463
- --pf-c-chip-group__list-item--MarginRight: var(--pf-global--spacer--xs);
3464
- --pf-c-chip-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
3465
- max-width: 100%;
3466
- }
3467
-
3468
- .pf-c-chip-group.pf-m-category {
3469
- padding-top: var(--pf-c-chip-group--m-category--PaddingTop);
3470
- padding-right: var(--pf-c-chip-group--m-category--PaddingRight);
3471
- padding-bottom: var(--pf-c-chip-group--m-category--PaddingBottom);
3472
- padding-left: var(--pf-c-chip-group--m-category--PaddingLeft);
3473
- background-color: var(--pf-c-chip-group--m-category--BackgroundColor);
3474
- border-radius: var(--pf-c-chip-group--m-category--BorderRadius);
3475
- }
3476
-
3477
- .pf-c-chip-group__main {
3478
- display: flex;
3479
- flex: 1;
3480
- flex-wrap: wrap;
3481
- align-items: baseline;
3482
- min-width: 0;
3483
- }
3484
-
3485
- .pf-c-chip-group__list {
3486
- margin-right: var(--pf-c-chip-group__list--MarginRight);
3487
- margin-bottom: var(--pf-c-chip-group__list--MarginBottom);
3488
- }
3489
-
3490
- .pf-c-chip-group,
3491
- .pf-c-chip-group__list {
3492
- display: inline-flex;
3493
- flex-wrap: wrap;
3494
- align-items: center;
3495
- min-width: 0;
3496
- }
3497
-
3498
- .pf-c-chip-group__list-item {
3499
- display: inline-flex;
3500
- min-width: 0;
3501
- margin-right: var(--pf-c-chip-group__list-item--MarginRight);
3502
- margin-bottom: var(--pf-c-chip-group__list-item--MarginBottom);
3503
- }
3504
-
3505
- .pf-c-chip-group__label {
3506
- overflow: hidden;
3507
- text-overflow: ellipsis;
3508
- white-space: nowrap;
3509
- max-width: var(--pf-c-chip-group__label--MaxWidth);
3510
- margin-right: var(--pf-c-chip-group__label--MarginRight);
3511
- font-size: var(--pf-c-chip-group__label--FontSize);
3512
- }
3513
-
3514
- .pf-c-chip-group__close {
3515
- display: flex;
3516
- align-self: flex-start;
3517
- margin-top: var(--pf-c-chip-group__close--MarginTop);
3518
- margin-bottom: var(--pf-c-chip-group__close--MarginBottom);
3519
- }
3520
-
3521
3438
  .pf-c-clipboard-copy {
3522
3439
  --pf-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
3523
3440
  --pf-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
@@ -4998,6 +4915,89 @@ label.pf-c-check, .pf-c-check__label,
4998
4915
  --pf-c-data-list__item--sm--BorderBottomColor: var(--pf-global--BorderColor--100);
4999
4916
  }
5000
4917
 
4918
+ .pf-c-chip-group {
4919
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
4920
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
4921
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
4922
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
4923
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
4924
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
4925
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
4926
+ }
4927
+
4928
+ .pf-c-chip-group {
4929
+ color: var(--pf-global--Color--100);
4930
+ --pf-c-chip-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
4931
+ --pf-c-chip-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
4932
+ --pf-c-chip-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
4933
+ --pf-c-chip-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
4934
+ --pf-c-chip-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
4935
+ --pf-c-chip-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
4936
+ --pf-c-chip-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
4937
+ --pf-c-chip-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--200);
4938
+ --pf-c-chip-group__label--MarginRight: var(--pf-global--spacer--sm);
4939
+ --pf-c-chip-group__label--FontSize: var(--pf-global--FontSize--sm);
4940
+ --pf-c-chip-group__label--MaxWidth: 18ch;
4941
+ --pf-c-chip-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
4942
+ --pf-c-chip-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
4943
+ --pf-c-chip-group__list-item--MarginRight: var(--pf-global--spacer--xs);
4944
+ --pf-c-chip-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
4945
+ max-width: 100%;
4946
+ }
4947
+
4948
+ .pf-c-chip-group.pf-m-category {
4949
+ padding-top: var(--pf-c-chip-group--m-category--PaddingTop);
4950
+ padding-right: var(--pf-c-chip-group--m-category--PaddingRight);
4951
+ padding-bottom: var(--pf-c-chip-group--m-category--PaddingBottom);
4952
+ padding-left: var(--pf-c-chip-group--m-category--PaddingLeft);
4953
+ background-color: var(--pf-c-chip-group--m-category--BackgroundColor);
4954
+ border-radius: var(--pf-c-chip-group--m-category--BorderRadius);
4955
+ }
4956
+
4957
+ .pf-c-chip-group__main {
4958
+ display: flex;
4959
+ flex: 1;
4960
+ flex-wrap: wrap;
4961
+ align-items: baseline;
4962
+ min-width: 0;
4963
+ }
4964
+
4965
+ .pf-c-chip-group__list {
4966
+ margin-right: var(--pf-c-chip-group__list--MarginRight);
4967
+ margin-bottom: var(--pf-c-chip-group__list--MarginBottom);
4968
+ }
4969
+
4970
+ .pf-c-chip-group,
4971
+ .pf-c-chip-group__list {
4972
+ display: inline-flex;
4973
+ flex-wrap: wrap;
4974
+ align-items: center;
4975
+ min-width: 0;
4976
+ }
4977
+
4978
+ .pf-c-chip-group__list-item {
4979
+ display: inline-flex;
4980
+ min-width: 0;
4981
+ margin-right: var(--pf-c-chip-group__list-item--MarginRight);
4982
+ margin-bottom: var(--pf-c-chip-group__list-item--MarginBottom);
4983
+ }
4984
+
4985
+ .pf-c-chip-group__label {
4986
+ overflow: hidden;
4987
+ text-overflow: ellipsis;
4988
+ white-space: nowrap;
4989
+ max-width: var(--pf-c-chip-group__label--MaxWidth);
4990
+ margin-right: var(--pf-c-chip-group__label--MarginRight);
4991
+ font-size: var(--pf-c-chip-group__label--FontSize);
4992
+ }
4993
+
4994
+ .pf-c-chip-group__close {
4995
+ display: flex;
4996
+ align-self: flex-start;
4997
+ margin-top: var(--pf-c-chip-group__close--MarginTop);
4998
+ margin-bottom: var(--pf-c-chip-group__close--MarginBottom);
4999
+ }
5000
+
5001
5001
  @media screen and (min-width: 768px) {
5002
5002
  .pf-c-data-list:not([class*=pf-m-grid]) {
5003
5003
  --pf-c-data-list__cell--cell--PaddingTop: var(--pf-c-data-list__cell--cell--md--PaddingTop);
@@ -22838,1094 +22838,1094 @@ svg.pf-c-spinner.pf-m-xl {
22838
22838
  font-size: var(--pf-c-number-input__icon--FontSize);
22839
22839
  }
22840
22840
 
22841
- .pf-c-tree-view {
22842
- --pf-c-tree-view--PaddingTop: var(--pf-global--spacer--sm);
22843
- --pf-c-tree-view--PaddingBottom: var(--pf-global--spacer--sm);
22844
- --pf-c-tree-view__node--indent--base: calc(var(--pf-global--spacer--md) * 2 + var(--pf-c-tree-view__node-toggle-icon--MinWidth));
22845
- --pf-c-tree-view__node--nested-indent--base: calc(var(--pf-c-tree-view__node--indent--base) - var(--pf-global--spacer--md));
22846
- --pf-c-tree-view__node--PaddingTop--base: var(--pf-global--spacer--sm);
22847
- --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view__node--PaddingTop--base);
22848
- --pf-c-tree-view__node--PaddingRight: var(--pf-global--spacer--sm);
22849
- --pf-c-tree-view__node--PaddingBottom: var(--pf-global--spacer--sm);
22850
- --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view__node--indent--base);
22851
- --pf-c-tree-view__node--Color: var(--pf-global--Color--100);
22852
- --pf-c-tree-view__node--m-current--Color: var(--pf-global--link--Color);
22853
- --pf-c-tree-view__node--m-current--FontWeight: var(--pf-global--FontWeight--bold);
22854
- --pf-c-tree-view__node-container--Display: contents;
22855
- --pf-c-tree-view__node-content--RowGap: var(--pf-global--spacer--sm);
22856
- --pf-c-tree-view__node-content--Overflow: visible;
22857
- --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
22858
- --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--palette--black-200);
22859
- --pf-c-tree-view__list-item__list-item__node-toggle--Top: var(--pf-c-tree-view__node--PaddingTop--base);
22860
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
22861
- --pf-c-tree-view__list-item__list-item__node-toggle--TranslateX: -100%;
22862
- --pf-c-tree-view__node-toggle--Position: absolute;
22863
- --pf-c-tree-view__node-toggle--Color--base: var(--pf-global--Color--200);
22864
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color--base);
22865
- --pf-c-tree-view__node-toggle--hover--Color: var(--pf-global--Color--100);
22866
- --pf-c-tree-view__node-toggle--focus--Color: var(--pf-global--Color--100);
22867
- --pf-c-tree-view__node-toggle--active--Color: var(--pf-global--Color--100);
22868
- --pf-c-tree-view__list-item--m-expanded__node-toggle--Color: var(--pf-global--Color--100);
22869
- --pf-c-tree-view__node-toggle-icon--MinWidth: var(--pf-global--FontSize--md);
22870
- --pf-c-tree-view__node-toggle-icon--Transition: transform var(--pf-global--TransitionDuration) var(--pf-global--TimingFunction);
22871
- --pf-c-tree-view__node-toggle-button--PaddingTop: var(--pf-global--spacer--form-element);
22872
- --pf-c-tree-view__node-toggle-button--PaddingRight: var(--pf-global--spacer--md);
22873
- --pf-c-tree-view__node-toggle-button--PaddingBottom: var(--pf-global--spacer--form-element);
22874
- --pf-c-tree-view__node-toggle-button--PaddingLeft: var(--pf-global--spacer--md);
22875
- --pf-c-tree-view__node-toggle-button--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
22876
- --pf-c-tree-view__node-toggle-button--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
22877
- --pf-c-tree-view__node-check--MarginRight: var(--pf-global--spacer--sm);
22878
- --pf-c-tree-view__node-count--MarginLeft: var(--pf-global--spacer--sm);
22879
- --pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
22880
- --pf-c-tree-view__search--PaddingTop: var(--pf-global--spacer--sm);
22881
- --pf-c-tree-view__search--PaddingRight: var(--pf-global--spacer--sm);
22882
- --pf-c-tree-view__search--PaddingBottom: var(--pf-global--spacer--sm);
22883
- --pf-c-tree-view__search--PaddingLeft: var(--pf-global--spacer--sm);
22884
- --pf-c-tree-view__node-icon--PaddingRight: var(--pf-global--spacer--sm);
22885
- --pf-c-tree-view__node-icon--Color: var(--pf-global--icon--Color--light);
22886
- --pf-c-tree-view__node-toggle-icon--base--Rotate: 0;
22887
- --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__node-toggle-icon--base--Rotate);
22888
- --pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate: 90deg;
22889
- --pf-c-tree-view__node-text--max-lines: 1;
22890
- --pf-c-tree-view__node-title--FontWeight: var(--pf-global--FontWeight--bold);
22891
- --pf-c-tree-view__action--MarginLeft: var(--pf-global--spacer--md);
22892
- --pf-c-tree-view__action--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
22893
- --pf-c-tree-view__action--Color: var(--pf-global--icon--Color--light);
22894
- --pf-c-tree-view__action--hover--Color: var(--pf-global--icon--Color--dark);
22895
- --pf-c-tree-view__action--focus--Color: var(--pf-global--icon--Color--dark);
22896
- --pf-c-tree-view--m-guides--guide--Left: var(--pf-c-tree-view--m-guides--guide-left--base);
22897
- --pf-c-tree-view--m-guides--guide-color--base: var(--pf-global--BorderColor--100);
22898
- --pf-c-tree-view--m-guides--guide-width--base: var(--pf-global--BorderWidth--sm);
22899
- --pf-c-tree-view--m-guides--guide-left--base: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides__list-node--guide-width--base));
22900
- --pf-c-tree-view--m-guides--guide-left--base--offset: calc(var(--pf-c-tree-view__list-item__list-item__node-toggle--Left) + var(--pf-c-tree-view__node-toggle-icon--MinWidth) / 2);
22901
- --pf-c-tree-view--m-guides__list-node--guide-width--base: var(--pf-global--spacer--lg);
22902
- --pf-c-tree-view--m-guides__list-item--before--Top: 0;
22903
- --pf-c-tree-view--m-guides__list-item--before--Width: var(--pf-c-tree-view--m-guides--guide-width--base);
22904
- --pf-c-tree-view--m-guides__list-item--before--Height: 100%;
22905
- --pf-c-tree-view--m-guides__list-item--before--BackgroundColor: var(--pf-c-tree-view--m-guides--guide-color--base);
22906
- --pf-c-tree-view--m-guides__list-item--last-child--before--Top: var(--pf-c-tree-view--m-guides__node--before--Top);
22907
- --pf-c-tree-view--m-guides__list-item--last-child--before--Height: var(--pf-c-tree-view--m-guides__list-item--last-child--before--Top);
22908
- --pf-c-tree-view--m-guides__list-item--ZIndex: var(--pf-global--ZIndex--xs);
22909
- --pf-c-tree-view--m-guides__node--before--Width: 1rem;
22910
- --pf-c-tree-view--m-guides__node--before--Height: var(--pf-c-tree-view--m-guides--guide-width--base);
22911
- --pf-c-tree-view--m-guides__node--before--Top: 1.125rem;
22912
- --pf-c-tree-view--m-guides__node--before--BackgroundColor: var(--pf-c-tree-view--m-guides--guide-color--base);
22913
- --pf-c-tree-view--m-compact--base-border--Left--offset: var(--pf-global--spacer--md);
22914
- --pf-c-tree-view--m-compact--base-border--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
22915
- --pf-c-tree-view--m-compact__node--indent--base: var(--pf-c-tree-view__node--indent--base);
22916
- --pf-c-tree-view--m-compact__node--nested-indent--base: var(--pf-global--spacer--lg);
22917
- --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--base-border--Left);
22918
- --pf-c-tree-view--m-compact__node--PaddingTop: 0;
22919
- --pf-c-tree-view--m-compact__node--PaddingBottom: 0;
22920
- --pf-c-tree-view--m-compact__node--nested--PaddingTop: var(--pf-global--spacer--sm);
22921
- --pf-c-tree-view--m-compact__node--nested--PaddingBottom: var(--pf-global--spacer--sm);
22922
- --pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top: calc(var(--pf-c-tree-view--m-compact__node-container--PaddingTop));
22923
- --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
22924
- --pf-c-tree-view--m-compact__list-item--BorderBottomColor: var(--pf-global--BorderColor--100);
22925
- --pf-c-tree-view--m-compact__list-item--before--Top: 0;
22926
- --pf-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-c-tree-view--m-compact__node--before--Top);
22927
- --pf-c-tree-view--m-compact__list-item--nested--before--Top: calc(var(--pf-c-tree-view__node--PaddingTop--base) * -1);
22928
- --pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height: calc(var(--pf-c-tree-view--m-compact__node--before--Top) + var(--pf-c-tree-view__node--PaddingTop--base));
22929
- --pf-c-tree-view--m-compact__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--indent--base);
22930
- --pf-c-tree-view--m-compact__node--before--Top: calc(var(--pf-c-tree-view--m-compact__node-container--PaddingTop) + var(--pf-c-tree-view--m-compact__node--nested--PaddingTop) + 0.25rem);
22931
- --pf-c-tree-view--m-compact__node--level-2--PaddingLeft: var(--pf-c-tree-view--m-compact__node--indent--base);
22932
- --pf-c-tree-view--m-compact__node-toggle--nested--MarginRight: calc(var(--pf-c-tree-view__node-toggle-button--PaddingLeft) * -.5);
22933
- --pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft: calc(var(--pf-c-tree-view__node-toggle-button--PaddingLeft) * -1.5);
22934
- --pf-c-tree-view--m-compact__node-container--Display: flex;
22935
- --pf-c-tree-view--m-compact__node-container--PaddingBottom--base: var(--pf-global--spacer--lg);
22936
- --pf-c-tree-view--m-compact__node-container--PaddingTop: var(--pf-global--spacer--lg);
22937
- --pf-c-tree-view--m-compact__node-container--PaddingRight: var(--pf-global--spacer--lg);
22938
- --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__node-container--PaddingBottom--base);
22939
- --pf-c-tree-view--m-compact__node-container--PaddingLeft: var(--pf-global--spacer--xs);
22940
- --pf-c-tree-view--m-compact__node-container--nested--PaddingTop: var(--pf-global--spacer--md);
22941
- --pf-c-tree-view--m-compact__node-container--nested--PaddingRight: var(--pf-global--spacer--lg);
22942
- --pf-c-tree-view--m-compact__node-container--nested--PaddingBottom: var(--pf-global--spacer--md);
22943
- --pf-c-tree-view--m-compact__node-container--nested--PaddingLeft: var(--pf-global--spacer--lg);
22944
- --pf-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-global--BackgroundColor--200);
22945
- --pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom: 0;
22946
- --pf-c-tree-view--m-no-background__node-container--BackgroundColor: transparent;
22947
- --pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset: var(--pf-global--spacer--sm);
22948
- --pf-c-tree-view--m-compact--m-no-background--base-border--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
22949
- --pf-c-tree-view--m-compact--m-no-background__node--indent--base: var(--pf-c-tree-view__node--indent--base);
22950
- --pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base: var(--pf-global--spacer--2xl);
22951
- --pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop: 0;
22952
- --pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom: 0;
22953
- --pf-c-tree-view--m-compact--m-no-background__node--before--Top: calc(var(--pf-c-tree-view--m-compact__node-container--nested--PaddingTop) + var(--pf-c-tree-view--m-compact__node--nested--PaddingTop) + 0.25rem);
22954
- padding-top: var(--pf-c-tree-view--PaddingTop);
22955
- padding-bottom: var(--pf-c-tree-view--PaddingBottom);
22841
+ .pf-c-wizard__header {
22842
+ --pf-global--Color--100: var(--pf-global--Color--light-100);
22843
+ --pf-global--Color--200: var(--pf-global--Color--light-200);
22844
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
22845
+ --pf-global--primary-color--100: var(--pf-global--primary-color--light-100);
22846
+ --pf-global--link--Color: var(--pf-global--link--Color--light);
22847
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
22848
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
22956
22849
  }
22957
22850
 
22958
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item {
22959
- position: relative;
22851
+ .pf-c-wizard__header .pf-c-card {
22852
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
22960
22853
  }
22961
22854
 
22962
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
22963
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
22964
- .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
22965
- position: absolute;
22966
- left: var(--pf-c-tree-view--m-guides--guide--Left);
22967
- content: "";
22855
+ .pf-c-wizard__header .pf-c-button {
22856
+ --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
22857
+ --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
22858
+ --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
22859
+ --pf-c-button--m-primary--active--Color: var(--pf-global--primary-color--dark-100);
22860
+ --pf-c-button--m-primary--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
22861
+ --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
22862
+ --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
22863
+ --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
22864
+ --pf-c-button--m-secondary--Color: var(--pf-global--Color--light-100);
22865
+ --pf-c-button--m-secondary--hover--Color: var(--pf-global--Color--light-100);
22866
+ --pf-c-button--m-secondary--focus--Color: var(--pf-global--Color--light-100);
22867
+ --pf-c-button--m-secondary--active--Color: var(--pf-global--Color--light-100);
22868
+ --pf-c-button--m-secondary--BorderColor: var(--pf-global--Color--light-100);
22869
+ --pf-c-button--m-secondary--hover--BorderColor: var(--pf-global--Color--light-100);
22870
+ --pf-c-button--m-secondary--focus--BorderColor: var(--pf-global--Color--light-100);
22871
+ --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
22968
22872
  }
22969
22873
 
22970
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before {
22971
- top: var(--pf-c-tree-view--m-guides__list-item--before--Top);
22972
- z-index: var(--pf-c-tree-view--m-guides__list-item--ZIndex);
22973
- width: var(--pf-c-tree-view--m-guides__list-item--before--Width);
22974
- height: var(--pf-c-tree-view--m-guides__list-item--before--Height);
22975
- background-color: var(--pf-c-tree-view--m-guides__list-item--before--BackgroundColor);
22874
+ .pf-c-wizard {
22875
+ --pf-c-wizard--Height: 100%;
22876
+ --pf-c-modal-box--c-wizard--FlexBasis: 47.625rem;
22877
+ --pf-c-wizard__header--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
22878
+ --pf-c-wizard__header--ZIndex: var(--pf-global--ZIndex--md);
22879
+ --pf-c-wizard__header--PaddingTop: var(--pf-global--spacer--lg);
22880
+ --pf-c-wizard__header--PaddingRight: var(--pf-global--spacer--md);
22881
+ --pf-c-wizard__header--PaddingBottom: var(--pf-global--spacer--lg);
22882
+ --pf-c-wizard__header--PaddingLeft: var(--pf-global--spacer--md);
22883
+ --pf-c-wizard__header--lg--PaddingRight: var(--pf-global--spacer--md);
22884
+ --pf-c-wizard__header--lg--PaddingLeft: var(--pf-global--spacer--md);
22885
+ --pf-c-wizard__header--xl--PaddingRight: var(--pf-global--spacer--lg);
22886
+ --pf-c-wizard__header--xl--PaddingLeft: var(--pf-global--spacer--lg);
22887
+ --pf-c-wizard__close--Top: calc(var(--pf-global--spacer--lg) - var(--pf-global--spacer--form-element));
22888
+ --pf-c-wizard__close--Right: 0;
22889
+ --pf-c-wizard__close--xl--Right: var(--pf-global--spacer--lg);
22890
+ --pf-c-wizard__close--FontSize: var(--pf-global--FontSize--xl);
22891
+ --pf-c-wizard__title--PaddingRight: var(--pf-global--spacer--2xl);
22892
+ --pf-c-wizard__description--PaddingTop: var(--pf-global--spacer--sm);
22893
+ --pf-c-wizard__description--Color: var(--pf-global--Color--light-200);
22894
+ --pf-c-wizard__nav-link--Color: var(--pf-global--Color--100);
22895
+ --pf-c-wizard__nav-link--TextDecoration: var(--pf-global--link--TextDecoration);
22896
+ --pf-c-wizard__nav-link--hover--Color: var(--pf-global--link--Color);
22897
+ --pf-c-wizard__nav-link--focus--Color: var(--pf-global--link--Color);
22898
+ --pf-c-wizard__nav-link--m-current--Color: var(--pf-global--link--Color);
22899
+ --pf-c-wizard__nav-link--m-current--FontWeight: var(--pf-global--FontWeight--normal);
22900
+ --pf-c-wizard__nav-link--m-disabled--Color: var(--pf-global--Color--dark-200);
22901
+ --pf-c-wizard__nav-list__nav-list__nav-link--m-current--FontWeight: var(--pf-global--FontWeight--normal);
22902
+ --pf-c-wizard__nav-link-toggle--PaddingRight: var(--pf-global--spacer--sm);
22903
+ --pf-c-wizard__nav-link-toggle--PaddingLeft: var(--pf-global--spacer--sm);
22904
+ --pf-c-wizard__nav-link-toggle--Color: var(--pf-global--Color--200);
22905
+ --pf-c-wizard__nav-link--hover__nav-link-toggle-icon--Color: var(--pf-global--Color--100);
22906
+ --pf-c-wizard__nav-link--focus__nav-link-toggle-icon--Color: var(--pf-global--Color--100);
22907
+ --pf-c-wizard__nav-link-toggle-icon--Transition: var(--pf-global--Transition);
22908
+ --pf-c-wizard__nav-link-toggle-icon--Rotate: 0;
22909
+ --pf-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate: 90deg;
22910
+ --pf-c-wizard__nav-link--before--Width: 1.5rem;
22911
+ --pf-c-wizard__nav-link--before--Height: 1.5rem;
22912
+ --pf-c-wizard__nav-link--before--Top: 0;
22913
+ --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-global--BackgroundColor--200);
22914
+ --pf-c-wizard__nav-link--before--BorderRadius: var(--pf-global--BorderRadius--lg);
22915
+ --pf-c-wizard__nav-link--before--Color: var(--pf-global--Color--100);
22916
+ --pf-c-wizard__nav-link--before--FontSize: var(--pf-global--FontSize--sm);
22917
+ --pf-c-wizard__nav-link--before--TranslateX: calc(-100% - var(--pf-global--spacer--sm));
22918
+ --pf-c-wizard__nav-link--m-current--before--BackgroundColor: var(--pf-global--active-color--100);
22919
+ --pf-c-wizard__nav-link--m-current--before--Color: var(--pf-global--Color--light-100);
22920
+ --pf-c-wizard__nav-link--m-disabled--before--BackgroundColor: transparent;
22921
+ --pf-c-wizard__nav-link--m-disabled--before--Color: var(--pf-global--Color--dark-200);
22922
+ --pf-c-wizard__toggle--BackgroundColor: var(--pf-global--BackgroundColor--100);
22923
+ --pf-c-wizard__toggle--ZIndex: var(--pf-global--ZIndex--md);
22924
+ --pf-c-wizard__toggle--BoxShadow: var(--pf-global--BoxShadow--md-bottom);
22925
+ --pf-c-wizard__toggle--PaddingTop: var(--pf-global--spacer--lg);
22926
+ --pf-c-wizard__toggle--PaddingRight: var(--pf-global--spacer--md);
22927
+ --pf-c-wizard__toggle--PaddingBottom: var(--pf-global--spacer--lg);
22928
+ --pf-c-wizard__toggle--PaddingLeft: calc(var(--pf-global--spacer--md) + var(--pf-c-wizard__nav-link--before--Width) + var(--pf-global--spacer--sm));
22929
+ --pf-c-wizard__toggle--m-expanded--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
22930
+ --pf-c-wizard__toggle--m-expanded--BorderBottomColor: var(--pf-global--BorderColor--100);
22931
+ --pf-c-wizard--m-in-page__toggle--xl--PaddingLeft: calc(var(--pf-global--spacer--xl) + var(--pf-c-wizard__nav-link--before--Width) + var(--pf-global--spacer--sm));
22932
+ --pf-c-wizard__toggle-num--before--Top: 0;
22933
+ --pf-c-wizard__toggle-list-item--not-last-child--MarginRight: var(--pf-global--spacer--sm);
22934
+ --pf-c-wizard__toggle-list-item--MarginBottom: var(--pf-global--spacer--xs);
22935
+ --pf-c-wizard__toggle-list--MarginRight: var(--pf-global--spacer--sm);
22936
+ --pf-c-wizard__toggle-list--MarginBottom: calc(var(--pf-c-wizard__toggle-list-item--MarginBottom) * -1);
22937
+ --pf-c-wizard__toggle-separator--MarginLeft: var(--pf-global--spacer--sm);
22938
+ --pf-c-wizard__toggle-separator--Color: var(--pf-global--BorderColor--200);
22939
+ --pf-c-wizard__toggle-icon--LineHeight: var(--pf-global--LineHeight--md);
22940
+ --pf-c-wizard__toggle--m-expanded__toggle-icon--Rotate: 180deg;
22941
+ --pf-c-wizard__nav--ZIndex: var(--pf-global--ZIndex--sm);
22942
+ --pf-c-wizard__nav--BackgroundColor: var(--pf-global--BackgroundColor--100);
22943
+ --pf-c-wizard__nav--BoxShadow: var(--pf-global--BoxShadow--md-bottom);
22944
+ --pf-c-wizard__nav--Width: 100%;
22945
+ --pf-c-wizard__nav--lg--Width: 15.625rem;
22946
+ --pf-c-wizard__nav--lg--BorderRightWidth: var(--pf-global--BorderWidth--sm);
22947
+ --pf-c-wizard__nav--lg--BorderRightColor: var(--pf-global--BorderColor--100);
22948
+ --pf-c-wizard__nav-list--PaddingTop: var(--pf-global--spacer--lg);
22949
+ --pf-c-wizard__nav-list--PaddingRight: var(--pf-global--spacer--md);
22950
+ --pf-c-wizard__nav-list--PaddingBottom: var(--pf-global--spacer--lg);
22951
+ --pf-c-wizard__nav-list--PaddingLeft: calc(var(--pf-global--spacer--md) + var(--pf-c-wizard__nav-link--before--Width) + var(--pf-global--spacer--sm));
22952
+ --pf-c-wizard__nav-list--lg--PaddingTop: var(--pf-global--spacer--md);
22953
+ --pf-c-wizard__nav-list--lg--PaddingRight: var(--pf-global--spacer--md);
22954
+ --pf-c-wizard__nav-list--lg--PaddingBottom: var(--pf-global--spacer--md);
22955
+ --pf-c-wizard__nav-list--xl--PaddingTop: var(--pf-global--spacer--lg);
22956
+ --pf-c-wizard__nav-list--xl--PaddingRight: var(--pf-global--spacer--lg);
22957
+ --pf-c-wizard__nav-list--xl--PaddingBottom: var(--pf-global--spacer--lg);
22958
+ --pf-c-wizard__nav-list--xl--PaddingLeft: calc(var(--pf-global--spacer--lg) + var(--pf-c-wizard__nav-link--before--Width) + var(--pf-global--spacer--sm));
22959
+ --pf-c-wizard__nav-list--nested--MarginLeft: var(--pf-global--spacer--md);
22960
+ --pf-c-wizard__nav-list--nested--MarginTop: var(--pf-global--spacer--md);
22961
+ --pf-c-wizard__nav-item--MarginTop: var(--pf-global--spacer--md);
22962
+ --pf-c-wizard__outer-wrap--BackgroundColor: var(--pf-global--BackgroundColor--100);
22963
+ --pf-c-wizard__outer-wrap--lg--PaddingLeft: var(--pf-c-wizard__nav--Width);
22964
+ --pf-c-wizard__outer-wrap--MinHeight: 15.625rem;
22965
+ --pf-c-wizard__main--ZIndex: var(--pf-global--ZIndex--xs);
22966
+ --pf-c-wizard__main-body--PaddingTop: var(--pf-global--spacer--md);
22967
+ --pf-c-wizard__main-body--PaddingRight: var(--pf-global--spacer--md);
22968
+ --pf-c-wizard__main-body--PaddingBottom: var(--pf-global--spacer--md);
22969
+ --pf-c-wizard__main-body--PaddingLeft: var(--pf-global--spacer--md);
22970
+ --pf-c-wizard__main-body--xl--PaddingTop: var(--pf-global--spacer--lg);
22971
+ --pf-c-wizard__main-body--xl--PaddingRight: var(--pf-global--spacer--lg);
22972
+ --pf-c-wizard__main-body--xl--PaddingBottom: var(--pf-global--spacer--lg);
22973
+ --pf-c-wizard__main-body--xl--PaddingLeft: var(--pf-global--spacer--lg);
22974
+ --pf-c-wizard__footer--BackgroundColor: var(--pf-global--BackgroundColor--100);
22975
+ --pf-c-wizard__footer--ZIndex: var(--pf-global--ZIndex--sm);
22976
+ --pf-c-wizard__footer--PaddingTop: var(--pf-global--spacer--md);
22977
+ --pf-c-wizard__footer--PaddingRight: var(--pf-global--spacer--md);
22978
+ --pf-c-wizard__footer--PaddingBottom: var(--pf-global--spacer--sm);
22979
+ --pf-c-wizard__footer--PaddingLeft: var(--pf-global--spacer--md);
22980
+ --pf-c-wizard__footer--xl--PaddingTop: var(--pf-global--spacer--lg);
22981
+ --pf-c-wizard__footer--xl--PaddingRight: var(--pf-global--spacer--lg);
22982
+ --pf-c-wizard__footer--xl--PaddingBottom: var(--pf-global--spacer--md);
22983
+ --pf-c-wizard__footer--xl--PaddingLeft: var(--pf-global--spacer--lg);
22984
+ --pf-c-wizard__footer--BoxShadow: var(--pf-global--BoxShadow--sm-top);
22985
+ --pf-c-wizard__footer--child--MarginRight: var(--pf-global--spacer--md);
22986
+ --pf-c-wizard__footer--child--MarginBottom: var(--pf-global--spacer--sm);
22987
+ --pf-c-wizard__footer-cancel--MarginLeft: calc(var(--pf-global--spacer--2xl) - var(--pf-c-wizard__footer--child--MarginRight));
22988
+ position: relative;
22989
+ display: flex;
22990
+ flex-direction: column;
22991
+ height: var(--pf-c-wizard--Height);
22976
22992
  }
22977
22993
 
22978
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
22979
- top: var(--pf-c-tree-view--m-guides__node--before--Top);
22980
- width: var(--pf-c-tree-view--m-guides__node--before--Width);
22981
- height: var(--pf-c-tree-view--m-guides__node--before--Height);
22982
- background-color: var(--pf-c-tree-view--m-guides__node--before--BackgroundColor);
22994
+ @media screen and (min-width: 992px) {
22995
+ .pf-c-wizard {
22996
+ --pf-c-wizard__header--PaddingRight: var(--pf-c-wizard__header--lg--PaddingRight);
22997
+ --pf-c-wizard__header--PaddingLeft: var(--pf-c-wizard__header--lg--PaddingLeft);
22998
+ }
22983
22999
  }
22984
-
22985
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before {
22986
- height: var(--pf-c-tree-view--m-guides__list-item--last-child--before--Height);
23000
+ @media screen and (min-width: 1200px) {
23001
+ .pf-c-wizard {
23002
+ --pf-c-wizard__header--PaddingRight: var(--pf-c-wizard__header--xl--PaddingRight);
23003
+ --pf-c-wizard__header--PaddingLeft: var(--pf-c-wizard__header--xl--PaddingLeft);
23004
+ }
22987
23005
  }
22988
-
22989
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
22990
- --pf-c-tree-view--m-guides--guide--Left: var(--pf-c-tree-view--m-guides--border--nested--Left);
23006
+ @media screen and (min-width: 1200px) {
23007
+ .pf-c-wizard {
23008
+ --pf-c-wizard__close--Right: var(--pf-c-wizard__close--xl--Right);
23009
+ }
22991
23010
  }
22992
-
22993
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:last-child, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item:last-child {
22994
- --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: 0;
23011
+ @media screen and (min-width: 992px) {
23012
+ .pf-c-wizard {
23013
+ --pf-c-wizard__nav--Width: var(--pf-c-wizard__nav--lg--Width);
23014
+ --pf-c-wizard__nav--BoxShadow: none;
23015
+ }
22995
23016
  }
22996
-
22997
- .pf-c-tree-view.pf-m-compact {
22998
- --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact__node--PaddingTop);
22999
- --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact__node--PaddingBottom);
23000
- --pf-c-tree-view__node-container--Display: var(--pf-c-tree-view--m-compact__node-container--Display);
23001
- --pf-c-tree-view__node--hover--BackgroundColor: transparent;
23002
- --pf-c-tree-view__node--focus--BackgroundColor: transparent;
23003
- --pf-c-tree-view__list-item__list-item__node-toggle--Top: var(--pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top);
23017
+ @media screen and (min-width: 992px) {
23018
+ .pf-c-wizard {
23019
+ --pf-c-wizard__nav-list--PaddingTop: var(--pf-c-wizard__nav-list--lg--PaddingTop);
23020
+ --pf-c-wizard__nav-list--PaddingRight: var(--pf-c-wizard__nav-list--lg--PaddingRight);
23021
+ --pf-c-wizard__nav-list--PaddingBottom: var(--pf-c-wizard__nav-list--lg--PaddingBottom);
23022
+ }
23004
23023
  }
23005
-
23006
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item {
23007
- border-bottom: var(--pf-c-tree-view--m-compact__list-item--BorderBottomWidth) solid var(--pf-c-tree-view--m-compact__list-item--BorderBottomColor);
23024
+ @media screen and (min-width: 1200px) {
23025
+ .pf-c-wizard {
23026
+ --pf-c-wizard__nav-list--PaddingTop: var(--pf-c-wizard__nav-list--xl--PaddingTop);
23027
+ --pf-c-wizard__nav-list--PaddingRight: var(--pf-c-wizard__nav-list--xl--PaddingRight);
23028
+ --pf-c-wizard__nav-list--PaddingBottom: var(--pf-c-wizard__nav-list--xl--PaddingBottom);
23029
+ --pf-c-wizard__nav-list--PaddingLeft: var(--pf-c-wizard__nav-list--xl--PaddingLeft);
23030
+ }
23008
23031
  }
23009
-
23010
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item.pf-m-expanded {
23011
- --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom);
23032
+ @media screen and (min-width: 1200px) {
23033
+ .pf-c-wizard {
23034
+ --pf-c-wizard__main-body--PaddingTop: var(--pf-c-wizard__main-body--xl--PaddingTop);
23035
+ --pf-c-wizard__main-body--PaddingRight: var(--pf-c-wizard__main-body--xl--PaddingRight);
23036
+ --pf-c-wizard__main-body--PaddingBottom: var(--pf-c-wizard__main-body--xl--PaddingBottom);
23037
+ --pf-c-wizard__main-body--PaddingLeft: var(--pf-c-wizard__main-body--xl--PaddingLeft);
23038
+ }
23012
23039
  }
23013
-
23014
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23015
- --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact__node--nested--PaddingTop);
23016
- --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact__node--nested--PaddingBottom);
23017
- --pf-c-tree-view__node-toggle--Position: static;
23018
- --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--level-2--PaddingLeft);
23019
- --pf-c-tree-view__list-item__list-item__node-toggle--TranslateX: 0;
23020
- --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: 0;
23021
- --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__node-container--PaddingBottom--base);
23040
+ @media screen and (min-width: 1200px) {
23041
+ .pf-c-wizard {
23042
+ --pf-c-wizard__footer--PaddingTop: var(--pf-c-wizard__footer--xl--PaddingTop);
23043
+ --pf-c-wizard__footer--PaddingRight: var(--pf-c-wizard__footer--xl--PaddingRight);
23044
+ --pf-c-wizard__footer--PaddingBottom: var(--pf-c-wizard__footer--xl--PaddingBottom);
23045
+ --pf-c-wizard__footer--PaddingLeft: var(--pf-c-wizard__footer--xl--PaddingLeft);
23046
+ }
23022
23047
  }
23023
-
23024
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
23025
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
23026
- left: var(--pf-c-tree-view--m-compact--border--Left);
23048
+ .pf-c-modal-box .pf-c-wizard {
23049
+ flex: 1 1 var(--pf-c-modal-box--c-wizard--FlexBasis);
23050
+ min-height: 0;
23027
23051
  }
23028
23052
 
23029
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before {
23030
- top: var(--pf-c-tree-view--m-compact__list-item--before--Top);
23053
+ .pf-c-wizard > :not(.pf-c-wizard__outer-wrap):not(.pf-c-drawer) {
23054
+ flex-shrink: 0;
23031
23055
  }
23032
23056
 
23033
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
23034
- top: var(--pf-c-tree-view--m-compact__node--before--Top);
23057
+ .pf-c-wizard.pf-m-finished {
23058
+ --pf-c-wizard__outer-wrap--lg--PaddingLeft: 0;
23035
23059
  }
23036
23060
 
23037
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before {
23038
- height: var(--pf-c-tree-view--m-compact__list-item--last-child--before--Height);
23061
+ .pf-c-wizard.pf-m-finished .pf-c-wizard__nav,
23062
+ .pf-c-wizard.pf-m-finished .pf-c-wizard__footer,
23063
+ .pf-c-wizard.pf-m-finished .pf-c-wizard__toggle {
23064
+ display: none;
23065
+ visibility: hidden;
23039
23066
  }
23040
23067
 
23041
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23042
- --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--PaddingLeft);
23043
- --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--border--nested--Left);
23044
- --pf-c-tree-view--m-compact__list-item--before--Top: var(--pf-c-tree-view--m-compact__list-item--nested--before--Top);
23045
- --pf-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height);
23068
+ .pf-c-wizard__header {
23069
+ color: var(--pf-global--Color--100);
23070
+ position: relative;
23071
+ z-index: var(--pf-c-wizard__header--ZIndex);
23072
+ padding: var(--pf-c-wizard__header--PaddingTop) var(--pf-c-wizard__header--PaddingRight) var(--pf-c-wizard__header--PaddingBottom) var(--pf-c-wizard__header--PaddingLeft);
23073
+ background-color: var(--pf-c-wizard__header--BackgroundColor);
23046
23074
  }
23047
23075
 
23048
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node-container {
23049
- padding: var(--pf-c-tree-view--m-compact__node-container--nested--PaddingTop) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingRight) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingBottom) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingLeft);
23050
- background-color: var(--pf-c-tree-view--m-compact__node-container--nested--BackgroundColor);
23076
+ .pf-c-wizard__header .pf-c-wizard__close {
23077
+ position: absolute;
23078
+ top: var(--pf-c-wizard__close--Top);
23079
+ right: var(--pf-c-wizard__close--Right);
23080
+ font-size: var(--pf-c-wizard__close--FontSize);
23051
23081
  }
23052
23082
 
23053
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node-toggle {
23054
- margin-right: var(--pf-c-tree-view--m-compact__node-toggle--nested--MarginRight);
23055
- margin-left: var(--pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft);
23083
+ .pf-c-wizard__title {
23084
+ padding-right: var(--pf-c-wizard__title--PaddingRight);
23085
+ word-wrap: break-word;
23056
23086
  }
23057
23087
 
23058
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__node-container {
23059
- padding: var(--pf-c-tree-view--m-compact__node-container--PaddingTop) var(--pf-c-tree-view--m-compact__node-container--PaddingRight) var(--pf-c-tree-view--m-compact__node-container--PaddingBottom) var(--pf-c-tree-view--m-compact__node-container--PaddingLeft);
23088
+ .pf-c-wizard__description {
23089
+ display: none;
23090
+ padding-top: var(--pf-c-wizard__description--PaddingTop);
23091
+ color: var(--pf-c-wizard__description--Color);
23092
+ visibility: hidden;
23060
23093
  }
23061
23094
 
23062
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:not([aria-expanded]) > .pf-c-tree-view__content > .pf-c-tree-view__node,
23063
- .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:not([aria-expanded]) > .pf-c-tree-view__content > .pf-c-tree-view__node > .pf-c-tree-view__node-container {
23064
- cursor: default;
23095
+ @media screen and (min-width: 992px) {
23096
+ .pf-c-wizard__description {
23097
+ display: block;
23098
+ visibility: visible;
23099
+ }
23100
+ }
23101
+ .pf-c-wizard__toggle {
23102
+ position: relative;
23103
+ z-index: var(--pf-c-wizard__toggle--ZIndex);
23104
+ display: flex;
23105
+ justify-content: space-between;
23106
+ width: 100%;
23107
+ padding: var(--pf-c-wizard__toggle--PaddingTop) var(--pf-c-wizard__toggle--PaddingRight) var(--pf-c-wizard__toggle--PaddingBottom) var(--pf-c-wizard__toggle--PaddingLeft);
23108
+ background-color: var(--pf-c-wizard__toggle--BackgroundColor);
23109
+ border: 0;
23110
+ box-shadow: var(--pf-c-wizard__toggle--BoxShadow);
23065
23111
  }
23066
23112
 
23067
- .pf-c-tree-view.pf-m-compact.pf-m-no-background {
23068
- --pf-c-tree-view--m-compact__node--before--Top: var(--pf-c-tree-view--m-compact--m-no-background__node--before--Top);
23113
+ @media screen and (min-width: 992px) {
23114
+ .pf-c-wizard__toggle {
23115
+ display: none;
23116
+ visibility: hidden;
23117
+ }
23118
+ }
23119
+ .pf-c-wizard__toggle.pf-m-expanded {
23120
+ --pf-c-wizard__toggle--BoxShadow: none;
23121
+ border-bottom: var(--pf-c-wizard__toggle--m-expanded--BorderBottomWidth) solid var(--pf-c-wizard__toggle--m-expanded--BorderBottomColor);
23069
23122
  }
23070
23123
 
23071
- .pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23072
- --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop);
23073
- --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom);
23124
+ .pf-c-wizard__toggle.pf-m-expanded .pf-c-wizard__toggle-icon {
23125
+ transform: rotate(var(--pf-c-wizard__toggle--m-expanded__toggle-icon--Rotate));
23074
23126
  }
23075
23127
 
23076
- .pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23077
- --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--m-no-background--border--nested--Left);
23078
- --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft);
23128
+ .pf-c-wizard__toggle-list {
23129
+ position: relative;
23130
+ display: flex;
23131
+ flex-wrap: wrap;
23132
+ align-items: baseline;
23133
+ margin-right: var(--pf-c-wizard__toggle-list--MarginRight);
23134
+ margin-bottom: var(--pf-c-wizard__toggle-list--MarginBottom);
23135
+ list-style: none;
23079
23136
  }
23080
23137
 
23081
- .pf-c-tree-view.pf-m-no-background {
23082
- --pf-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-c-tree-view--m-no-background__node-container--BackgroundColor);
23138
+ .pf-c-wizard__toggle-list-item {
23139
+ margin-bottom: var(--pf-c-wizard__toggle-list-item--MarginBottom);
23140
+ text-align: left;
23141
+ word-break: break-word;
23083
23142
  }
23084
23143
 
23085
- .pf-c-tree-view__node-toggle-icon {
23086
- display: inline-block;
23087
- min-width: var(--pf-c-tree-view__node-toggle-icon--MinWidth);
23088
- text-align: center;
23089
- transition: var(--pf-c-tree-view__node-toggle-icon--Transition);
23090
- transform: rotate(var(--pf-c-tree-view__node-toggle-icon--Rotate));
23144
+ .pf-c-wizard__toggle-list-item:not(:last-child) {
23145
+ margin-right: var(--pf-c-wizard__toggle-list-item--not-last-child--MarginRight);
23091
23146
  }
23092
23147
 
23093
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23094
- --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__node-toggle-icon--base--Rotate);
23095
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color--base);
23148
+ .pf-c-wizard__toggle-num {
23149
+ --pf-c-wizard__nav-link--before--Top: var(--pf-c-wizard__toggle-num--before--Top);
23096
23150
  }
23097
23151
 
23098
- .pf-c-tree-view__list-item.pf-m-expanded {
23099
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__list-item--m-expanded__node-toggle--Color);
23100
- --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate);
23152
+ .pf-c-wizard__toggle-separator {
23153
+ margin-left: var(--pf-c-wizard__toggle-separator--MarginLeft);
23154
+ color: var(--pf-c-wizard__toggle-separator--Color);
23101
23155
  }
23102
23156
 
23103
- .pf-c-tree-view__node,
23104
- .pf-c-tree-view__node-container {
23105
- flex: 1 1;
23106
- align-items: flex-start;
23107
- min-width: 0;
23108
- text-align: left;
23109
- cursor: pointer;
23110
- border: 0;
23157
+ .pf-c-wizard__toggle-icon {
23158
+ line-height: var(--pf-c-wizard__toggle-icon--LineHeight);
23111
23159
  }
23112
23160
 
23113
- .pf-c-tree-view__node {
23161
+ .pf-c-wizard__outer-wrap {
23114
23162
  position: relative;
23115
23163
  display: flex;
23116
- padding: var(--pf-c-tree-view__node--PaddingTop) var(--pf-c-tree-view__node--PaddingRight) var(--pf-c-tree-view__node--PaddingBottom) var(--pf-c-tree-view__node--PaddingLeft);
23117
- color: var(--pf-c-tree-view__node--Color);
23164
+ flex-direction: column;
23165
+ flex-grow: 1;
23166
+ min-height: var(--pf-c-wizard__outer-wrap--MinHeight);
23167
+ background-color: var(--pf-c-wizard__outer-wrap--BackgroundColor);
23118
23168
  }
23119
23169
 
23120
- .pf-c-tree-view__node.pf-m-current {
23121
- --pf-c-tree-view__node--Color: var(--pf-c-tree-view__node--m-current--Color);
23122
- font-weight: var(--pf-c-tree-view__node--m-current--FontWeight);
23170
+ @media screen and (min-width: 992px) {
23171
+ .pf-c-wizard__outer-wrap {
23172
+ padding-left: var(--pf-c-wizard__outer-wrap--lg--PaddingLeft);
23173
+ }
23174
+ }
23175
+ .pf-c-wizard__inner-wrap {
23176
+ position: relative;
23177
+ display: flex;
23178
+ flex-direction: column;
23179
+ flex-grow: 1;
23180
+ min-height: 0;
23123
23181
  }
23124
23182
 
23125
- .pf-c-tree-view__node:focus {
23126
- background-color: var(--pf-c-tree-view__node--focus--BackgroundColor);
23183
+ @media screen and (min-width: 992px) {
23184
+ .pf-c-wizard__inner-wrap {
23185
+ position: static;
23186
+ }
23187
+ }
23188
+ .pf-c-wizard__nav {
23189
+ position: absolute;
23190
+ top: 0;
23191
+ left: 0;
23192
+ z-index: var(--pf-c-wizard__nav--ZIndex);
23193
+ display: none;
23194
+ width: var(--pf-c-wizard__nav--Width);
23195
+ max-height: 100%;
23196
+ overflow-y: auto;
23197
+ -webkit-overflow-scrolling: touch;
23198
+ visibility: hidden;
23199
+ background-color: var(--pf-c-wizard__nav--BackgroundColor);
23200
+ box-shadow: var(--pf-c-wizard__nav--BoxShadow);
23127
23201
  }
23128
23202
 
23129
- .pf-c-tree-view__node .pf-c-tree-view__node-count {
23130
- margin-left: var(--pf-c-tree-view__node-count--MarginLeft);
23203
+ .pf-c-wizard__nav.pf-m-expanded {
23204
+ display: block;
23205
+ visibility: visible;
23131
23206
  }
23132
23207
 
23133
- .pf-c-tree-view__node .pf-c-tree-view__node-count .pf-c-badge.pf-m-read {
23134
- --pf-c-badge--m-read--BackgroundColor: var(--pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor);
23208
+ @media screen and (min-width: 992px) {
23209
+ .pf-c-wizard__nav {
23210
+ display: block;
23211
+ height: 100%;
23212
+ visibility: visible;
23213
+ border-right: var(--pf-c-wizard__nav--lg--BorderRightWidth) solid var(--pf-c-wizard__nav--lg--BorderRightColor);
23214
+ }
23215
+ }
23216
+ .pf-c-wizard__nav-list {
23217
+ padding-top: var(--pf-c-wizard__nav-list--PaddingTop);
23218
+ padding-right: var(--pf-c-wizard__nav-list--PaddingRight);
23219
+ padding-bottom: var(--pf-c-wizard__nav-list--PaddingBottom);
23220
+ padding-left: var(--pf-c-wizard__nav-list--PaddingLeft);
23221
+ list-style: none;
23222
+ counter-reset: wizard-nav-count;
23135
23223
  }
23136
23224
 
23137
- .pf-c-tree-view__node:not(.pf-m-selectable):hover, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:hover {
23138
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--hover--Color);
23225
+ .pf-c-wizard__nav-list .pf-c-wizard__nav-list {
23226
+ padding: 0;
23227
+ margin-top: var(--pf-c-wizard__nav-list--nested--MarginTop);
23228
+ margin-left: var(--pf-c-wizard__nav-list--nested--MarginLeft);
23139
23229
  }
23140
23230
 
23141
- .pf-c-tree-view__node:not(.pf-m-selectable):focus, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:focus {
23142
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--focus--Color);
23231
+ .pf-c-wizard__nav-list .pf-c-wizard__nav-list .pf-c-wizard__nav-link::before {
23232
+ content: none;
23143
23233
  }
23144
23234
 
23145
- .pf-c-tree-view__node:not(.pf-m-selectable):active, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:active {
23146
- --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--active--Color);
23235
+ .pf-c-wizard__nav-list .pf-c-wizard__nav-list .pf-c-wizard__nav-link.pf-m-current {
23236
+ font-weight: var(--pf-c-wizard__nav-list__nav-list__nav-link--m-current--FontWeight);
23147
23237
  }
23148
23238
 
23149
- .pf-c-tree-view__node-container {
23150
- display: var(--pf-c-tree-view__node-container--Display);
23151
- flex-grow: 1;
23239
+ .pf-c-wizard__nav-item + .pf-c-wizard__nav-item {
23240
+ margin-top: var(--pf-c-wizard__nav-item--MarginTop);
23152
23241
  }
23153
23242
 
23154
- .pf-c-tree-view__node-content {
23243
+ .pf-c-wizard__nav-item.pf-m-expandable > .pf-c-wizard__nav-link {
23155
23244
  display: flex;
23156
- flex-direction: column;
23157
- overflow: var(--pf-c-tree-view__node-content--Overflow);
23158
23245
  }
23159
23246
 
23160
- .pf-c-tree-view__node-content > * + * {
23161
- margin-top: var(--pf-c-tree-view__node-content--RowGap);
23247
+ .pf-c-wizard__nav-item.pf-m-expandable > .pf-c-wizard__nav-list {
23248
+ display: none;
23249
+ visibility: hidden;
23162
23250
  }
23163
23251
 
23164
- .pf-c-tree-view__node-check {
23165
- margin-right: var(--pf-c-tree-view__node-check--MarginRight);
23252
+ .pf-c-wizard__nav-item.pf-m-expanded > .pf-c-wizard__nav-list {
23253
+ display: block;
23254
+ visibility: visible;
23166
23255
  }
23167
23256
 
23168
- .pf-c-tree-view__node-toggle {
23169
- position: var(--pf-c-tree-view__node-toggle--Position);
23170
- top: var(--pf-c-tree-view__list-item__list-item__node-toggle--Top);
23171
- left: var(--pf-c-tree-view__list-item__list-item__node-toggle--Left);
23172
- display: inline-flex;
23173
- align-items: center;
23174
- justify-content: center;
23175
- padding: var(--pf-c-tree-view__node-toggle-button--PaddingTop) var(--pf-c-tree-view__node-toggle-button--PaddingRight) var(--pf-c-tree-view__node-toggle-button--PaddingBottom) var(--pf-c-tree-view__node-toggle-button--PaddingLeft);
23176
- margin-top: var(--pf-c-tree-view__node-toggle-button--MarginTop);
23177
- margin-bottom: var(--pf-c-tree-view__node-toggle-button--MarginBottom);
23178
- color: var(--pf-c-tree-view__node-toggle--Color);
23179
- border: 0;
23180
- transform: translateX(var(--pf-c-tree-view__list-item__list-item__node-toggle--TranslateX));
23257
+ .pf-c-wizard__nav-item.pf-m-expanded > .pf-c-wizard__nav-link {
23258
+ --pf-c-wizard__nav-link-toggle-icon--Rotate: var(--pf-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate);
23181
23259
  }
23182
23260
 
23183
- .pf-c-tree-view__node-title.pf-m-truncate,
23184
- .pf-c-tree-view__node-text.pf-m-truncate {
23185
- --pf-c-tree-view__node-content--Overflow: hidden;
23186
- overflow: hidden;
23187
- text-overflow: ellipsis;
23188
- white-space: nowrap;
23261
+ .pf-c-wizard__nav-link {
23262
+ position: relative;
23263
+ display: inline-block;
23264
+ width: 100%;
23265
+ color: var(--pf-c-wizard__nav-link--Color);
23266
+ text-align: left;
23267
+ text-decoration: var(--pf-c-wizard__nav-link--TextDecoration);
23268
+ word-break: break-word;
23269
+ border: 0;
23189
23270
  }
23190
23271
 
23191
- .pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-title,
23192
- .pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-text {
23193
- --pf-c-tree-view__node-content--Overflow: hidden;
23194
- overflow: hidden;
23195
- text-overflow: ellipsis;
23196
- white-space: nowrap;
23272
+ .pf-c-wizard__toggle-num, .pf-c-wizard__nav-link::before {
23273
+ position: absolute;
23274
+ top: var(--pf-c-wizard__nav-link--before--Top);
23275
+ left: 0;
23276
+ display: inline-flex;
23277
+ align-items: center;
23278
+ justify-content: center;
23279
+ width: var(--pf-c-wizard__nav-link--before--Width);
23280
+ height: var(--pf-c-wizard__nav-link--before--Height);
23281
+ font-size: var(--pf-c-wizard__nav-link--before--FontSize);
23282
+ line-height: 1;
23283
+ color: var(--pf-c-wizard__nav-link--before--Color);
23284
+ background-color: var(--pf-c-wizard__nav-link--before--BackgroundColor);
23285
+ border-radius: var(--pf-c-wizard__nav-link--before--BorderRadius);
23286
+ transform: translateX(var(--pf-c-wizard__nav-link--before--TranslateX));
23197
23287
  }
23198
23288
 
23199
- .pf-c-tree-view__node-text {
23200
- font-weight: inherit;
23201
- color: inherit;
23202
- text-align: left;
23203
- border: 0;
23289
+ .pf-c-wizard__nav-link::before {
23290
+ top: 0;
23291
+ content: counter(wizard-nav-count);
23292
+ counter-increment: wizard-nav-count;
23204
23293
  }
23205
23294
 
23206
- label.pf-c-tree-view__node-text {
23207
- cursor: pointer;
23295
+ .pf-c-wizard__nav-link:hover {
23296
+ --pf-c-wizard__nav-link--Color: var(--pf-c-wizard__nav-link--hover--Color);
23297
+ --pf-c-wizard__nav-link-toggle--Color: var(--pf-c-wizard__nav-link--hover__nav-link-toggle-icon--Color);
23208
23298
  }
23209
23299
 
23210
- .pf-c-tree-view__node-title {
23211
- font-weight: var(--pf-c-tree-view__node-title--FontWeight);
23300
+ .pf-c-wizard__nav-link:focus {
23301
+ --pf-c-wizard__nav-link--Color: var(--pf-c-wizard__nav-link--focus--Color);
23302
+ --pf-c-wizard__nav-link-toggle--Color: var(--pf-c-wizard__nav-link--focus__nav-link-toggle-icon--Color);
23212
23303
  }
23213
23304
 
23214
- .pf-c-tree-view__search {
23215
- padding: var(--pf-c-tree-view__search--PaddingTop) var(--pf-c-tree-view__search--PaddingRight) var(--pf-c-tree-view__search--PaddingBottom) var(--pf-c-tree-view__search--PaddingLeft);
23305
+ .pf-c-wizard__nav-link.pf-m-current {
23306
+ --pf-c-wizard__nav-link--Color: var(--pf-c-wizard__nav-link--m-current--Color);
23307
+ font-weight: var(--pf-c-wizard__nav-link--m-current--FontWeight);
23216
23308
  }
23217
23309
 
23218
- .pf-c-tree-view__node-icon {
23219
- padding-right: var(--pf-c-tree-view__node-icon--PaddingRight);
23220
- color: var(--pf-c-tree-view__node-icon--Color);
23310
+ .pf-c-wizard__toggle-num, .pf-c-wizard__nav-link.pf-m-current::before {
23311
+ --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-c-wizard__nav-link--m-current--before--BackgroundColor);
23312
+ --pf-c-wizard__nav-link--before--Color: var(--pf-c-wizard__nav-link--m-current--before--Color);
23221
23313
  }
23222
23314
 
23223
- .pf-c-tree-view__content {
23224
- display: flex;
23225
- align-items: center;
23315
+ .pf-c-wizard__nav-link:disabled, .pf-c-wizard__nav-link.pf-m-disabled {
23316
+ --pf-c-wizard__nav-link--Color: var(--pf-c-wizard__nav-link--m-disabled--Color);
23317
+ pointer-events: none;
23226
23318
  }
23227
23319
 
23228
- .pf-c-tree-view__content:hover,
23229
- .pf-c-tree-view__content:focus-within {
23230
- background-color: var(--pf-c-tree-view__node--hover--BackgroundColor);
23320
+ .pf-c-wizard__nav-link:disabled::before, .pf-c-wizard__nav-link.pf-m-disabled::before {
23321
+ --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-c-wizard__nav-link--m-disabled--before--BackgroundColor);
23322
+ --pf-c-wizard__nav-link--before--Color: var(--pf-c-wizard__nav-link--m-disabled--before--Color);
23231
23323
  }
23232
23324
 
23233
- .pf-c-tree-view__action {
23234
- margin-left: var(--pf-c-tree-view__action--MarginLeft);
23235
- color: var(--pf-c-tree-view__action--Color);
23236
- border: 0;
23325
+ .pf-c-wizard__nav-link-text {
23326
+ flex-grow: 1;
23237
23327
  }
23238
23328
 
23239
- .pf-c-tree-view__action:hover {
23240
- --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--hover--Color);
23329
+ .pf-c-wizard__nav-link-toggle {
23330
+ padding-right: var(--pf-c-wizard__nav-link-toggle--PaddingRight);
23331
+ padding-left: var(--pf-c-wizard__nav-link-toggle--PaddingLeft);
23332
+ color: var(--pf-c-wizard__nav-link-toggle--Color);
23241
23333
  }
23242
23334
 
23243
- .pf-c-tree-view__action:focus {
23244
- --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--focus--Color);
23245
- background-color: var(--pf-c-tree-view__action--focus--BackgroundColor);
23335
+ .pf-c-wizard__nav-link-toggle-icon {
23336
+ display: inline-block;
23337
+ transition: var(--pf-c-wizard__nav-link-toggle-icon--Transition);
23338
+ transform: rotate(var(--pf-c-wizard__nav-link-toggle-icon--Rotate));
23246
23339
  }
23247
23340
 
23248
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23249
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23250
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 1 + var(--pf-c-tree-view__node--indent--base));
23251
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23341
+ .pf-c-wizard__main {
23342
+ z-index: var(--pf-c-wizard__main--ZIndex);
23343
+ flex: 1 1 auto;
23344
+ overflow-x: hidden;
23345
+ overflow-y: auto;
23346
+ word-break: break-word;
23252
23347
  }
23253
23348
 
23254
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23255
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23256
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 2 + var(--pf-c-tree-view__node--indent--base));
23257
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23258
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 1 + var(--pf-c-tree-view--m-compact__node--indent--base));
23259
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23260
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 1 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23261
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23349
+ .pf-c-wizard__main-body {
23350
+ padding: var(--pf-c-wizard__main-body--PaddingTop) var(--pf-c-wizard__main-body--PaddingRight) var(--pf-c-wizard__main-body--PaddingBottom) var(--pf-c-wizard__main-body--PaddingLeft);
23262
23351
  }
23263
23352
 
23264
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23265
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23266
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 3 + var(--pf-c-tree-view__node--indent--base));
23267
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23268
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 2 + var(--pf-c-tree-view--m-compact__node--indent--base));
23269
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23270
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 2 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23271
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23353
+ .pf-c-wizard__main-body.pf-m-no-padding {
23354
+ padding: 0;
23272
23355
  }
23273
23356
 
23274
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23275
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23276
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 4 + var(--pf-c-tree-view__node--indent--base));
23277
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23278
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 3 + var(--pf-c-tree-view--m-compact__node--indent--base));
23279
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23280
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 3 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23281
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23357
+ .pf-c-wizard__footer {
23358
+ position: relative;
23359
+ z-index: var(--pf-c-wizard__footer--ZIndex);
23360
+ display: flex;
23361
+ flex-wrap: wrap;
23362
+ flex-shrink: 0;
23363
+ padding: var(--pf-c-wizard__footer--PaddingTop) var(--pf-c-wizard__footer--PaddingRight) var(--pf-c-wizard__footer--PaddingBottom) var(--pf-c-wizard__footer--PaddingLeft);
23364
+ background-color: var(--pf-c-wizard__footer--BackgroundColor);
23282
23365
  }
23283
23366
 
23284
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23285
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23286
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 5 + var(--pf-c-tree-view__node--indent--base));
23287
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23288
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 4 + var(--pf-c-tree-view--m-compact__node--indent--base));
23289
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23290
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 4 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23291
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23367
+ .pf-c-wizard__footer > * {
23368
+ margin-bottom: var(--pf-c-wizard__footer--child--MarginBottom);
23292
23369
  }
23293
23370
 
23294
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23295
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23296
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 6 + var(--pf-c-tree-view__node--indent--base));
23297
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23298
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 5 + var(--pf-c-tree-view--m-compact__node--indent--base));
23299
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23300
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 5 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23301
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23371
+ .pf-c-wizard__footer > *:not(:last-child) {
23372
+ margin-right: var(--pf-c-wizard__footer--child--MarginRight);
23302
23373
  }
23303
23374
 
23304
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23305
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23306
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 7 + var(--pf-c-tree-view__node--indent--base));
23307
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23308
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 6 + var(--pf-c-tree-view--m-compact__node--indent--base));
23309
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23310
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 6 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23311
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23375
+ .pf-c-page__main-wizard .pf-c-wizard__footer, .pf-c-modal-box .pf-c-wizard__footer, .pf-c-drawer > .pf-c-wizard__footer {
23376
+ box-shadow: var(--pf-c-wizard__footer--BoxShadow);
23312
23377
  }
23313
23378
 
23314
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23315
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23316
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 8 + var(--pf-c-tree-view__node--indent--base));
23317
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23318
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 7 + var(--pf-c-tree-view--m-compact__node--indent--base));
23319
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23320
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 7 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23321
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23379
+ .pf-c-wizard__footer-cancel {
23380
+ margin-left: var(--pf-c-wizard__footer-cancel--MarginLeft);
23322
23381
  }
23323
23382
 
23324
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23325
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23326
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 9 + var(--pf-c-tree-view__node--indent--base));
23327
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23328
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 8 + var(--pf-c-tree-view--m-compact__node--indent--base));
23329
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23330
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 8 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23331
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23383
+ :where(.pf-theme-dark) .pf-c-wizard__header {
23384
+ --pf-global--Color--100: #e0e0e0;
23385
+ --pf-global--Color--200: #aaabac;
23386
+ --pf-global--BorderColor--100: #444548;
23387
+ --pf-global--primary-color--100: #1fa7f8;
23388
+ --pf-global--link--Color: #1fa7f8;
23389
+ --pf-global--link--Color--hover: #73bcf7;
23390
+ --pf-global--BackgroundColor--100: #1b1d21;
23332
23391
  }
23333
23392
 
23334
- .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23335
- --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23336
- --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 10 + var(--pf-c-tree-view__node--indent--base));
23337
- --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23338
- --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 9 + var(--pf-c-tree-view--m-compact__node--indent--base));
23339
- --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23340
- --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 9 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23341
- --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23393
+ :where(.pf-theme-dark) .pf-c-wizard__header .pf-c-card {
23394
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
23342
23395
  }
23343
23396
 
23344
- :where(.pf-theme-dark) .pf-c-tree-view {
23345
- --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--300);
23346
- --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--BackgroundColor--300);
23397
+ :where(.pf-theme-dark) .pf-c-wizard__header .pf-c-button {
23398
+ --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
23399
+ --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
23400
+ --pf-c-button--m-primary--focus--Color: var(--pf-global--Color--light-100);
23401
+ --pf-c-button--m-primary--active--Color: var(--pf-global--Color--light-100);
23402
+ --pf-c-button--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
23403
+ --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--primary-color--200);
23404
+ --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--primary-color--200);
23405
+ --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
23406
+ --pf-c-button--m-secondary--Color: var(--pf-global--primary-color--100);
23407
+ --pf-c-button--m-secondary--hover--Color: var(--pf-global--primary-color--100);
23408
+ --pf-c-button--m-secondary--focus--Color: var(--pf-global--primary-color--100);
23409
+ --pf-c-button--m-secondary--active--Color: var(--pf-global--primary-color--100);
23347
23410
  }
23348
23411
 
23349
- .pf-c-wizard__header {
23350
- --pf-global--Color--100: var(--pf-global--Color--light-100);
23351
- --pf-global--Color--200: var(--pf-global--Color--light-200);
23352
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
23353
- --pf-global--primary-color--100: var(--pf-global--primary-color--light-100);
23354
- --pf-global--link--Color: var(--pf-global--link--Color--light);
23355
- --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
23356
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
23412
+ :where(.pf-theme-dark) .pf-c-wizard {
23413
+ --pf-c-wizard__header--BackgroundColor: var(--pf-global--palette--black-1000);
23414
+ --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-global--palette--black-500);
23415
+ --pf-c-wizard__nav-link--m-disabled--Color: var(--pf-global--disabled-color--300);
23416
+ --pf-c-wizard__nav-link--m-disabled--before--Color: var(--pf-global--disabled-color--300);
23357
23417
  }
23358
23418
 
23359
- .pf-c-wizard__header .pf-c-card {
23360
- --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
23419
+ :where(.pf-theme-dark) .pf-c-wizard__header {
23420
+ color: var(--pf-global--Color--100);
23361
23421
  }
23362
23422
 
23363
- .pf-c-wizard__header .pf-c-button {
23364
- --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
23365
- --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
23366
- --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
23367
- --pf-c-button--m-primary--active--Color: var(--pf-global--primary-color--dark-100);
23368
- --pf-c-button--m-primary--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
23369
- --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
23370
- --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
23371
- --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
23372
- --pf-c-button--m-secondary--Color: var(--pf-global--Color--light-100);
23373
- --pf-c-button--m-secondary--hover--Color: var(--pf-global--Color--light-100);
23374
- --pf-c-button--m-secondary--focus--Color: var(--pf-global--Color--light-100);
23375
- --pf-c-button--m-secondary--active--Color: var(--pf-global--Color--light-100);
23376
- --pf-c-button--m-secondary--BorderColor: var(--pf-global--Color--light-100);
23377
- --pf-c-button--m-secondary--hover--BorderColor: var(--pf-global--Color--light-100);
23378
- --pf-c-button--m-secondary--focus--BorderColor: var(--pf-global--Color--light-100);
23379
- --pf-c-button--m-secondary--active--BorderColor: var(--pf-global--Color--light-100);
23423
+ .pf-c-tree-view {
23424
+ --pf-c-tree-view--PaddingTop: var(--pf-global--spacer--sm);
23425
+ --pf-c-tree-view--PaddingBottom: var(--pf-global--spacer--sm);
23426
+ --pf-c-tree-view__node--indent--base: calc(var(--pf-global--spacer--md) * 2 + var(--pf-c-tree-view__node-toggle-icon--MinWidth));
23427
+ --pf-c-tree-view__node--nested-indent--base: calc(var(--pf-c-tree-view__node--indent--base) - var(--pf-global--spacer--md));
23428
+ --pf-c-tree-view__node--PaddingTop--base: var(--pf-global--spacer--sm);
23429
+ --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view__node--PaddingTop--base);
23430
+ --pf-c-tree-view__node--PaddingRight: var(--pf-global--spacer--sm);
23431
+ --pf-c-tree-view__node--PaddingBottom: var(--pf-global--spacer--sm);
23432
+ --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view__node--indent--base);
23433
+ --pf-c-tree-view__node--Color: var(--pf-global--Color--100);
23434
+ --pf-c-tree-view__node--m-current--Color: var(--pf-global--link--Color);
23435
+ --pf-c-tree-view__node--m-current--FontWeight: var(--pf-global--FontWeight--bold);
23436
+ --pf-c-tree-view__node-container--Display: contents;
23437
+ --pf-c-tree-view__node-content--RowGap: var(--pf-global--spacer--sm);
23438
+ --pf-c-tree-view__node-content--Overflow: visible;
23439
+ --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--200);
23440
+ --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--palette--black-200);
23441
+ --pf-c-tree-view__list-item__list-item__node-toggle--Top: var(--pf-c-tree-view__node--PaddingTop--base);
23442
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23443
+ --pf-c-tree-view__list-item__list-item__node-toggle--TranslateX: -100%;
23444
+ --pf-c-tree-view__node-toggle--Position: absolute;
23445
+ --pf-c-tree-view__node-toggle--Color--base: var(--pf-global--Color--200);
23446
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color--base);
23447
+ --pf-c-tree-view__node-toggle--hover--Color: var(--pf-global--Color--100);
23448
+ --pf-c-tree-view__node-toggle--focus--Color: var(--pf-global--Color--100);
23449
+ --pf-c-tree-view__node-toggle--active--Color: var(--pf-global--Color--100);
23450
+ --pf-c-tree-view__list-item--m-expanded__node-toggle--Color: var(--pf-global--Color--100);
23451
+ --pf-c-tree-view__node-toggle-icon--MinWidth: var(--pf-global--FontSize--md);
23452
+ --pf-c-tree-view__node-toggle-icon--Transition: transform var(--pf-global--TransitionDuration) var(--pf-global--TimingFunction);
23453
+ --pf-c-tree-view__node-toggle-button--PaddingTop: var(--pf-global--spacer--form-element);
23454
+ --pf-c-tree-view__node-toggle-button--PaddingRight: var(--pf-global--spacer--md);
23455
+ --pf-c-tree-view__node-toggle-button--PaddingBottom: var(--pf-global--spacer--form-element);
23456
+ --pf-c-tree-view__node-toggle-button--PaddingLeft: var(--pf-global--spacer--md);
23457
+ --pf-c-tree-view__node-toggle-button--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
23458
+ --pf-c-tree-view__node-toggle-button--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
23459
+ --pf-c-tree-view__node-check--MarginRight: var(--pf-global--spacer--sm);
23460
+ --pf-c-tree-view__node-count--MarginLeft: var(--pf-global--spacer--sm);
23461
+ --pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
23462
+ --pf-c-tree-view__search--PaddingTop: var(--pf-global--spacer--sm);
23463
+ --pf-c-tree-view__search--PaddingRight: var(--pf-global--spacer--sm);
23464
+ --pf-c-tree-view__search--PaddingBottom: var(--pf-global--spacer--sm);
23465
+ --pf-c-tree-view__search--PaddingLeft: var(--pf-global--spacer--sm);
23466
+ --pf-c-tree-view__node-icon--PaddingRight: var(--pf-global--spacer--sm);
23467
+ --pf-c-tree-view__node-icon--Color: var(--pf-global--icon--Color--light);
23468
+ --pf-c-tree-view__node-toggle-icon--base--Rotate: 0;
23469
+ --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__node-toggle-icon--base--Rotate);
23470
+ --pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate: 90deg;
23471
+ --pf-c-tree-view__node-text--max-lines: 1;
23472
+ --pf-c-tree-view__node-title--FontWeight: var(--pf-global--FontWeight--bold);
23473
+ --pf-c-tree-view__action--MarginLeft: var(--pf-global--spacer--md);
23474
+ --pf-c-tree-view__action--focus--BackgroundColor: var(--pf-global--BackgroundColor--200);
23475
+ --pf-c-tree-view__action--Color: var(--pf-global--icon--Color--light);
23476
+ --pf-c-tree-view__action--hover--Color: var(--pf-global--icon--Color--dark);
23477
+ --pf-c-tree-view__action--focus--Color: var(--pf-global--icon--Color--dark);
23478
+ --pf-c-tree-view--m-guides--guide--Left: var(--pf-c-tree-view--m-guides--guide-left--base);
23479
+ --pf-c-tree-view--m-guides--guide-color--base: var(--pf-global--BorderColor--100);
23480
+ --pf-c-tree-view--m-guides--guide-width--base: var(--pf-global--BorderWidth--sm);
23481
+ --pf-c-tree-view--m-guides--guide-left--base: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides__list-node--guide-width--base));
23482
+ --pf-c-tree-view--m-guides--guide-left--base--offset: calc(var(--pf-c-tree-view__list-item__list-item__node-toggle--Left) + var(--pf-c-tree-view__node-toggle-icon--MinWidth) / 2);
23483
+ --pf-c-tree-view--m-guides__list-node--guide-width--base: var(--pf-global--spacer--lg);
23484
+ --pf-c-tree-view--m-guides__list-item--before--Top: 0;
23485
+ --pf-c-tree-view--m-guides__list-item--before--Width: var(--pf-c-tree-view--m-guides--guide-width--base);
23486
+ --pf-c-tree-view--m-guides__list-item--before--Height: 100%;
23487
+ --pf-c-tree-view--m-guides__list-item--before--BackgroundColor: var(--pf-c-tree-view--m-guides--guide-color--base);
23488
+ --pf-c-tree-view--m-guides__list-item--last-child--before--Top: var(--pf-c-tree-view--m-guides__node--before--Top);
23489
+ --pf-c-tree-view--m-guides__list-item--last-child--before--Height: var(--pf-c-tree-view--m-guides__list-item--last-child--before--Top);
23490
+ --pf-c-tree-view--m-guides__list-item--ZIndex: var(--pf-global--ZIndex--xs);
23491
+ --pf-c-tree-view--m-guides__node--before--Width: 1rem;
23492
+ --pf-c-tree-view--m-guides__node--before--Height: var(--pf-c-tree-view--m-guides--guide-width--base);
23493
+ --pf-c-tree-view--m-guides__node--before--Top: 1.125rem;
23494
+ --pf-c-tree-view--m-guides__node--before--BackgroundColor: var(--pf-c-tree-view--m-guides--guide-color--base);
23495
+ --pf-c-tree-view--m-compact--base-border--Left--offset: var(--pf-global--spacer--md);
23496
+ --pf-c-tree-view--m-compact--base-border--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23497
+ --pf-c-tree-view--m-compact__node--indent--base: var(--pf-c-tree-view__node--indent--base);
23498
+ --pf-c-tree-view--m-compact__node--nested-indent--base: var(--pf-global--spacer--lg);
23499
+ --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--base-border--Left);
23500
+ --pf-c-tree-view--m-compact__node--PaddingTop: 0;
23501
+ --pf-c-tree-view--m-compact__node--PaddingBottom: 0;
23502
+ --pf-c-tree-view--m-compact__node--nested--PaddingTop: var(--pf-global--spacer--sm);
23503
+ --pf-c-tree-view--m-compact__node--nested--PaddingBottom: var(--pf-global--spacer--sm);
23504
+ --pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top: calc(var(--pf-c-tree-view--m-compact__node-container--PaddingTop));
23505
+ --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
23506
+ --pf-c-tree-view--m-compact__list-item--BorderBottomColor: var(--pf-global--BorderColor--100);
23507
+ --pf-c-tree-view--m-compact__list-item--before--Top: 0;
23508
+ --pf-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-c-tree-view--m-compact__node--before--Top);
23509
+ --pf-c-tree-view--m-compact__list-item--nested--before--Top: calc(var(--pf-c-tree-view__node--PaddingTop--base) * -1);
23510
+ --pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height: calc(var(--pf-c-tree-view--m-compact__node--before--Top) + var(--pf-c-tree-view__node--PaddingTop--base));
23511
+ --pf-c-tree-view--m-compact__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--indent--base);
23512
+ --pf-c-tree-view--m-compact__node--before--Top: calc(var(--pf-c-tree-view--m-compact__node-container--PaddingTop) + var(--pf-c-tree-view--m-compact__node--nested--PaddingTop) + 0.25rem);
23513
+ --pf-c-tree-view--m-compact__node--level-2--PaddingLeft: var(--pf-c-tree-view--m-compact__node--indent--base);
23514
+ --pf-c-tree-view--m-compact__node-toggle--nested--MarginRight: calc(var(--pf-c-tree-view__node-toggle-button--PaddingLeft) * -.5);
23515
+ --pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft: calc(var(--pf-c-tree-view__node-toggle-button--PaddingLeft) * -1.5);
23516
+ --pf-c-tree-view--m-compact__node-container--Display: flex;
23517
+ --pf-c-tree-view--m-compact__node-container--PaddingBottom--base: var(--pf-global--spacer--lg);
23518
+ --pf-c-tree-view--m-compact__node-container--PaddingTop: var(--pf-global--spacer--lg);
23519
+ --pf-c-tree-view--m-compact__node-container--PaddingRight: var(--pf-global--spacer--lg);
23520
+ --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__node-container--PaddingBottom--base);
23521
+ --pf-c-tree-view--m-compact__node-container--PaddingLeft: var(--pf-global--spacer--xs);
23522
+ --pf-c-tree-view--m-compact__node-container--nested--PaddingTop: var(--pf-global--spacer--md);
23523
+ --pf-c-tree-view--m-compact__node-container--nested--PaddingRight: var(--pf-global--spacer--lg);
23524
+ --pf-c-tree-view--m-compact__node-container--nested--PaddingBottom: var(--pf-global--spacer--md);
23525
+ --pf-c-tree-view--m-compact__node-container--nested--PaddingLeft: var(--pf-global--spacer--lg);
23526
+ --pf-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-global--BackgroundColor--200);
23527
+ --pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom: 0;
23528
+ --pf-c-tree-view--m-no-background__node-container--BackgroundColor: transparent;
23529
+ --pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset: var(--pf-global--spacer--sm);
23530
+ --pf-c-tree-view--m-compact--m-no-background--base-border--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23531
+ --pf-c-tree-view--m-compact--m-no-background__node--indent--base: var(--pf-c-tree-view__node--indent--base);
23532
+ --pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base: var(--pf-global--spacer--2xl);
23533
+ --pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop: 0;
23534
+ --pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom: 0;
23535
+ --pf-c-tree-view--m-compact--m-no-background__node--before--Top: calc(var(--pf-c-tree-view--m-compact__node-container--nested--PaddingTop) + var(--pf-c-tree-view--m-compact__node--nested--PaddingTop) + 0.25rem);
23536
+ padding-top: var(--pf-c-tree-view--PaddingTop);
23537
+ padding-bottom: var(--pf-c-tree-view--PaddingBottom);
23380
23538
  }
23381
23539
 
23382
- .pf-c-wizard {
23383
- --pf-c-wizard--Height: 100%;
23384
- --pf-c-modal-box--c-wizard--FlexBasis: 47.625rem;
23385
- --pf-c-wizard__header--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
23386
- --pf-c-wizard__header--ZIndex: var(--pf-global--ZIndex--md);
23387
- --pf-c-wizard__header--PaddingTop: var(--pf-global--spacer--lg);
23388
- --pf-c-wizard__header--PaddingRight: var(--pf-global--spacer--md);
23389
- --pf-c-wizard__header--PaddingBottom: var(--pf-global--spacer--lg);
23390
- --pf-c-wizard__header--PaddingLeft: var(--pf-global--spacer--md);
23391
- --pf-c-wizard__header--lg--PaddingRight: var(--pf-global--spacer--md);
23392
- --pf-c-wizard__header--lg--PaddingLeft: var(--pf-global--spacer--md);
23393
- --pf-c-wizard__header--xl--PaddingRight: var(--pf-global--spacer--lg);
23394
- --pf-c-wizard__header--xl--PaddingLeft: var(--pf-global--spacer--lg);
23395
- --pf-c-wizard__close--Top: calc(var(--pf-global--spacer--lg) - var(--pf-global--spacer--form-element));
23396
- --pf-c-wizard__close--Right: 0;
23397
- --pf-c-wizard__close--xl--Right: var(--pf-global--spacer--lg);
23398
- --pf-c-wizard__close--FontSize: var(--pf-global--FontSize--xl);
23399
- --pf-c-wizard__title--PaddingRight: var(--pf-global--spacer--2xl);
23400
- --pf-c-wizard__description--PaddingTop: var(--pf-global--spacer--sm);
23401
- --pf-c-wizard__description--Color: var(--pf-global--Color--light-200);
23402
- --pf-c-wizard__nav-link--Color: var(--pf-global--Color--100);
23403
- --pf-c-wizard__nav-link--TextDecoration: var(--pf-global--link--TextDecoration);
23404
- --pf-c-wizard__nav-link--hover--Color: var(--pf-global--link--Color);
23405
- --pf-c-wizard__nav-link--focus--Color: var(--pf-global--link--Color);
23406
- --pf-c-wizard__nav-link--m-current--Color: var(--pf-global--link--Color);
23407
- --pf-c-wizard__nav-link--m-current--FontWeight: var(--pf-global--FontWeight--normal);
23408
- --pf-c-wizard__nav-link--m-disabled--Color: var(--pf-global--Color--dark-200);
23409
- --pf-c-wizard__nav-list__nav-list__nav-link--m-current--FontWeight: var(--pf-global--FontWeight--normal);
23410
- --pf-c-wizard__nav-link-toggle--PaddingRight: var(--pf-global--spacer--sm);
23411
- --pf-c-wizard__nav-link-toggle--PaddingLeft: var(--pf-global--spacer--sm);
23412
- --pf-c-wizard__nav-link-toggle--Color: var(--pf-global--Color--200);
23413
- --pf-c-wizard__nav-link--hover__nav-link-toggle-icon--Color: var(--pf-global--Color--100);
23414
- --pf-c-wizard__nav-link--focus__nav-link-toggle-icon--Color: var(--pf-global--Color--100);
23415
- --pf-c-wizard__nav-link-toggle-icon--Transition: var(--pf-global--Transition);
23416
- --pf-c-wizard__nav-link-toggle-icon--Rotate: 0;
23417
- --pf-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate: 90deg;
23418
- --pf-c-wizard__nav-link--before--Width: 1.5rem;
23419
- --pf-c-wizard__nav-link--before--Height: 1.5rem;
23420
- --pf-c-wizard__nav-link--before--Top: 0;
23421
- --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-global--BackgroundColor--200);
23422
- --pf-c-wizard__nav-link--before--BorderRadius: var(--pf-global--BorderRadius--lg);
23423
- --pf-c-wizard__nav-link--before--Color: var(--pf-global--Color--100);
23424
- --pf-c-wizard__nav-link--before--FontSize: var(--pf-global--FontSize--sm);
23425
- --pf-c-wizard__nav-link--before--TranslateX: calc(-100% - var(--pf-global--spacer--sm));
23426
- --pf-c-wizard__nav-link--m-current--before--BackgroundColor: var(--pf-global--active-color--100);
23427
- --pf-c-wizard__nav-link--m-current--before--Color: var(--pf-global--Color--light-100);
23428
- --pf-c-wizard__nav-link--m-disabled--before--BackgroundColor: transparent;
23429
- --pf-c-wizard__nav-link--m-disabled--before--Color: var(--pf-global--Color--dark-200);
23430
- --pf-c-wizard__toggle--BackgroundColor: var(--pf-global--BackgroundColor--100);
23431
- --pf-c-wizard__toggle--ZIndex: var(--pf-global--ZIndex--md);
23432
- --pf-c-wizard__toggle--BoxShadow: var(--pf-global--BoxShadow--md-bottom);
23433
- --pf-c-wizard__toggle--PaddingTop: var(--pf-global--spacer--lg);
23434
- --pf-c-wizard__toggle--PaddingRight: var(--pf-global--spacer--md);
23435
- --pf-c-wizard__toggle--PaddingBottom: var(--pf-global--spacer--lg);
23436
- --pf-c-wizard__toggle--PaddingLeft: calc(var(--pf-global--spacer--md) + var(--pf-c-wizard__nav-link--before--Width) + var(--pf-global--spacer--sm));
23437
- --pf-c-wizard__toggle--m-expanded--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
23438
- --pf-c-wizard__toggle--m-expanded--BorderBottomColor: var(--pf-global--BorderColor--100);
23439
- --pf-c-wizard--m-in-page__toggle--xl--PaddingLeft: calc(var(--pf-global--spacer--xl) + var(--pf-c-wizard__nav-link--before--Width) + var(--pf-global--spacer--sm));
23440
- --pf-c-wizard__toggle-num--before--Top: 0;
23441
- --pf-c-wizard__toggle-list-item--not-last-child--MarginRight: var(--pf-global--spacer--sm);
23442
- --pf-c-wizard__toggle-list-item--MarginBottom: var(--pf-global--spacer--xs);
23443
- --pf-c-wizard__toggle-list--MarginRight: var(--pf-global--spacer--sm);
23444
- --pf-c-wizard__toggle-list--MarginBottom: calc(var(--pf-c-wizard__toggle-list-item--MarginBottom) * -1);
23445
- --pf-c-wizard__toggle-separator--MarginLeft: var(--pf-global--spacer--sm);
23446
- --pf-c-wizard__toggle-separator--Color: var(--pf-global--BorderColor--200);
23447
- --pf-c-wizard__toggle-icon--LineHeight: var(--pf-global--LineHeight--md);
23448
- --pf-c-wizard__toggle--m-expanded__toggle-icon--Rotate: 180deg;
23449
- --pf-c-wizard__nav--ZIndex: var(--pf-global--ZIndex--sm);
23450
- --pf-c-wizard__nav--BackgroundColor: var(--pf-global--BackgroundColor--100);
23451
- --pf-c-wizard__nav--BoxShadow: var(--pf-global--BoxShadow--md-bottom);
23452
- --pf-c-wizard__nav--Width: 100%;
23453
- --pf-c-wizard__nav--lg--Width: 15.625rem;
23454
- --pf-c-wizard__nav--lg--BorderRightWidth: var(--pf-global--BorderWidth--sm);
23455
- --pf-c-wizard__nav--lg--BorderRightColor: var(--pf-global--BorderColor--100);
23456
- --pf-c-wizard__nav-list--PaddingTop: var(--pf-global--spacer--lg);
23457
- --pf-c-wizard__nav-list--PaddingRight: var(--pf-global--spacer--md);
23458
- --pf-c-wizard__nav-list--PaddingBottom: var(--pf-global--spacer--lg);
23459
- --pf-c-wizard__nav-list--PaddingLeft: calc(var(--pf-global--spacer--md) + var(--pf-c-wizard__nav-link--before--Width) + var(--pf-global--spacer--sm));
23460
- --pf-c-wizard__nav-list--lg--PaddingTop: var(--pf-global--spacer--md);
23461
- --pf-c-wizard__nav-list--lg--PaddingRight: var(--pf-global--spacer--md);
23462
- --pf-c-wizard__nav-list--lg--PaddingBottom: var(--pf-global--spacer--md);
23463
- --pf-c-wizard__nav-list--xl--PaddingTop: var(--pf-global--spacer--lg);
23464
- --pf-c-wizard__nav-list--xl--PaddingRight: var(--pf-global--spacer--lg);
23465
- --pf-c-wizard__nav-list--xl--PaddingBottom: var(--pf-global--spacer--lg);
23466
- --pf-c-wizard__nav-list--xl--PaddingLeft: calc(var(--pf-global--spacer--lg) + var(--pf-c-wizard__nav-link--before--Width) + var(--pf-global--spacer--sm));
23467
- --pf-c-wizard__nav-list--nested--MarginLeft: var(--pf-global--spacer--md);
23468
- --pf-c-wizard__nav-list--nested--MarginTop: var(--pf-global--spacer--md);
23469
- --pf-c-wizard__nav-item--MarginTop: var(--pf-global--spacer--md);
23470
- --pf-c-wizard__outer-wrap--BackgroundColor: var(--pf-global--BackgroundColor--100);
23471
- --pf-c-wizard__outer-wrap--lg--PaddingLeft: var(--pf-c-wizard__nav--Width);
23472
- --pf-c-wizard__outer-wrap--MinHeight: 15.625rem;
23473
- --pf-c-wizard__main--ZIndex: var(--pf-global--ZIndex--xs);
23474
- --pf-c-wizard__main-body--PaddingTop: var(--pf-global--spacer--md);
23475
- --pf-c-wizard__main-body--PaddingRight: var(--pf-global--spacer--md);
23476
- --pf-c-wizard__main-body--PaddingBottom: var(--pf-global--spacer--md);
23477
- --pf-c-wizard__main-body--PaddingLeft: var(--pf-global--spacer--md);
23478
- --pf-c-wizard__main-body--xl--PaddingTop: var(--pf-global--spacer--lg);
23479
- --pf-c-wizard__main-body--xl--PaddingRight: var(--pf-global--spacer--lg);
23480
- --pf-c-wizard__main-body--xl--PaddingBottom: var(--pf-global--spacer--lg);
23481
- --pf-c-wizard__main-body--xl--PaddingLeft: var(--pf-global--spacer--lg);
23482
- --pf-c-wizard__footer--BackgroundColor: var(--pf-global--BackgroundColor--100);
23483
- --pf-c-wizard__footer--ZIndex: var(--pf-global--ZIndex--sm);
23484
- --pf-c-wizard__footer--PaddingTop: var(--pf-global--spacer--md);
23485
- --pf-c-wizard__footer--PaddingRight: var(--pf-global--spacer--md);
23486
- --pf-c-wizard__footer--PaddingBottom: var(--pf-global--spacer--sm);
23487
- --pf-c-wizard__footer--PaddingLeft: var(--pf-global--spacer--md);
23488
- --pf-c-wizard__footer--xl--PaddingTop: var(--pf-global--spacer--lg);
23489
- --pf-c-wizard__footer--xl--PaddingRight: var(--pf-global--spacer--lg);
23490
- --pf-c-wizard__footer--xl--PaddingBottom: var(--pf-global--spacer--md);
23491
- --pf-c-wizard__footer--xl--PaddingLeft: var(--pf-global--spacer--lg);
23492
- --pf-c-wizard__footer--BoxShadow: var(--pf-global--BoxShadow--sm-top);
23493
- --pf-c-wizard__footer--child--MarginRight: var(--pf-global--spacer--md);
23494
- --pf-c-wizard__footer--child--MarginBottom: var(--pf-global--spacer--sm);
23495
- --pf-c-wizard__footer-cancel--MarginLeft: calc(var(--pf-global--spacer--2xl) - var(--pf-c-wizard__footer--child--MarginRight));
23540
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item {
23496
23541
  position: relative;
23497
- display: flex;
23498
- flex-direction: column;
23499
- height: var(--pf-c-wizard--Height);
23500
23542
  }
23501
23543
 
23502
- @media screen and (min-width: 992px) {
23503
- .pf-c-wizard {
23504
- --pf-c-wizard__header--PaddingRight: var(--pf-c-wizard__header--lg--PaddingRight);
23505
- --pf-c-wizard__header--PaddingLeft: var(--pf-c-wizard__header--lg--PaddingLeft);
23506
- }
23507
- }
23508
- @media screen and (min-width: 1200px) {
23509
- .pf-c-wizard {
23510
- --pf-c-wizard__header--PaddingRight: var(--pf-c-wizard__header--xl--PaddingRight);
23511
- --pf-c-wizard__header--PaddingLeft: var(--pf-c-wizard__header--xl--PaddingLeft);
23512
- }
23513
- }
23514
- @media screen and (min-width: 1200px) {
23515
- .pf-c-wizard {
23516
- --pf-c-wizard__close--Right: var(--pf-c-wizard__close--xl--Right);
23517
- }
23518
- }
23519
- @media screen and (min-width: 992px) {
23520
- .pf-c-wizard {
23521
- --pf-c-wizard__nav--Width: var(--pf-c-wizard__nav--lg--Width);
23522
- --pf-c-wizard__nav--BoxShadow: none;
23523
- }
23524
- }
23525
- @media screen and (min-width: 992px) {
23526
- .pf-c-wizard {
23527
- --pf-c-wizard__nav-list--PaddingTop: var(--pf-c-wizard__nav-list--lg--PaddingTop);
23528
- --pf-c-wizard__nav-list--PaddingRight: var(--pf-c-wizard__nav-list--lg--PaddingRight);
23529
- --pf-c-wizard__nav-list--PaddingBottom: var(--pf-c-wizard__nav-list--lg--PaddingBottom);
23530
- }
23531
- }
23532
- @media screen and (min-width: 1200px) {
23533
- .pf-c-wizard {
23534
- --pf-c-wizard__nav-list--PaddingTop: var(--pf-c-wizard__nav-list--xl--PaddingTop);
23535
- --pf-c-wizard__nav-list--PaddingRight: var(--pf-c-wizard__nav-list--xl--PaddingRight);
23536
- --pf-c-wizard__nav-list--PaddingBottom: var(--pf-c-wizard__nav-list--xl--PaddingBottom);
23537
- --pf-c-wizard__nav-list--PaddingLeft: var(--pf-c-wizard__nav-list--xl--PaddingLeft);
23538
- }
23539
- }
23540
- @media screen and (min-width: 1200px) {
23541
- .pf-c-wizard {
23542
- --pf-c-wizard__main-body--PaddingTop: var(--pf-c-wizard__main-body--xl--PaddingTop);
23543
- --pf-c-wizard__main-body--PaddingRight: var(--pf-c-wizard__main-body--xl--PaddingRight);
23544
- --pf-c-wizard__main-body--PaddingBottom: var(--pf-c-wizard__main-body--xl--PaddingBottom);
23545
- --pf-c-wizard__main-body--PaddingLeft: var(--pf-c-wizard__main-body--xl--PaddingLeft);
23546
- }
23544
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
23545
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
23546
+ .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
23547
+ position: absolute;
23548
+ left: var(--pf-c-tree-view--m-guides--guide--Left);
23549
+ content: "";
23547
23550
  }
23548
- @media screen and (min-width: 1200px) {
23549
- .pf-c-wizard {
23550
- --pf-c-wizard__footer--PaddingTop: var(--pf-c-wizard__footer--xl--PaddingTop);
23551
- --pf-c-wizard__footer--PaddingRight: var(--pf-c-wizard__footer--xl--PaddingRight);
23552
- --pf-c-wizard__footer--PaddingBottom: var(--pf-c-wizard__footer--xl--PaddingBottom);
23553
- --pf-c-wizard__footer--PaddingLeft: var(--pf-c-wizard__footer--xl--PaddingLeft);
23554
- }
23551
+
23552
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before {
23553
+ top: var(--pf-c-tree-view--m-guides__list-item--before--Top);
23554
+ z-index: var(--pf-c-tree-view--m-guides__list-item--ZIndex);
23555
+ width: var(--pf-c-tree-view--m-guides__list-item--before--Width);
23556
+ height: var(--pf-c-tree-view--m-guides__list-item--before--Height);
23557
+ background-color: var(--pf-c-tree-view--m-guides__list-item--before--BackgroundColor);
23555
23558
  }
23556
- .pf-c-modal-box .pf-c-wizard {
23557
- flex: 1 1 var(--pf-c-modal-box--c-wizard--FlexBasis);
23558
- min-height: 0;
23559
+
23560
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
23561
+ top: var(--pf-c-tree-view--m-guides__node--before--Top);
23562
+ width: var(--pf-c-tree-view--m-guides__node--before--Width);
23563
+ height: var(--pf-c-tree-view--m-guides__node--before--Height);
23564
+ background-color: var(--pf-c-tree-view--m-guides__node--before--BackgroundColor);
23559
23565
  }
23560
23566
 
23561
- .pf-c-wizard > :not(.pf-c-wizard__outer-wrap):not(.pf-c-drawer) {
23562
- flex-shrink: 0;
23567
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before {
23568
+ height: var(--pf-c-tree-view--m-guides__list-item--last-child--before--Height);
23563
23569
  }
23564
23570
 
23565
- .pf-c-wizard.pf-m-finished {
23566
- --pf-c-wizard__outer-wrap--lg--PaddingLeft: 0;
23571
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23572
+ --pf-c-tree-view--m-guides--guide--Left: var(--pf-c-tree-view--m-guides--border--nested--Left);
23567
23573
  }
23568
23574
 
23569
- .pf-c-wizard.pf-m-finished .pf-c-wizard__nav,
23570
- .pf-c-wizard.pf-m-finished .pf-c-wizard__footer,
23571
- .pf-c-wizard.pf-m-finished .pf-c-wizard__toggle {
23572
- display: none;
23573
- visibility: hidden;
23575
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:last-child, .pf-c-tree-view.pf-m-guides .pf-c-tree-view__list-item:last-child {
23576
+ --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: 0;
23574
23577
  }
23575
23578
 
23576
- .pf-c-wizard__header {
23577
- color: var(--pf-global--Color--100);
23578
- position: relative;
23579
- z-index: var(--pf-c-wizard__header--ZIndex);
23580
- padding: var(--pf-c-wizard__header--PaddingTop) var(--pf-c-wizard__header--PaddingRight) var(--pf-c-wizard__header--PaddingBottom) var(--pf-c-wizard__header--PaddingLeft);
23581
- background-color: var(--pf-c-wizard__header--BackgroundColor);
23579
+ .pf-c-tree-view.pf-m-compact {
23580
+ --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact__node--PaddingTop);
23581
+ --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact__node--PaddingBottom);
23582
+ --pf-c-tree-view__node-container--Display: var(--pf-c-tree-view--m-compact__node-container--Display);
23583
+ --pf-c-tree-view__node--hover--BackgroundColor: transparent;
23584
+ --pf-c-tree-view__node--focus--BackgroundColor: transparent;
23585
+ --pf-c-tree-view__list-item__list-item__node-toggle--Top: var(--pf-c-tree-view--m-compact__list-item__list-item__node-toggle--Top);
23582
23586
  }
23583
23587
 
23584
- .pf-c-wizard__header .pf-c-wizard__close {
23585
- position: absolute;
23586
- top: var(--pf-c-wizard__close--Top);
23587
- right: var(--pf-c-wizard__close--Right);
23588
- font-size: var(--pf-c-wizard__close--FontSize);
23588
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item {
23589
+ border-bottom: var(--pf-c-tree-view--m-compact__list-item--BorderBottomWidth) solid var(--pf-c-tree-view--m-compact__list-item--BorderBottomColor);
23589
23590
  }
23590
23591
 
23591
- .pf-c-wizard__title {
23592
- padding-right: var(--pf-c-wizard__title--PaddingRight);
23593
- word-wrap: break-word;
23592
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item.pf-m-expanded {
23593
+ --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__list-item--m-expanded__node-container--PaddingBottom);
23594
23594
  }
23595
23595
 
23596
- .pf-c-wizard__description {
23597
- display: none;
23598
- padding-top: var(--pf-c-wizard__description--PaddingTop);
23599
- color: var(--pf-c-wizard__description--Color);
23600
- visibility: hidden;
23596
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23597
+ --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact__node--nested--PaddingTop);
23598
+ --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact__node--nested--PaddingBottom);
23599
+ --pf-c-tree-view__node-toggle--Position: static;
23600
+ --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--level-2--PaddingLeft);
23601
+ --pf-c-tree-view__list-item__list-item__node-toggle--TranslateX: 0;
23602
+ --pf-c-tree-view--m-compact__list-item--BorderBottomWidth: 0;
23603
+ --pf-c-tree-view--m-compact__node-container--PaddingBottom: var(--pf-c-tree-view--m-compact__node-container--PaddingBottom--base);
23601
23604
  }
23602
23605
 
23603
- @media screen and (min-width: 992px) {
23604
- .pf-c-wizard__description {
23605
- display: block;
23606
- visibility: visible;
23607
- }
23606
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before,
23607
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
23608
+ left: var(--pf-c-tree-view--m-compact--border--Left);
23608
23609
  }
23609
- .pf-c-wizard__toggle {
23610
- position: relative;
23611
- z-index: var(--pf-c-wizard__toggle--ZIndex);
23612
- display: flex;
23613
- justify-content: space-between;
23614
- width: 100%;
23615
- padding: var(--pf-c-wizard__toggle--PaddingTop) var(--pf-c-wizard__toggle--PaddingRight) var(--pf-c-wizard__toggle--PaddingBottom) var(--pf-c-wizard__toggle--PaddingLeft);
23616
- background-color: var(--pf-c-wizard__toggle--BackgroundColor);
23617
- border: 0;
23618
- box-shadow: var(--pf-c-wizard__toggle--BoxShadow);
23610
+
23611
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item::before {
23612
+ top: var(--pf-c-tree-view--m-compact__list-item--before--Top);
23619
23613
  }
23620
23614
 
23621
- @media screen and (min-width: 992px) {
23622
- .pf-c-wizard__toggle {
23623
- display: none;
23624
- visibility: hidden;
23625
- }
23615
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node::before {
23616
+ top: var(--pf-c-tree-view--m-compact__node--before--Top);
23626
23617
  }
23627
- .pf-c-wizard__toggle.pf-m-expanded {
23628
- --pf-c-wizard__toggle--BoxShadow: none;
23629
- border-bottom: var(--pf-c-wizard__toggle--m-expanded--BorderBottomWidth) solid var(--pf-c-wizard__toggle--m-expanded--BorderBottomColor);
23618
+
23619
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item:last-child::before {
23620
+ height: var(--pf-c-tree-view--m-compact__list-item--last-child--before--Height);
23630
23621
  }
23631
23622
 
23632
- .pf-c-wizard__toggle.pf-m-expanded .pf-c-wizard__toggle-icon {
23633
- transform: rotate(var(--pf-c-wizard__toggle--m-expanded__toggle-icon--Rotate));
23623
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23624
+ --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact__node--PaddingLeft);
23625
+ --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--border--nested--Left);
23626
+ --pf-c-tree-view--m-compact__list-item--before--Top: var(--pf-c-tree-view--m-compact__list-item--nested--before--Top);
23627
+ --pf-c-tree-view--m-compact__list-item--last-child--before--Height: var(--pf-c-tree-view--m-compact__list-item--nested--last-child--before--Height);
23634
23628
  }
23635
23629
 
23636
- .pf-c-wizard__toggle-list {
23637
- position: relative;
23638
- display: flex;
23639
- flex-wrap: wrap;
23640
- align-items: baseline;
23641
- margin-right: var(--pf-c-wizard__toggle-list--MarginRight);
23642
- margin-bottom: var(--pf-c-wizard__toggle-list--MarginBottom);
23643
- list-style: none;
23630
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node-container {
23631
+ padding: var(--pf-c-tree-view--m-compact__node-container--nested--PaddingTop) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingRight) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingBottom) var(--pf-c-tree-view--m-compact__node-container--nested--PaddingLeft);
23632
+ background-color: var(--pf-c-tree-view--m-compact__node-container--nested--BackgroundColor);
23644
23633
  }
23645
23634
 
23646
- .pf-c-wizard__toggle-list-item {
23647
- margin-bottom: var(--pf-c-wizard__toggle-list-item--MarginBottom);
23648
- text-align: left;
23649
- word-break: break-word;
23635
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__node-toggle {
23636
+ margin-right: var(--pf-c-tree-view--m-compact__node-toggle--nested--MarginRight);
23637
+ margin-left: var(--pf-c-tree-view--m-compact__node-toggle--nested--MarginLeft);
23650
23638
  }
23651
23639
 
23652
- .pf-c-wizard__toggle-list-item:not(:last-child) {
23653
- margin-right: var(--pf-c-wizard__toggle-list-item--not-last-child--MarginRight);
23640
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__node-container {
23641
+ padding: var(--pf-c-tree-view--m-compact__node-container--PaddingTop) var(--pf-c-tree-view--m-compact__node-container--PaddingRight) var(--pf-c-tree-view--m-compact__node-container--PaddingBottom) var(--pf-c-tree-view--m-compact__node-container--PaddingLeft);
23654
23642
  }
23655
23643
 
23656
- .pf-c-wizard__toggle-num {
23657
- --pf-c-wizard__nav-link--before--Top: var(--pf-c-wizard__toggle-num--before--Top);
23644
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:not([aria-expanded]) > .pf-c-tree-view__content > .pf-c-tree-view__node,
23645
+ .pf-c-tree-view.pf-m-compact .pf-c-tree-view__list-item:not([aria-expanded]) > .pf-c-tree-view__content > .pf-c-tree-view__node > .pf-c-tree-view__node-container {
23646
+ cursor: default;
23658
23647
  }
23659
23648
 
23660
- .pf-c-wizard__toggle-separator {
23661
- margin-left: var(--pf-c-wizard__toggle-separator--MarginLeft);
23662
- color: var(--pf-c-wizard__toggle-separator--Color);
23649
+ .pf-c-tree-view.pf-m-compact.pf-m-no-background {
23650
+ --pf-c-tree-view--m-compact__node--before--Top: var(--pf-c-tree-view--m-compact--m-no-background__node--before--Top);
23663
23651
  }
23664
23652
 
23665
- .pf-c-wizard__toggle-icon {
23666
- line-height: var(--pf-c-wizard__toggle-icon--LineHeight);
23653
+ .pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23654
+ --pf-c-tree-view__node--PaddingTop: var(--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingTop);
23655
+ --pf-c-tree-view__node--PaddingBottom: var(--pf-c-tree-view--m-compact--m-no-background__node--nested--PaddingBottom);
23667
23656
  }
23668
23657
 
23669
- .pf-c-wizard__outer-wrap {
23670
- position: relative;
23671
- display: flex;
23672
- flex-direction: column;
23673
- flex-grow: 1;
23674
- min-height: var(--pf-c-wizard__outer-wrap--MinHeight);
23675
- background-color: var(--pf-c-wizard__outer-wrap--BackgroundColor);
23658
+ .pf-c-tree-view.pf-m-compact.pf-m-no-background .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23659
+ --pf-c-tree-view--m-compact--border--Left: var(--pf-c-tree-view--m-compact--m-no-background--border--nested--Left);
23660
+ --pf-c-tree-view__node--PaddingLeft: var(--pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft);
23676
23661
  }
23677
23662
 
23678
- @media screen and (min-width: 992px) {
23679
- .pf-c-wizard__outer-wrap {
23680
- padding-left: var(--pf-c-wizard__outer-wrap--lg--PaddingLeft);
23681
- }
23663
+ .pf-c-tree-view.pf-m-no-background {
23664
+ --pf-c-tree-view--m-compact__node-container--nested--BackgroundColor: var(--pf-c-tree-view--m-no-background__node-container--BackgroundColor);
23682
23665
  }
23683
- .pf-c-wizard__inner-wrap {
23684
- position: relative;
23685
- display: flex;
23686
- flex-direction: column;
23687
- flex-grow: 1;
23688
- min-height: 0;
23666
+
23667
+ .pf-c-tree-view__node-toggle-icon {
23668
+ display: inline-block;
23669
+ min-width: var(--pf-c-tree-view__node-toggle-icon--MinWidth);
23670
+ text-align: center;
23671
+ transition: var(--pf-c-tree-view__node-toggle-icon--Transition);
23672
+ transform: rotate(var(--pf-c-tree-view__node-toggle-icon--Rotate));
23689
23673
  }
23690
23674
 
23691
- @media screen and (min-width: 992px) {
23692
- .pf-c-wizard__inner-wrap {
23693
- position: static;
23694
- }
23675
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23676
+ --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__node-toggle-icon--base--Rotate);
23677
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color--base);
23695
23678
  }
23696
- .pf-c-wizard__nav {
23697
- position: absolute;
23698
- top: 0;
23699
- left: 0;
23700
- z-index: var(--pf-c-wizard__nav--ZIndex);
23701
- display: none;
23702
- width: var(--pf-c-wizard__nav--Width);
23703
- max-height: 100%;
23704
- overflow-y: auto;
23705
- -webkit-overflow-scrolling: touch;
23706
- visibility: hidden;
23707
- background-color: var(--pf-c-wizard__nav--BackgroundColor);
23708
- box-shadow: var(--pf-c-wizard__nav--BoxShadow);
23679
+
23680
+ .pf-c-tree-view__list-item.pf-m-expanded {
23681
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__list-item--m-expanded__node-toggle--Color);
23682
+ --pf-c-tree-view__node-toggle-icon--Rotate: var(--pf-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate);
23709
23683
  }
23710
23684
 
23711
- .pf-c-wizard__nav.pf-m-expanded {
23712
- display: block;
23713
- visibility: visible;
23685
+ .pf-c-tree-view__node,
23686
+ .pf-c-tree-view__node-container {
23687
+ flex: 1 1;
23688
+ align-items: flex-start;
23689
+ min-width: 0;
23690
+ text-align: left;
23691
+ cursor: pointer;
23692
+ border: 0;
23714
23693
  }
23715
23694
 
23716
- @media screen and (min-width: 992px) {
23717
- .pf-c-wizard__nav {
23718
- display: block;
23719
- height: 100%;
23720
- visibility: visible;
23721
- border-right: var(--pf-c-wizard__nav--lg--BorderRightWidth) solid var(--pf-c-wizard__nav--lg--BorderRightColor);
23722
- }
23695
+ .pf-c-tree-view__node {
23696
+ position: relative;
23697
+ display: flex;
23698
+ padding: var(--pf-c-tree-view__node--PaddingTop) var(--pf-c-tree-view__node--PaddingRight) var(--pf-c-tree-view__node--PaddingBottom) var(--pf-c-tree-view__node--PaddingLeft);
23699
+ color: var(--pf-c-tree-view__node--Color);
23723
23700
  }
23724
- .pf-c-wizard__nav-list {
23725
- padding-top: var(--pf-c-wizard__nav-list--PaddingTop);
23726
- padding-right: var(--pf-c-wizard__nav-list--PaddingRight);
23727
- padding-bottom: var(--pf-c-wizard__nav-list--PaddingBottom);
23728
- padding-left: var(--pf-c-wizard__nav-list--PaddingLeft);
23729
- list-style: none;
23730
- counter-reset: wizard-nav-count;
23701
+
23702
+ .pf-c-tree-view__node.pf-m-current {
23703
+ --pf-c-tree-view__node--Color: var(--pf-c-tree-view__node--m-current--Color);
23704
+ font-weight: var(--pf-c-tree-view__node--m-current--FontWeight);
23731
23705
  }
23732
23706
 
23733
- .pf-c-wizard__nav-list .pf-c-wizard__nav-list {
23734
- padding: 0;
23735
- margin-top: var(--pf-c-wizard__nav-list--nested--MarginTop);
23736
- margin-left: var(--pf-c-wizard__nav-list--nested--MarginLeft);
23707
+ .pf-c-tree-view__node:focus {
23708
+ background-color: var(--pf-c-tree-view__node--focus--BackgroundColor);
23737
23709
  }
23738
23710
 
23739
- .pf-c-wizard__nav-list .pf-c-wizard__nav-list .pf-c-wizard__nav-link::before {
23740
- content: none;
23711
+ .pf-c-tree-view__node .pf-c-tree-view__node-count {
23712
+ margin-left: var(--pf-c-tree-view__node-count--MarginLeft);
23741
23713
  }
23742
23714
 
23743
- .pf-c-wizard__nav-list .pf-c-wizard__nav-list .pf-c-wizard__nav-link.pf-m-current {
23744
- font-weight: var(--pf-c-wizard__nav-list__nav-list__nav-link--m-current--FontWeight);
23715
+ .pf-c-tree-view__node .pf-c-tree-view__node-count .pf-c-badge.pf-m-read {
23716
+ --pf-c-badge--m-read--BackgroundColor: var(--pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor);
23745
23717
  }
23746
23718
 
23747
- .pf-c-wizard__nav-item + .pf-c-wizard__nav-item {
23748
- margin-top: var(--pf-c-wizard__nav-item--MarginTop);
23719
+ .pf-c-tree-view__node:not(.pf-m-selectable):hover, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:hover {
23720
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--hover--Color);
23749
23721
  }
23750
23722
 
23751
- .pf-c-wizard__nav-item.pf-m-expandable > .pf-c-wizard__nav-link {
23752
- display: flex;
23723
+ .pf-c-tree-view__node:not(.pf-m-selectable):focus, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:focus {
23724
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--focus--Color);
23753
23725
  }
23754
23726
 
23755
- .pf-c-wizard__nav-item.pf-m-expandable > .pf-c-wizard__nav-list {
23756
- display: none;
23757
- visibility: hidden;
23727
+ .pf-c-tree-view__node:not(.pf-m-selectable):active, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:active {
23728
+ --pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--active--Color);
23729
+ }
23730
+
23731
+ .pf-c-tree-view__node-container {
23732
+ display: var(--pf-c-tree-view__node-container--Display);
23733
+ flex-grow: 1;
23758
23734
  }
23759
23735
 
23760
- .pf-c-wizard__nav-item.pf-m-expanded > .pf-c-wizard__nav-list {
23761
- display: block;
23762
- visibility: visible;
23736
+ .pf-c-tree-view__node-content {
23737
+ display: flex;
23738
+ flex-direction: column;
23739
+ overflow: var(--pf-c-tree-view__node-content--Overflow);
23763
23740
  }
23764
23741
 
23765
- .pf-c-wizard__nav-item.pf-m-expanded > .pf-c-wizard__nav-link {
23766
- --pf-c-wizard__nav-link-toggle-icon--Rotate: var(--pf-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate);
23742
+ .pf-c-tree-view__node-content > * + * {
23743
+ margin-top: var(--pf-c-tree-view__node-content--RowGap);
23767
23744
  }
23768
23745
 
23769
- .pf-c-wizard__nav-link {
23770
- position: relative;
23771
- display: inline-block;
23772
- width: 100%;
23773
- color: var(--pf-c-wizard__nav-link--Color);
23774
- text-align: left;
23775
- text-decoration: var(--pf-c-wizard__nav-link--TextDecoration);
23776
- word-break: break-word;
23777
- border: 0;
23746
+ .pf-c-tree-view__node-check {
23747
+ margin-right: var(--pf-c-tree-view__node-check--MarginRight);
23778
23748
  }
23779
23749
 
23780
- .pf-c-wizard__toggle-num, .pf-c-wizard__nav-link::before {
23781
- position: absolute;
23782
- top: var(--pf-c-wizard__nav-link--before--Top);
23783
- left: 0;
23750
+ .pf-c-tree-view__node-toggle {
23751
+ position: var(--pf-c-tree-view__node-toggle--Position);
23752
+ top: var(--pf-c-tree-view__list-item__list-item__node-toggle--Top);
23753
+ left: var(--pf-c-tree-view__list-item__list-item__node-toggle--Left);
23784
23754
  display: inline-flex;
23785
23755
  align-items: center;
23786
23756
  justify-content: center;
23787
- width: var(--pf-c-wizard__nav-link--before--Width);
23788
- height: var(--pf-c-wizard__nav-link--before--Height);
23789
- font-size: var(--pf-c-wizard__nav-link--before--FontSize);
23790
- line-height: 1;
23791
- color: var(--pf-c-wizard__nav-link--before--Color);
23792
- background-color: var(--pf-c-wizard__nav-link--before--BackgroundColor);
23793
- border-radius: var(--pf-c-wizard__nav-link--before--BorderRadius);
23794
- transform: translateX(var(--pf-c-wizard__nav-link--before--TranslateX));
23757
+ padding: var(--pf-c-tree-view__node-toggle-button--PaddingTop) var(--pf-c-tree-view__node-toggle-button--PaddingRight) var(--pf-c-tree-view__node-toggle-button--PaddingBottom) var(--pf-c-tree-view__node-toggle-button--PaddingLeft);
23758
+ margin-top: var(--pf-c-tree-view__node-toggle-button--MarginTop);
23759
+ margin-bottom: var(--pf-c-tree-view__node-toggle-button--MarginBottom);
23760
+ color: var(--pf-c-tree-view__node-toggle--Color);
23761
+ border: 0;
23762
+ transform: translateX(var(--pf-c-tree-view__list-item__list-item__node-toggle--TranslateX));
23795
23763
  }
23796
23764
 
23797
- .pf-c-wizard__nav-link::before {
23798
- top: 0;
23799
- content: counter(wizard-nav-count);
23800
- counter-increment: wizard-nav-count;
23765
+ .pf-c-tree-view__node-title.pf-m-truncate,
23766
+ .pf-c-tree-view__node-text.pf-m-truncate {
23767
+ --pf-c-tree-view__node-content--Overflow: hidden;
23768
+ overflow: hidden;
23769
+ text-overflow: ellipsis;
23770
+ white-space: nowrap;
23801
23771
  }
23802
23772
 
23803
- .pf-c-wizard__nav-link:hover {
23804
- --pf-c-wizard__nav-link--Color: var(--pf-c-wizard__nav-link--hover--Color);
23805
- --pf-c-wizard__nav-link-toggle--Color: var(--pf-c-wizard__nav-link--hover__nav-link-toggle-icon--Color);
23773
+ .pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-title,
23774
+ .pf-c-tree-view.pf-m-truncate .pf-c-tree-view__node-text {
23775
+ --pf-c-tree-view__node-content--Overflow: hidden;
23776
+ overflow: hidden;
23777
+ text-overflow: ellipsis;
23778
+ white-space: nowrap;
23806
23779
  }
23807
23780
 
23808
- .pf-c-wizard__nav-link:focus {
23809
- --pf-c-wizard__nav-link--Color: var(--pf-c-wizard__nav-link--focus--Color);
23810
- --pf-c-wizard__nav-link-toggle--Color: var(--pf-c-wizard__nav-link--focus__nav-link-toggle-icon--Color);
23781
+ .pf-c-tree-view__node-text {
23782
+ font-weight: inherit;
23783
+ color: inherit;
23784
+ text-align: left;
23785
+ border: 0;
23811
23786
  }
23812
23787
 
23813
- .pf-c-wizard__nav-link.pf-m-current {
23814
- --pf-c-wizard__nav-link--Color: var(--pf-c-wizard__nav-link--m-current--Color);
23815
- font-weight: var(--pf-c-wizard__nav-link--m-current--FontWeight);
23788
+ label.pf-c-tree-view__node-text {
23789
+ cursor: pointer;
23816
23790
  }
23817
23791
 
23818
- .pf-c-wizard__toggle-num, .pf-c-wizard__nav-link.pf-m-current::before {
23819
- --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-c-wizard__nav-link--m-current--before--BackgroundColor);
23820
- --pf-c-wizard__nav-link--before--Color: var(--pf-c-wizard__nav-link--m-current--before--Color);
23792
+ .pf-c-tree-view__node-title {
23793
+ font-weight: var(--pf-c-tree-view__node-title--FontWeight);
23821
23794
  }
23822
23795
 
23823
- .pf-c-wizard__nav-link:disabled, .pf-c-wizard__nav-link.pf-m-disabled {
23824
- --pf-c-wizard__nav-link--Color: var(--pf-c-wizard__nav-link--m-disabled--Color);
23825
- pointer-events: none;
23796
+ .pf-c-tree-view__search {
23797
+ padding: var(--pf-c-tree-view__search--PaddingTop) var(--pf-c-tree-view__search--PaddingRight) var(--pf-c-tree-view__search--PaddingBottom) var(--pf-c-tree-view__search--PaddingLeft);
23826
23798
  }
23827
23799
 
23828
- .pf-c-wizard__nav-link:disabled::before, .pf-c-wizard__nav-link.pf-m-disabled::before {
23829
- --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-c-wizard__nav-link--m-disabled--before--BackgroundColor);
23830
- --pf-c-wizard__nav-link--before--Color: var(--pf-c-wizard__nav-link--m-disabled--before--Color);
23800
+ .pf-c-tree-view__node-icon {
23801
+ padding-right: var(--pf-c-tree-view__node-icon--PaddingRight);
23802
+ color: var(--pf-c-tree-view__node-icon--Color);
23831
23803
  }
23832
23804
 
23833
- .pf-c-wizard__nav-link-text {
23834
- flex-grow: 1;
23805
+ .pf-c-tree-view__content {
23806
+ display: flex;
23807
+ align-items: center;
23835
23808
  }
23836
23809
 
23837
- .pf-c-wizard__nav-link-toggle {
23838
- padding-right: var(--pf-c-wizard__nav-link-toggle--PaddingRight);
23839
- padding-left: var(--pf-c-wizard__nav-link-toggle--PaddingLeft);
23840
- color: var(--pf-c-wizard__nav-link-toggle--Color);
23810
+ .pf-c-tree-view__content:hover,
23811
+ .pf-c-tree-view__content:focus-within {
23812
+ background-color: var(--pf-c-tree-view__node--hover--BackgroundColor);
23841
23813
  }
23842
23814
 
23843
- .pf-c-wizard__nav-link-toggle-icon {
23844
- display: inline-block;
23845
- transition: var(--pf-c-wizard__nav-link-toggle-icon--Transition);
23846
- transform: rotate(var(--pf-c-wizard__nav-link-toggle-icon--Rotate));
23815
+ .pf-c-tree-view__action {
23816
+ margin-left: var(--pf-c-tree-view__action--MarginLeft);
23817
+ color: var(--pf-c-tree-view__action--Color);
23818
+ border: 0;
23847
23819
  }
23848
23820
 
23849
- .pf-c-wizard__main {
23850
- z-index: var(--pf-c-wizard__main--ZIndex);
23851
- flex: 1 1 auto;
23852
- overflow-x: hidden;
23853
- overflow-y: auto;
23854
- word-break: break-word;
23821
+ .pf-c-tree-view__action:hover {
23822
+ --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--hover--Color);
23855
23823
  }
23856
23824
 
23857
- .pf-c-wizard__main-body {
23858
- padding: var(--pf-c-wizard__main-body--PaddingTop) var(--pf-c-wizard__main-body--PaddingRight) var(--pf-c-wizard__main-body--PaddingBottom) var(--pf-c-wizard__main-body--PaddingLeft);
23825
+ .pf-c-tree-view__action:focus {
23826
+ --pf-c-tree-view__action--Color: var(--pf-c-tree-view__action--focus--Color);
23827
+ background-color: var(--pf-c-tree-view__action--focus--BackgroundColor);
23859
23828
  }
23860
23829
 
23861
- .pf-c-wizard__main-body.pf-m-no-padding {
23862
- padding: 0;
23830
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23831
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23832
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 1 + var(--pf-c-tree-view__node--indent--base));
23833
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23863
23834
  }
23864
23835
 
23865
- .pf-c-wizard__footer {
23866
- position: relative;
23867
- z-index: var(--pf-c-wizard__footer--ZIndex);
23868
- display: flex;
23869
- flex-wrap: wrap;
23870
- flex-shrink: 0;
23871
- padding: var(--pf-c-wizard__footer--PaddingTop) var(--pf-c-wizard__footer--PaddingRight) var(--pf-c-wizard__footer--PaddingBottom) var(--pf-c-wizard__footer--PaddingLeft);
23872
- background-color: var(--pf-c-wizard__footer--BackgroundColor);
23836
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23837
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23838
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 2 + var(--pf-c-tree-view__node--indent--base));
23839
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23840
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 1 + var(--pf-c-tree-view--m-compact__node--indent--base));
23841
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23842
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 1 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23843
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23873
23844
  }
23874
23845
 
23875
- .pf-c-wizard__footer > * {
23876
- margin-bottom: var(--pf-c-wizard__footer--child--MarginBottom);
23846
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23847
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23848
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 3 + var(--pf-c-tree-view__node--indent--base));
23849
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23850
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 2 + var(--pf-c-tree-view--m-compact__node--indent--base));
23851
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23852
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 2 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23853
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23877
23854
  }
23878
23855
 
23879
- .pf-c-wizard__footer > *:not(:last-child) {
23880
- margin-right: var(--pf-c-wizard__footer--child--MarginRight);
23856
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23857
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23858
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 4 + var(--pf-c-tree-view__node--indent--base));
23859
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23860
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 3 + var(--pf-c-tree-view--m-compact__node--indent--base));
23861
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23862
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 3 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23863
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23881
23864
  }
23882
23865
 
23883
- .pf-c-page__main-wizard .pf-c-wizard__footer, .pf-c-modal-box .pf-c-wizard__footer, .pf-c-drawer > .pf-c-wizard__footer {
23884
- box-shadow: var(--pf-c-wizard__footer--BoxShadow);
23866
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23867
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23868
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 5 + var(--pf-c-tree-view__node--indent--base));
23869
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23870
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 4 + var(--pf-c-tree-view--m-compact__node--indent--base));
23871
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23872
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 4 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23873
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23885
23874
  }
23886
23875
 
23887
- .pf-c-wizard__footer-cancel {
23888
- margin-left: var(--pf-c-wizard__footer-cancel--MarginLeft);
23876
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23877
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23878
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 6 + var(--pf-c-tree-view__node--indent--base));
23879
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23880
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 5 + var(--pf-c-tree-view--m-compact__node--indent--base));
23881
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23882
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 5 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23883
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23889
23884
  }
23890
23885
 
23891
- :where(.pf-theme-dark) .pf-c-wizard__header {
23892
- --pf-global--Color--100: #e0e0e0;
23893
- --pf-global--Color--200: #aaabac;
23894
- --pf-global--BorderColor--100: #444548;
23895
- --pf-global--primary-color--100: #1fa7f8;
23896
- --pf-global--link--Color: #1fa7f8;
23897
- --pf-global--link--Color--hover: #73bcf7;
23898
- --pf-global--BackgroundColor--100: #1b1d21;
23886
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23887
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23888
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 7 + var(--pf-c-tree-view__node--indent--base));
23889
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23890
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 6 + var(--pf-c-tree-view--m-compact__node--indent--base));
23891
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23892
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 6 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23893
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23899
23894
  }
23900
23895
 
23901
- :where(.pf-theme-dark) .pf-c-wizard__header .pf-c-card {
23902
- --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
23896
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23897
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23898
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 8 + var(--pf-c-tree-view__node--indent--base));
23899
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23900
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 7 + var(--pf-c-tree-view--m-compact__node--indent--base));
23901
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23902
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 7 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23903
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23903
23904
  }
23904
23905
 
23905
- :where(.pf-theme-dark) .pf-c-wizard__header .pf-c-button {
23906
- --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
23907
- --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
23908
- --pf-c-button--m-primary--focus--Color: var(--pf-global--Color--light-100);
23909
- --pf-c-button--m-primary--active--Color: var(--pf-global--Color--light-100);
23910
- --pf-c-button--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
23911
- --pf-c-button--m-primary--hover--BackgroundColor: var(--pf-global--primary-color--200);
23912
- --pf-c-button--m-primary--focus--BackgroundColor: var(--pf-global--primary-color--200);
23913
- --pf-c-button--m-primary--active--BackgroundColor: var(--pf-global--primary-color--200);
23914
- --pf-c-button--m-secondary--Color: var(--pf-global--primary-color--100);
23915
- --pf-c-button--m-secondary--hover--Color: var(--pf-global--primary-color--100);
23916
- --pf-c-button--m-secondary--focus--Color: var(--pf-global--primary-color--100);
23917
- --pf-c-button--m-secondary--active--Color: var(--pf-global--primary-color--100);
23906
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23907
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23908
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 9 + var(--pf-c-tree-view__node--indent--base));
23909
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23910
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 8 + var(--pf-c-tree-view--m-compact__node--indent--base));
23911
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23912
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 8 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23913
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23918
23914
  }
23919
23915
 
23920
- :where(.pf-theme-dark) .pf-c-wizard {
23921
- --pf-c-wizard__header--BackgroundColor: var(--pf-global--palette--black-1000);
23922
- --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-global--palette--black-500);
23923
- --pf-c-wizard__nav-link--m-disabled--Color: var(--pf-global--disabled-color--300);
23924
- --pf-c-wizard__nav-link--m-disabled--before--Color: var(--pf-global--disabled-color--300);
23916
+ .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item .pf-c-tree-view__list-item {
23917
+ --pf-c-tree-view__list-item__list-item__node-toggle--Left: var(--pf-c-tree-view__node--PaddingLeft);
23918
+ --pf-c-tree-view__node--PaddingLeft: calc(var(--pf-c-tree-view__node--nested-indent--base) * 10 + var(--pf-c-tree-view__node--indent--base));
23919
+ --pf-c-tree-view--m-guides--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-guides--guide-left--base--offset));
23920
+ --pf-c-tree-view--m-compact__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact__node--nested-indent--base) * 9 + var(--pf-c-tree-view--m-compact__node--indent--base));
23921
+ --pf-c-tree-view--m-compact--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--base-border--Left--offset));
23922
+ --pf-c-tree-view--m-compact--m-no-background__node--PaddingLeft: calc(var(--pf-c-tree-view--m-compact--m-no-background__node--nested-indent--base) * 9 + var(--pf-c-tree-view--m-compact--m-no-background__node--indent--base));
23923
+ --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
23925
23924
  }
23926
23925
 
23927
- :where(.pf-theme-dark) .pf-c-wizard__header {
23928
- color: var(--pf-global--Color--100);
23926
+ :where(.pf-theme-dark) .pf-c-tree-view {
23927
+ --pf-c-tree-view__node--hover--BackgroundColor: var(--pf-global--BackgroundColor--300);
23928
+ --pf-c-tree-view__node--focus--BackgroundColor: var(--pf-global--BackgroundColor--300);
23929
23929
  }
23930
23930
 
23931
23931
  .pf-c-draggable {