@patternfly/react-templates 6.0.0-alpha.28 → 6.0.0-alpha.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/components/package.json +1 -1
  3. package/dist/dynamic/components/Dropdown/package.json +1 -1
  4. package/dist/dynamic/components/Select/package.json +1 -1
  5. package/dist/umd/assets/{output-BhuwSV0N.css → output-BMCio0RG.css} +1952 -1952
  6. package/package.json +3 -3
package/dist/umd/assets/{output-BhuwSV0N.css → output-BMCio0RG.css} RENAMED
@@ -833,6 +833,168 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
833
833
  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
834
834
  }
835
835
  }
836
+ :where(:root, .pf-v6-c-accordion) {
837
+ --pf-v6-c-accordion--BackgroundColor: var(--pf-t--global--background--color--primary--default);
838
+ --pf-v6-c-accordion--RowGap: var(--pf-t--global--spacer--xs);
839
+ --pf-v6-c-accordion__item--BorderRadius: var(--pf-t--global--border--radius--200);
840
+ --pf-v6-c-accordion__item--m-expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
841
+ --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-t--global--spacer--sm);
842
+ --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
843
+ --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
844
+ --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
845
+ --pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
846
+ --pf-v6-c-accordion__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
847
+ --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
848
+ --pf-v6-c-accordion__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
849
+ --pf-v6-c-accordion__toggle--BorderRadius: var(--pf-t--global--border--radius--small);
850
+ --pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--md);
851
+ --pf-v6-c-accordion__toggle-text--Color: var(--pf-t--global--text--color--regular);
852
+ --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-t--global--font--weight--body);
853
+ --pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
854
+ --pf-v6-c-accordion__toggle-icon--Transition: .2s ease-in 0s;
855
+ --pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg;
856
+ --pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
857
+ --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
858
+ --pf-v6-c-accordion__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
859
+ --pf-v6-c-accordion__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
860
+ --pf-v6-c-accordion__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
861
+ --pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular);
862
+ --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
863
+ --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem;
864
+ --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-t--global--spacer--sm);
865
+ --pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
866
+ --pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
867
+ --pf-v6-c-accordion__expandable-content-body--PaddingInlineStart: var(--pf-t--global--spacer--sm);
868
+ --pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart: 0;
869
+ --pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockStart: var(--pf-t--global--spacer--md);
870
+ --pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
871
+ --pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--md);
872
+ --pf-v6-c-accordion--m-display-lg__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
873
+ --pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
874
+ --pf-v6-c-accordion--m-display-lg__toggle--FontFamily: var(--pf-t--global--font--family--heading);
875
+ --pf-v6-c-accordion--m-display-lg__toggle--FontSize: var(--pf-t--global--font--size--heading--sm);
876
+ --pf-v6-c-accordion--m-display-lg__toggle-text--FontWeight: var(--pf-t--global--font--weight--heading);
877
+ --pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--heading--bold);
878
+ --pf-v6-c-accordion--m-display-lg__expandable-content--FontSize: var(--pf-t--global--font--size--body--lg);
879
+ --pf-v6-c-accordion--m-display-lg__expandable-content--Color: var(--pf-t--global--text--color--regular);
880
+ --pf-v6-c-accordion--m-bordered--RowGap: 0;
881
+ --pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
882
+ --pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor: var(--pf-t--global--border--color--default);
883
+ }
884
+
885
+ .pf-v6-c-accordion {
886
+ display: flex;
887
+ flex-direction: column;
888
+ row-gap: var(--pf-v6-c-accordion--RowGap);
889
+ background-color: var(--pf-v6-c-accordion--BackgroundColor);
890
+ }
891
+
892
+ .pf-v6-c-accordion.pf-m-toggle-start {
893
+ --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap);
894
+ }
895
+
896
+ .pf-v6-c-accordion.pf-m-display-lg {
897
+ --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockStart);
898
+ --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineEnd);
899
+ --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockEnd);
900
+ --pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--m-expanded--PaddingBlockEnd);
901
+ --pf-v6-c-accordion__toggle--PaddingInlineStart: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineStart);
902
+ --pf-v6-c-accordion__toggle--FontFamily: var(--pf-v6-c-accordion--m-display-lg__toggle--FontFamily);
903
+ --pf-v6-c-accordion__toggle--FontSize: var(--pf-v6-c-accordion--m-display-lg__toggle--FontSize);
904
+ --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion--m-display-lg__toggle-text--FontWeight);
905
+ --pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight);
906
+ --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-v6-c-accordion--m-display-lg__expandable-content--FontSize);
907
+ --pf-v6-c-accordion__expandable-content--Color: var(--pf-v6-c-accordion--m-display-lg__expandable-content--Color);
908
+ }
909
+
910
+ .pf-v6-c-accordion.pf-m-bordered {
911
+ --pf-v6-c-accordion--RowGap: var(--pf-v6-c-accordion--m-bordered--RowGap);
912
+ --pf-v6-c-accordion__item--BorderRadius: 0;
913
+ --pf-v6-c-accordion__toggle--BorderRadius: 0;
914
+ }
915
+
916
+ .pf-v6-c-accordion.pf-m-bordered .pf-v6-c-accordion__item {
917
+ border-block-end: var(--pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth) solid var(--pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor);
918
+ }
919
+
920
+ .pf-v6-c-accordion__item {
921
+ border-radius: var(--pf-v6-c-accordion__item--BorderRadius);
922
+ }
923
+
924
+ .pf-v6-c-accordion__item.pf-m-expanded {
925
+ --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd);
926
+ --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight);
927
+ background-color: var(--pf-v6-c-accordion__item--m-expanded--BackgroundColor);
928
+ }
929
+
930
+ .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon {
931
+ transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate));
932
+ }
933
+
934
+ .pf-v6-c-accordion__toggle {
935
+ display: flex;
936
+ column-gap: var(--pf-v6-c-accordion__toggle--ColumnGap);
937
+ align-items: center;
938
+ width: 100%;
939
+ padding-block-start: var(--pf-v6-c-accordion__toggle--PaddingBlockStart);
940
+ padding-block-end: var(--pf-v6-c-accordion__toggle--PaddingBlockEnd);
941
+ padding-inline-start: var(--pf-v6-c-accordion__toggle--PaddingInlineStart);
942
+ padding-inline-end: var(--pf-v6-c-accordion__toggle--PaddingInlineEnd);
943
+ font-family: var(--pf-v6-c-accordion__toggle--FontFamily, inherit);
944
+ font-size: var(--pf-v6-c-accordion__toggle--FontSize, inherit);
945
+ text-align: start;
946
+ background-color: var(--pf-v6-c-accordion__toggle--BackgroundColor);
947
+ border: 0;
948
+ border-radius: var(--pf-v6-c-accordion__toggle--BorderRadius);
949
+ }
950
+
951
+ .pf-v6-c-accordion__toggle:is(:hover, :focus) {
952
+ --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-v6-c-accordion__toggle--hover--BackgroundColor);
953
+ }
954
+
955
+ .pf-v6-c-accordion__toggle-text {
956
+ overflow: hidden;
957
+ text-overflow: ellipsis;
958
+ white-space: nowrap;
959
+ flex-grow: 1;
960
+ font-weight: var(--pf-v6-c-accordion__toggle-text--FontWeight);
961
+ color: var(--pf-v6-c-accordion__toggle-text--Color);
962
+ }
963
+
964
+ .pf-v6-c-accordion__toggle-icon {
965
+ transition: var(--pf-v6-c-accordion__toggle-icon--Transition);
966
+ }
967
+
968
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-accordion__toggle-icon {
969
+ scale: -1 1;
970
+ }
971
+
972
+ .pf-v6-c-accordion__expandable-content {
973
+ margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
974
+ margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart);
975
+ margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd);
976
+ font-size: var(--pf-v6-c-accordion__expandable-content--FontSize);
977
+ color: var(--pf-v6-c-accordion__expandable-content--Color);
978
+ background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor);
979
+ border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius);
980
+ }
981
+
982
+ .pf-v6-c-accordion__expandable-content.pf-m-fixed {
983
+ max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
984
+ overflow-y: auto;
985
+ }
986
+
987
+ .pf-v6-c-accordion__expandable-content-body {
988
+ padding-block-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart);
989
+ padding-block-end: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd);
990
+ padding-inline-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingInlineStart);
991
+ padding-inline-end: var(--pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd);
992
+ }
993
+
994
+ .pf-v6-c-accordion__expandable-content-body + .pf-v6-c-accordion__expandable-content-body {
995
+ --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart);
996
+ }
997
+
836
998
  :where(:root, .pf-v6-c-action-list) {
837
999
  --pf-v6-c-action-list--RowGap: var(--pf-t--global--spacer--gap--group--vertical);
838
1000
  --pf-v6-c-action-list--ColumnGap: var(--pf-t--global--spacer--gap--group-to-group--horizontal);
@@ -1327,202 +1489,40 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1327
1489
  --pf-v6-c-avatar--Height: var(--pf-v6-c-avatar--m-xl--Height-on-2xl, var(--pf-v6-c-avatar--m-xl--Height-on-xl, var(--pf-v6-c-avatar--m-xl--Height-on-lg, var(--pf-v6-c-avatar--m-xl--Height-on-md, var(--pf-v6-c-avatar--m-xl--Height-on-sm, var(--pf-v6-c-avatar--m-xl--Height))))));
1328
1490
  }
1329
1491
  }
1330
- :where(:root, .pf-v6-c-accordion) {
1331
- --pf-v6-c-accordion--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1332
- --pf-v6-c-accordion--RowGap: var(--pf-t--global--spacer--xs);
1333
- --pf-v6-c-accordion__item--BorderRadius: var(--pf-t--global--border--radius--200);
1334
- --pf-v6-c-accordion__item--m-expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
1335
- --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-t--global--spacer--sm);
1336
- --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
1337
- --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
1338
- --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
1339
- --pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
1340
- --pf-v6-c-accordion__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
1341
- --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
1342
- --pf-v6-c-accordion__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
1343
- --pf-v6-c-accordion__toggle--BorderRadius: var(--pf-t--global--border--radius--small);
1344
- --pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-t--global--spacer--md);
1345
- --pf-v6-c-accordion__toggle-text--Color: var(--pf-t--global--text--color--regular);
1346
- --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-t--global--font--weight--body);
1347
- --pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
1348
- --pf-v6-c-accordion__toggle-icon--Transition: .2s ease-in 0s;
1349
- --pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate: 90deg;
1350
- --pf-v6-c-accordion__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
1351
- --pf-v6-c-accordion__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
1352
- --pf-v6-c-accordion__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
1353
- --pf-v6-c-accordion__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1354
- --pf-v6-c-accordion__expandable-content--BorderRadius: var(--pf-t--global--border--radius--small);
1355
- --pf-v6-c-accordion__expandable-content--Color: var(--pf-t--global--text--color--regular);
1356
- --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-t--global--font--size--body--default);
1357
- --pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight: 9.375rem;
1358
- --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-t--global--spacer--sm);
1359
- --pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1360
- --pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
1361
- --pf-v6-c-accordion__expandable-content-body--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1362
- --pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart: 0;
1363
- --pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockStart: var(--pf-t--global--spacer--md);
1364
- --pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
1365
- --pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--md);
1366
- --pf-v6-c-accordion--m-display-lg__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
1367
- --pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
1368
- --pf-v6-c-accordion--m-display-lg__toggle--FontFamily: var(--pf-t--global--font--family--heading);
1369
- --pf-v6-c-accordion--m-display-lg__toggle--FontSize: var(--pf-t--global--font--size--heading--sm);
1370
- --pf-v6-c-accordion--m-display-lg__toggle-text--FontWeight: var(--pf-t--global--font--weight--heading);
1371
- --pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight: var(--pf-t--global--font--weight--heading--bold);
1372
- --pf-v6-c-accordion--m-display-lg__expandable-content--FontSize: var(--pf-t--global--font--size--body--lg);
1373
- --pf-v6-c-accordion--m-display-lg__expandable-content--Color: var(--pf-t--global--text--color--regular);
1374
- --pf-v6-c-accordion--m-bordered--RowGap: 0;
1375
- --pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
1376
- --pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor: var(--pf-t--global--border--color--default);
1492
+ :where(:root, .pf-v6-c-back-to-top) {
1493
+ --pf-v6-c-back-to-top--InsetInlineEnd: var(--pf-t--global--spacer--2xl);
1494
+ --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-t--global--spacer--lg);
1495
+ --pf-v6-c-back-to-top--md--InsetBlockEnd: var(--pf-t--global--spacer--2xl);
1496
+ --pf-v6-c-back-to-top--c-button--FontSize: var(--pf-t--global--font--size--body--sm);
1497
+ --pf-v6-c-back-to-top--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1498
+ --pf-v6-c-back-to-top--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1499
+ --pf-v6-c-back-to-top--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1500
+ --pf-v6-c-back-to-top--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1501
+ --pf-v6-c-back-to-top--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
1377
1502
  }
1378
1503
 
1379
- .pf-v6-c-accordion {
1380
- display: flex;
1381
- flex-direction: column;
1382
- row-gap: var(--pf-v6-c-accordion--RowGap);
1383
- background-color: var(--pf-v6-c-accordion--BackgroundColor);
1504
+ @media (min-width: 768px) {
1505
+ :where(:root, .pf-v6-c-back-to-top) {
1506
+ --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-v6-c-back-to-top--md--InsetBlockEnd);
1507
+ }
1508
+ }
1509
+ .pf-v6-c-back-to-top {
1510
+ position: absolute;
1511
+ inset-block-end: var(--pf-v6-c-back-to-top--InsetBlockEnd);
1512
+ inset-inline-end: var(--pf-v6-c-back-to-top--InsetInlineEnd);
1384
1513
  }
1385
1514
 
1386
- .pf-v6-c-accordion.pf-m-toggle-start {
1387
- --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-v6-c-accordion--m-toggle-start__toggle--ColumnGap);
1515
+ .pf-v6-c-back-to-top.pf-m-hidden {
1516
+ display: none;
1388
1517
  }
1389
1518
 
1390
- .pf-v6-c-accordion.pf-m-display-lg {
1391
- --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockStart);
1392
- --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineEnd);
1393
- --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingBlockEnd);
1394
- --pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd: var(--pf-v6-c-accordion--m-display-lg__toggle--m-expanded--PaddingBlockEnd);
1395
- --pf-v6-c-accordion__toggle--PaddingInlineStart: var(--pf-v6-c-accordion--m-display-lg__toggle--PaddingInlineStart);
1396
- --pf-v6-c-accordion__toggle--FontFamily: var(--pf-v6-c-accordion--m-display-lg__toggle--FontFamily);
1397
- --pf-v6-c-accordion__toggle--FontSize: var(--pf-v6-c-accordion--m-display-lg__toggle--FontSize);
1398
- --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion--m-display-lg__toggle-text--FontWeight);
1399
- --pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight: var(--pf-v6-c-accordion--m-display-lg__toggle--m-expanded__toggle-text--FontWeight);
1400
- --pf-v6-c-accordion__expandable-content--FontSize: var(--pf-v6-c-accordion--m-display-lg__expandable-content--FontSize);
1401
- --pf-v6-c-accordion__expandable-content--Color: var(--pf-v6-c-accordion--m-display-lg__expandable-content--Color);
1402
- }
1403
-
1404
- .pf-v6-c-accordion.pf-m-bordered {
1405
- --pf-v6-c-accordion--RowGap: var(--pf-v6-c-accordion--m-bordered--RowGap);
1406
- --pf-v6-c-accordion__item--BorderRadius: 0;
1407
- --pf-v6-c-accordion__toggle--BorderRadius: 0;
1408
- }
1409
-
1410
- .pf-v6-c-accordion.pf-m-bordered .pf-v6-c-accordion__item {
1411
- border-block-end: var(--pf-v6-c-accordion__item--m-bordered--BorderBlockEndWidth) solid var(--pf-v6-c-accordion__item--m-bordered--BorderBlockEndColor);
1412
- }
1413
-
1414
- .pf-v6-c-accordion__item {
1415
- border-radius: var(--pf-v6-c-accordion__item--BorderRadius);
1416
- }
1417
-
1418
- .pf-v6-c-accordion__item.pf-m-expanded {
1419
- --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd);
1420
- --pf-v6-c-accordion__toggle-text--FontWeight: var(--pf-v6-c-accordion__toggle--m-expanded__toggle-text--FontWeight);
1421
- background-color: var(--pf-v6-c-accordion__item--m-expanded--BackgroundColor);
1422
- }
1423
-
1424
- .pf-v6-c-accordion__item.pf-m-expanded .pf-v6-c-accordion__toggle-icon {
1425
- transform: rotate(var(--pf-v6-c-accordion__toggle--m-expanded__toggle-icon--Rotate));
1426
- }
1427
-
1428
- .pf-v6-c-accordion__toggle {
1429
- display: flex;
1430
- column-gap: var(--pf-v6-c-accordion__toggle--ColumnGap);
1431
- align-items: center;
1432
- width: 100%;
1433
- padding-block-start: var(--pf-v6-c-accordion__toggle--PaddingBlockStart);
1434
- padding-block-end: var(--pf-v6-c-accordion__toggle--PaddingBlockEnd);
1435
- padding-inline-start: var(--pf-v6-c-accordion__toggle--PaddingInlineStart);
1436
- padding-inline-end: var(--pf-v6-c-accordion__toggle--PaddingInlineEnd);
1437
- font-family: var(--pf-v6-c-accordion__toggle--FontFamily, inherit);
1438
- font-size: var(--pf-v6-c-accordion__toggle--FontSize, inherit);
1439
- text-align: start;
1440
- background-color: var(--pf-v6-c-accordion__toggle--BackgroundColor);
1441
- border: 0;
1442
- border-radius: var(--pf-v6-c-accordion__toggle--BorderRadius);
1443
- }
1444
-
1445
- .pf-v6-c-accordion__toggle:is(:hover, :focus) {
1446
- --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-v6-c-accordion__toggle--hover--BackgroundColor);
1447
- }
1448
-
1449
- .pf-v6-c-accordion__toggle-text {
1450
- overflow: hidden;
1451
- text-overflow: ellipsis;
1452
- white-space: nowrap;
1453
- flex-grow: 1;
1454
- font-weight: var(--pf-v6-c-accordion__toggle-text--FontWeight);
1455
- color: var(--pf-v6-c-accordion__toggle-text--Color);
1456
- }
1457
-
1458
- .pf-v6-c-accordion__toggle-icon {
1459
- transition: var(--pf-v6-c-accordion__toggle-icon--Transition);
1460
- }
1461
-
1462
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-accordion__toggle-icon {
1463
- scale: -1 1;
1464
- }
1465
-
1466
- .pf-v6-c-accordion__expandable-content {
1467
- margin-block-end: var(--pf-v6-c-accordion__expandable-content--MarginBlockEnd);
1468
- margin-inline-start: var(--pf-v6-c-accordion__expandable-content--MarginInlineStart);
1469
- margin-inline-end: var(--pf-v6-c-accordion__expandable-content--MarginInlineEnd);
1470
- font-size: var(--pf-v6-c-accordion__expandable-content--FontSize);
1471
- color: var(--pf-v6-c-accordion__expandable-content--Color);
1472
- background-color: var(--pf-v6-c-accordion__expandable-content--BackgroundColor);
1473
- border-radius: var(--pf-v6-c-accordion__expandable-content--BorderRadius);
1474
- }
1475
-
1476
- .pf-v6-c-accordion__expandable-content.pf-m-fixed {
1477
- max-height: var(--pf-v6-c-accordion__expandable-content--m-fixed--MaxHeight);
1478
- overflow-y: auto;
1479
- }
1480
-
1481
- .pf-v6-c-accordion__expandable-content-body {
1482
- padding-block-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockStart);
1483
- padding-block-end: var(--pf-v6-c-accordion__expandable-content-body--PaddingBlockEnd);
1484
- padding-inline-start: var(--pf-v6-c-accordion__expandable-content-body--PaddingInlineStart);
1485
- padding-inline-end: var(--pf-v6-c-accordion__expandable-content-body--PaddingInlineEnd);
1486
- }
1487
-
1488
- .pf-v6-c-accordion__expandable-content-body + .pf-v6-c-accordion__expandable-content-body {
1489
- --pf-v6-c-accordion__expandable-content-body--PaddingBlockStart: var(--pf-v6-c-accordion__expandable-content-body--expandable-content-body--PaddingBlockStart);
1490
- }
1491
-
1492
- :where(:root, .pf-v6-c-back-to-top) {
1493
- --pf-v6-c-back-to-top--InsetInlineEnd: var(--pf-t--global--spacer--2xl);
1494
- --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-t--global--spacer--lg);
1495
- --pf-v6-c-back-to-top--md--InsetBlockEnd: var(--pf-t--global--spacer--2xl);
1496
- --pf-v6-c-back-to-top--c-button--FontSize: var(--pf-t--global--font--size--body--sm);
1497
- --pf-v6-c-back-to-top--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1498
- --pf-v6-c-back-to-top--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1499
- --pf-v6-c-back-to-top--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1500
- --pf-v6-c-back-to-top--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1501
- --pf-v6-c-back-to-top--c-button--BoxShadow: var(--pf-t--global--box-shadow--sm);
1502
- }
1503
-
1504
- @media (min-width: 768px) {
1505
- :where(:root, .pf-v6-c-back-to-top) {
1506
- --pf-v6-c-back-to-top--InsetBlockEnd: var(--pf-v6-c-back-to-top--md--InsetBlockEnd);
1507
- }
1508
- }
1509
- .pf-v6-c-back-to-top {
1510
- position: absolute;
1511
- inset-block-end: var(--pf-v6-c-back-to-top--InsetBlockEnd);
1512
- inset-inline-end: var(--pf-v6-c-back-to-top--InsetInlineEnd);
1513
- }
1514
-
1515
- .pf-v6-c-back-to-top.pf-m-hidden {
1516
- display: none;
1517
- }
1518
-
1519
- .pf-v6-c-back-to-top .pf-v6-c-button {
1520
- --pf-v6-c-button--FontSize: var(--pf-v6-c-back-to-top--c-button--FontSize);
1521
- --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-back-to-top--c-button--PaddingBlockStart);
1522
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-back-to-top--c-button--PaddingInlineEnd);
1523
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-back-to-top--c-button--PaddingBlockEnd);
1524
- --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-back-to-top--c-button--PaddingInlineStart);
1525
- box-shadow: var(--pf-v6-c-back-to-top--c-button--BoxShadow);
1519
+ .pf-v6-c-back-to-top .pf-v6-c-button {
1520
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-back-to-top--c-button--FontSize);
1521
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-v6-c-back-to-top--c-button--PaddingBlockStart);
1522
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-v6-c-back-to-top--c-button--PaddingInlineEnd);
1523
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-v6-c-back-to-top--c-button--PaddingBlockEnd);
1524
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-v6-c-back-to-top--c-button--PaddingInlineStart);
1525
+ box-shadow: var(--pf-v6-c-back-to-top--c-button--BoxShadow);
1526
1526
  }
1527
1527
 
1528
1528
  :where(:root, .pf-v6-c-backdrop) {
@@ -1994,138 +1994,358 @@ button.pf-v6-c-breadcrumb__link {
1994
1994
  display: none;
1995
1995
  }
1996
1996
 
1997
- :where(:root, .pf-v6-c-button) {
1998
- --pf-v6-c-button--Display: inline-flex;
1999
- --pf-v6-c-button--AlignItems: baseline;
2000
- --pf-v6-c-button--JustifyContent: center;
2001
- --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
2002
- --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2003
- --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2004
- --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2005
- --pf-v6-c-button--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2006
- --pf-v6-c-button--Color: var(--pf-t--global--text--color--regular);
2007
- --pf-v6-c-button--LineHeight: var(--pf-t--global--font--line-height--body);
2008
- --pf-v6-c-button--FontWeight: var(--pf-t--global--font--weight--body);
2009
- --pf-v6-c-button--FontSize: var(--pf-t--global--font--size--body--default);
2010
- --pf-v6-c-button--BackgroundColor: transparent;
2011
- --pf-v6-c-button--BorderColor: transparent;
2012
- --pf-v6-c-button--BorderWidth: var(--pf-t--global--border--width--action--default);
2013
- --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
2014
- --pf-v6-c-button--TextDecoration: none;
2015
- --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
2016
- --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
2017
- --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
2018
- --pf-v6-c-button--hover--BackgroundColor: transparent;
2019
- --pf-v6-c-button--hover--BorderColor: transparent;
2020
- --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
2021
- --pf-v6-c-button--hover--TextDecoration: none;
2022
- --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
2023
- --pf-v6-c-button--m-clicked--BorderColor: transparent;
2024
- --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
2025
- --pf-v6-c-button--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
2026
- --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
2027
- --pf-v6-c-button--m-primary__icon--Color: var(--pf-t--global--icon--color--on-brand--default);
2028
- --pf-v6-c-button--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
2029
- --pf-v6-c-button--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
2030
- --pf-v6-c-button--m-primary--hover__icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
2031
- --pf-v6-c-button--m-primary--m-clicked--Color: var(--pf-t--global--text--color--on-brand--clicked);
2032
- --pf-v6-c-button--m-primary--m-clicked--BackgroundColor: var(--pf-t--global--color--brand--clicked);
2033
- --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
2034
- --pf-v6-c-button--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
2035
- --pf-v6-c-button--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
2036
- --pf-v6-c-button--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--default);
2037
- --pf-v6-c-button--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
2038
- --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
2039
- --pf-v6-c-button--m-secondary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
2040
- --pf-v6-c-button--m-secondary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
2041
- --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-t--global--border--color--brand--clicked);
2042
- --pf-v6-c-button--m-secondary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
2043
- --pf-v6-c-button--m-secondary--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
2044
- --pf-v6-c-button--m-secondary--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
2045
- --pf-v6-c-button--m-secondary--m-danger__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
2046
- --pf-v6-c-button--m-secondary--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
2047
- --pf-v6-c-button--m-secondary--m-danger--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
2048
- --pf-v6-c-button--m-secondary--m-danger--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
2049
- --pf-v6-c-button--m-secondary--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
2050
- --pf-v6-c-button--m-secondary--m-danger--m-clicked--BorderColor: var(--pf-t--global--border--color--status--danger--clicked);
2051
- --pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--danger--clicked);
2052
- --pf-v6-c-button--m-tertiary--Color: var(--pf-t--global--text--color--brand--default);
2053
- --pf-v6-c-button--m-tertiary--BorderColor: var(--pf-t--global--border--color--default);
2054
- --pf-v6-c-button--m-tertiary__icon--Color: var(--pf-t--global--icon--color--brand--default);
2055
- --pf-v6-c-button--m-tertiary--hover--Color: var(--pf-t--global--text--color--brand--hover);
2056
- --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--hover);
2057
- --pf-v6-c-button--m-tertiary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
2058
- --pf-v6-c-button--m-tertiary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
2059
- --pf-v6-c-button--m-tertiary--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
2060
- --pf-v6-c-button--m-tertiary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
2061
- --pf-v6-c-button--m-link--BorderRadius: var(--pf-t--global--border--radius--small);
2062
- --pf-v6-c-button--m-link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2063
- --pf-v6-c-button--m-link--PaddingInlineStart: var(--pf-t--global--spacer--md);
2064
- --pf-v6-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
2065
- --pf-v6-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
2066
- --pf-v6-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
2067
- --pf-v6-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
2068
- --pf-v6-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
2069
- --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-t--global--text--color--brand--hover);
2070
- --pf-v6-c-button--m-link--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
2071
- --pf-v6-c-button--m-link--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2072
- --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-t--global--text--color--brand--clicked);
2073
- --pf-v6-c-button--m-link--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
2074
- --pf-v6-c-button--m-link--m-danger--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
2075
- --pf-v6-c-button--m-link--m-danger__icon--Color: var(--pf-t--global--text--color--status--danger--default);
2076
- --pf-v6-c-button--m-link--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
2077
- --pf-v6-c-button--m-link--m-danger--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
2078
- --pf-v6-c-button--m-link--m-danger--hover__icon--Color: var(--pf-t--global--text--color--status--danger--hover);
2079
- --pf-v6-c-button--m-link--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
2080
- --pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2081
- --pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color: var(--pf-t--global--text--color--status--danger--clicked);
2082
- --pf-v6-c-button--m-link--m-inline--Display: inline-flex;
2083
- --pf-v6-c-button--m-link--m-inline--JustifyContent: flex-start;
2084
- --pf-v6-c-button--m-link--m-inline--FontSize: initial;
2085
- --pf-v6-c-button--m-link--m-inline--LineHeight: initial;
2086
- --pf-v6-c-button--m-link--m-inline--FontWeight: initial;
2087
- --pf-v6-c-button--m-link--m-inline--PaddingBlockStart: 0;
2088
- --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
2089
- --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
2090
- --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
2091
- --pf-v6-c-button--m-link--m-inline--hover--TextDecoration: var(--pf-t--global--link--text-decoration--hover);
2092
- --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
2093
- --pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart: calc(var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart) + 1rem + var(--pf-t--global--spacer--sm));
2094
- --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
2095
- --pf-v6-c-button--m-link--m-inline--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
2096
- --pf-v6-c-button--span--m-link--m-inline--Display: inline;
2097
- --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--xs);
2098
- --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--xs);
2099
- --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
2100
- --pf-v6-c-button--m-plain--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2101
- --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2102
- --pf-v6-c-button--m-plain--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2103
- --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2104
- --pf-v6-c-button--m-plain--Color: var(--pf-t--global--text--color--regular);
2105
- --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--icon--color--regular);
2106
- --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
2107
- --pf-v6-c-button--m-plain--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--m-plain--PaddingBlockStart) + var(--pf-v6-c-button--m-plain--PaddingBlockEnd));
2108
- --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
2109
- --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
2110
- --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
2111
- --pf-v6-c-button--m-plain--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2112
- --pf-v6-c-button--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
2113
- --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
2114
- --pf-v6-c-button--m-plain--disabled--BackgroundColor: transparent;
2115
- --pf-v6-c-button--m-plain--m-small--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2116
- --pf-v6-c-button--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
2117
- --pf-v6-c-button--m-plain--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
2118
- --pf-v6-c-button--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--xs);
2119
- --pf-v6-c-button--m-plain--m-no-padding--MinWidth: auto;
2120
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: 0;
2121
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
2122
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: 0;
2123
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: 0;
2124
- --pf-v6-c-button--m-plain--m-no-padding--BackgroundColor: transparent;
2125
- --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
2126
- --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
2127
- --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
2128
- --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--small);
1997
+ :where(:root, .pf-v6-c-calendar-month) {
1998
+ --pf-v6-c-calendar-month--BackgroundColor: var(--pf-t--global--background--color--primary--default);
1999
+ --pf-v6-c-calendar-month--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2000
+ --pf-v6-c-calendar-month--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2001
+ --pf-v6-c-calendar-month--PaddingBlockEnd: var(--pf-t--global--spacer--md);
2002
+ --pf-v6-c-calendar-month--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2003
+ --pf-v6-c-calendar-month--FontSize: var(--pf-t--global--font--size--sm);
2004
+ --pf-v6-c-calendar-month__header--MarginBlockEnd: var(--pf-t--global--spacer--md);
2005
+ --pf-v6-c-calendar-month__header--Gap: var(--pf-t--global--spacer--xs);
2006
+ --pf-v6-c-calendar-month__header-year--Width: 9ch;
2007
+ --pf-v6-c-calendar-month__header-nav-control--MarginInlineEnd: 0;
2008
+ --pf-v6-c-calendar-month__header-nav-control--MarginInlineStart: 0;
2009
+ --pf-v6-c-calendar-month__days--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
2010
+ --pf-v6-c-calendar-month__days--BorderBlockEndColor: var(--pf-t--global--border--color--default);
2011
+ --pf-v6-c-calendar-month__day--PaddingBlockEnd: var(--pf-t--global--spacer--md);
2012
+ --pf-v6-c-calendar-month__day--FontWeight: var(--pf-t--global--font--weight--body);
2013
+ --pf-v6-c-calendar-month__day--Color: var(--pf-t--global--text--color--regular);
2014
+ --pf-v6-c-calendar-month__dates-cell--PaddingBlockStart: 0.125rem;
2015
+ --pf-v6-c-calendar-month__dates-cell--PaddingInlineEnd: 0.125rem;
2016
+ --pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd: 0.125rem;
2017
+ --pf-v6-c-calendar-month__dates-cell--PaddingInlineStart: 0.125rem;
2018
+ --pf-v6-c-calendar-month__dates-row--first-child__dates-cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2019
+ --pf-v6-c-calendar-month__dates-cell--m-current__date--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2020
+ --pf-v6-c-calendar-month__dates-cell--m-selected__date--BackgroundColor: var(--pf-t--global--color--brand--default);
2021
+ --pf-v6-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor: var(--pf-t--global--color--brand--default);
2022
+ --pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor: var(--pf-t--global--color--brand--default);
2023
+ --pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor: var(--pf-t--global--border--color--brand--default);
2024
+ --pf-v6-c-calendar-month__dates-cell--m-selected__date--Color: var(--pf-t--global--text--color--on-brand--default);
2025
+ --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
2026
+ --pf-v6-c-calendar-month__dates-cell--before--InsetBlockStart: 0;
2027
+ --pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd: 0;
2028
+ --pf-v6-c-calendar-month__dates-cell--before--InsetBlockEnd: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd);
2029
+ --pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart: 0;
2030
+ --pf-v6-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2031
+ --pf-v6-c-calendar-month__dates-cell--m-in-range--m-start-range--before--InsetInlineStart: 50%;
2032
+ --pf-v6-c-calendar-month__dates-cell--m-in-range--m-end-range--before--InsetInlineEnd: 50%;
2033
+ --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2034
+ --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderWidth: var(--pf-t--global--border--width--regular);
2035
+ --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderColor: var(--pf-t--global--border--color--hover);
2036
+ --pf-v6-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2037
+ --pf-v6-c-calendar-month__dates-cell--m-adjacent-month__date--Color: var(--pf-t--global--text--color--subtle);
2038
+ --pf-v6-c-calendar-month__date--Width: 4ch;
2039
+ --pf-v6-c-calendar-month__date--Height: 4ch;
2040
+ --pf-v6-c-calendar-month__date--BorderRadius: var(--pf-t--global--border--radius--large);
2041
+ --pf-v6-c-calendar-month__date--Color: var(--pf-t--global--text--color--regular);
2042
+ --pf-v6-c-calendar-month__date--BackgroundColor: transparent;
2043
+ --pf-v6-c-calendar-month__date--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
2044
+ --pf-v6-c-calendar-month__date--disabled--Color: var(--pf-t--global--text--color--on-disabled);
2045
+ --pf-v6-c-calendar-month__date--after--BorderWidth: var(--pf-t--global--border--width--regular);
2046
+ --pf-v6-c-calendar-month__date--after--BorderColor: transparent;
2047
+ --pf-v6-c-calendar-month__date--after--OutlineOffset: 0;
2048
+ --pf-v6-c-calendar-month__date--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2049
+ --pf-v6-c-calendar-month__date--hover--BorderWidth: var(--pf-t--global--border--width--regular);
2050
+ --pf-v6-c-calendar-month__date--hover--BorderColor: var(--pf-t--global--border--color--hover);
2051
+ --pf-v6-c-calendar-month__date--focus--Color: var(--pf-t--global--icon--color--on-brand--clicked);
2052
+ --pf-v6-c-calendar-month__date--focus--BackgroundColor: var(--pf-t--global--color--brand--default);
2053
+ --pf-v6-c-calendar-month__date--focus--after--BorderColor: var(--pf-t--global--border--color--hover);
2054
+ --pf-v6-c-calendar-month__date--after--focus--OutlineOffset: -2px;
2055
+ }
2056
+
2057
+ .pf-v6-c-calendar-month {
2058
+ display: inline-flex;
2059
+ flex-direction: column;
2060
+ padding-block-start: var(--pf-v6-c-calendar-month--PaddingBlockStart);
2061
+ padding-block-end: var(--pf-v6-c-calendar-month--PaddingBlockEnd);
2062
+ padding-inline-start: var(--pf-v6-c-calendar-month--PaddingInlineStart);
2063
+ padding-inline-end: var(--pf-v6-c-calendar-month--PaddingInlineEnd);
2064
+ font-size: var(--pf-v6-c-calendar-month--FontSize);
2065
+ background-color: var(--pf-v6-c-calendar-month--BackgroundColor);
2066
+ }
2067
+
2068
+ .pf-v6-c-calendar-month__header {
2069
+ display: flex;
2070
+ gap: var(--pf-v6-c-calendar-month__header--Gap);
2071
+ margin-block-end: var(--pf-v6-c-calendar-month__header--MarginBlockEnd);
2072
+ }
2073
+
2074
+ .pf-v6-c-calendar-month__header-nav-control {
2075
+ margin-inline-start: var(--pf-v6-c-calendar-month__header-nav-control--MarginInlineStart);
2076
+ margin-inline-end: var(--pf-v6-c-calendar-month__header-nav-control--MarginInlineEnd);
2077
+ }
2078
+
2079
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-calendar-month__header-nav-control {
2080
+ scale: -1 1;
2081
+ }
2082
+
2083
+ .pf-v6-c-calendar-month__header-month {
2084
+ flex-grow: 1;
2085
+ }
2086
+
2087
+ .pf-v6-c-calendar-month__header-month > .pf-v6-c-menu-toggle {
2088
+ width: 100%;
2089
+ }
2090
+
2091
+ .pf-v6-c-calendar-month__header-year {
2092
+ width: var(--pf-v6-c-calendar-month__header-year--Width);
2093
+ }
2094
+
2095
+ .pf-v6-c-calendar-month__calendar {
2096
+ table-layout: fixed;
2097
+ }
2098
+
2099
+ .pf-v6-c-calendar-month__days {
2100
+ color: var(--pf-v6-c-calendar-month__day--Color);
2101
+ border-block-end: var(--pf-v6-c-calendar-month__days--BorderBlockEndWidth) solid var(--pf-v6-c-calendar-month__days--BorderBlockEndColor);
2102
+ }
2103
+
2104
+ .pf-v6-c-calendar-month__day {
2105
+ padding-block-end: var(--pf-v6-c-calendar-month__day--PaddingBlockEnd);
2106
+ font-weight: var(--pf-v6-c-calendar-month__day--FontWeight);
2107
+ text-align: center;
2108
+ }
2109
+
2110
+ .pf-v6-c-calendar-month__dates-row:first-child {
2111
+ --pf-v6-c-calendar-month__dates-cell--PaddingBlockStart: var(--pf-v6-c-calendar-month__dates-row--first-child__dates-cell--PaddingBlockStart);
2112
+ }
2113
+
2114
+ .pf-v6-c-calendar-month__dates-cell {
2115
+ --pf-v6-c-calendar-month__dates-cell--before--InsetBlockStart: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockStart);
2116
+ position: relative;
2117
+ padding-block-start: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockStart);
2118
+ padding-block-end: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd);
2119
+ padding-inline-start: var(--pf-v6-c-calendar-month__dates-cell--PaddingInlineStart);
2120
+ padding-inline-end: var(--pf-v6-c-calendar-month__dates-cell--PaddingInlineEnd);
2121
+ text-align: center;
2122
+ }
2123
+
2124
+ .pf-v6-c-calendar-month__dates-cell::before {
2125
+ position: absolute;
2126
+ inset-block-start: var(--pf-v6-c-calendar-month__dates-cell--before--InsetBlockStart);
2127
+ inset-block-end: var(--pf-v6-c-calendar-month__dates-cell--before--InsetBlockEnd);
2128
+ inset-inline-start: var(--pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart);
2129
+ inset-inline-end: var(--pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd);
2130
+ content: "";
2131
+ background-color: var(--pf-v6-c-calendar-month__dates-cell--before--BackgroundColor);
2132
+ }
2133
+
2134
+ .pf-v6-c-calendar-month__dates-cell.pf-m-current {
2135
+ --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-current__date--BackgroundColor);
2136
+ }
2137
+
2138
+ .pf-v6-c-calendar-month__dates-cell.pf-m-in-range {
2139
+ --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor);
2140
+ --pf-v6-c-calendar-month__date--hover--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor);
2141
+ --pf-v6-c-calendar-month__date--hover--BorderWidth: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderWidth);
2142
+ --pf-v6-c-calendar-month__date--hover--BorderColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderColor);
2143
+ --pf-v6-c-calendar-month__date--focus--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor);
2144
+ }
2145
+
2146
+ .pf-v6-c-calendar-month__dates-cell.pf-m-start-range {
2147
+ --pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--m-start-range--before--InsetInlineStart);
2148
+ }
2149
+
2150
+ .pf-v6-c-calendar-month__dates-cell.pf-m-end-range {
2151
+ --pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--m-end-range--before--InsetInlineEnd);
2152
+ }
2153
+
2154
+ .pf-v6-c-calendar-month__dates-cell.pf-m-adjacent-month {
2155
+ --pf-v6-c-calendar-month__date--Color: var(--pf-v6-c-calendar-month__dates-cell--m-adjacent-month__date--Color);
2156
+ }
2157
+
2158
+ .pf-v6-c-calendar-month__dates-cell.pf-m-selected {
2159
+ --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--BackgroundColor);
2160
+ --pf-v6-c-calendar-month__date--Color: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--Color);
2161
+ --pf-v6-c-calendar-month__date--hover--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor);
2162
+ --pf-v6-c-calendar-month__date--hover--BorderWidth: 0;
2163
+ --pf-v6-c-calendar-month__date--focus--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor);
2164
+ --pf-v6-c-calendar-month__date--focus--after--BorderColor: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor);
2165
+ --pf-v6-c-calendar-month__date--after--OutlineOffset: var(--pf-v6-c-calendar-month__date--after--focus--OutlineOffset);
2166
+ }
2167
+
2168
+ .pf-v6-c-calendar-month__dates-cell.pf-m-disabled {
2169
+ --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
2170
+ --pf-v6-c-calendar-month__date--BackgroundColor: transparent;
2171
+ }
2172
+
2173
+ .pf-v6-c-calendar-month__date {
2174
+ position: relative;
2175
+ display: inline-flex;
2176
+ align-items: center;
2177
+ justify-content: center;
2178
+ width: var(--pf-v6-c-calendar-month__date--Width);
2179
+ height: var(--pf-v6-c-calendar-month__date--Height);
2180
+ line-height: 1;
2181
+ color: var(--pf-v6-c-calendar-month__date--Color);
2182
+ background-color: var(--pf-v6-c-calendar-month__date--BackgroundColor);
2183
+ border: 0;
2184
+ }
2185
+
2186
+ .pf-v6-c-calendar-month__date::after {
2187
+ position: absolute;
2188
+ inset-block-start: var(--pf-v6-c-calendar-month__date--after--OutlineOffset);
2189
+ inset-block-end: var(--pf-v6-c-calendar-month__date--after--OutlineOffset);
2190
+ inset-inline-start: var(--pf-v6-c-calendar-month__date--after--OutlineOffset);
2191
+ inset-inline-end: var(--pf-v6-c-calendar-month__date--after--OutlineOffset);
2192
+ content: "";
2193
+ border: var(--pf-v6-c-calendar-month__date--after--BorderWidth) solid var(--pf-v6-c-calendar-month__date--after--BorderColor);
2194
+ }
2195
+
2196
+ .pf-v6-c-calendar-month__date, .pf-v6-c-calendar-month__date::after {
2197
+ border-radius: var(--pf-v6-c-calendar-month__date--BorderRadius);
2198
+ }
2199
+
2200
+ .pf-v6-c-calendar-month__date:hover, .pf-v6-c-calendar-month__date.pf-m-hover {
2201
+ --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__date--hover--BackgroundColor);
2202
+ border: var(--pf-v6-c-calendar-month__date--hover--BorderColor) solid var(--pf-v6-c-calendar-month__date--hover--BorderWidth);
2203
+ }
2204
+
2205
+ .pf-v6-c-calendar-month__date:focus, .pf-v6-c-calendar-month__date.pf-m-focus {
2206
+ --pf-v6-c-calendar-month__date--after--BorderColor: var(--pf-v6-c-calendar-month__date--focus--after--BorderColor);
2207
+ outline: 0;
2208
+ }
2209
+
2210
+ .pf-v6-c-calendar-month__date:disabled {
2211
+ --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__date--disabled--BackgroundColor);
2212
+ --pf-v6-c-calendar-month__date--Color: var(--pf-v6-c-calendar-month__date--disabled--Color);
2213
+ --pf-v6-c-calendar-month__date--hover--focus--BorderColor: transparent;
2214
+ pointer-events: none;
2215
+ }
2216
+
2217
+ :where(:root, .pf-v6-c-button) {
2218
+ --pf-v6-c-button--Display: inline-flex;
2219
+ --pf-v6-c-button--AlignItems: baseline;
2220
+ --pf-v6-c-button--JustifyContent: center;
2221
+ --pf-v6-c-button--Gap: var(--pf-t--global--spacer--gap--text-to-element--default);
2222
+ --pf-v6-c-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2223
+ --pf-v6-c-button--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2224
+ --pf-v6-c-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2225
+ --pf-v6-c-button--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2226
+ --pf-v6-c-button--Color: var(--pf-t--global--text--color--regular);
2227
+ --pf-v6-c-button--LineHeight: var(--pf-t--global--font--line-height--body);
2228
+ --pf-v6-c-button--FontWeight: var(--pf-t--global--font--weight--body);
2229
+ --pf-v6-c-button--FontSize: var(--pf-t--global--font--size--body--default);
2230
+ --pf-v6-c-button--BackgroundColor: transparent;
2231
+ --pf-v6-c-button--BorderColor: transparent;
2232
+ --pf-v6-c-button--BorderWidth: var(--pf-t--global--border--width--action--default);
2233
+ --pf-v6-c-button--BorderRadius: var(--pf-t--global--border--radius--pill);
2234
+ --pf-v6-c-button--TextDecoration: none;
2235
+ --pf-v6-c-button--TransitionDuration: var(--pf-t--global--motion--duration--fade--default);
2236
+ --pf-v6-c-button--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
2237
+ --pf-v6-c-button--TransitionProperty: color, background-color, border-width, border-color, padding;
2238
+ --pf-v6-c-button--hover--BackgroundColor: transparent;
2239
+ --pf-v6-c-button--hover--BorderColor: transparent;
2240
+ --pf-v6-c-button--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
2241
+ --pf-v6-c-button--hover--TextDecoration: none;
2242
+ --pf-v6-c-button--m-clicked--BackgroundColor: transparent;
2243
+ --pf-v6-c-button--m-clicked--BorderColor: transparent;
2244
+ --pf-v6-c-button--m-clicked--BorderWidth: var(--pf-t--global--border--width--action--clicked);
2245
+ --pf-v6-c-button--m-primary--Color: var(--pf-t--global--text--color--on-brand--default);
2246
+ --pf-v6-c-button--m-primary--BackgroundColor: var(--pf-t--global--color--brand--default);
2247
+ --pf-v6-c-button--m-primary__icon--Color: var(--pf-t--global--icon--color--on-brand--default);
2248
+ --pf-v6-c-button--m-primary--hover--Color: var(--pf-t--global--text--color--on-brand--hover);
2249
+ --pf-v6-c-button--m-primary--hover--BackgroundColor: var(--pf-t--global--color--brand--hover);
2250
+ --pf-v6-c-button--m-primary--hover__icon--Color: var(--pf-t--global--icon--color--on-brand--hover);
2251
+ --pf-v6-c-button--m-primary--m-clicked--Color: var(--pf-t--global--text--color--on-brand--clicked);
2252
+ --pf-v6-c-button--m-primary--m-clicked--BackgroundColor: var(--pf-t--global--color--brand--clicked);
2253
+ --pf-v6-c-button--m-primary--m-clicked__icon--Color: var(--pf-t--global--icon--color--on-brand--clicked);
2254
+ --pf-v6-c-button--m-secondary--Color: var(--pf-t--global--text--color--brand--default);
2255
+ --pf-v6-c-button--m-secondary--BorderColor: var(--pf-t--global--border--color--brand--default);
2256
+ --pf-v6-c-button--m-secondary__icon--Color: var(--pf-t--global--icon--color--brand--default);
2257
+ --pf-v6-c-button--m-secondary--hover--Color: var(--pf-t--global--text--color--brand--hover);
2258
+ --pf-v6-c-button--m-secondary--hover--BorderColor: var(--pf-t--global--border--color--brand--hover);
2259
+ --pf-v6-c-button--m-secondary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
2260
+ --pf-v6-c-button--m-secondary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
2261
+ --pf-v6-c-button--m-secondary--m-clicked--BorderColor: var(--pf-t--global--border--color--brand--clicked);
2262
+ --pf-v6-c-button--m-secondary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
2263
+ --pf-v6-c-button--m-secondary--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
2264
+ --pf-v6-c-button--m-secondary--m-danger--BorderColor: var(--pf-t--global--border--color--status--danger--default);
2265
+ --pf-v6-c-button--m-secondary--m-danger__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
2266
+ --pf-v6-c-button--m-secondary--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
2267
+ --pf-v6-c-button--m-secondary--m-danger--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
2268
+ --pf-v6-c-button--m-secondary--m-danger--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
2269
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
2270
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked--BorderColor: var(--pf-t--global--border--color--status--danger--clicked);
2271
+ --pf-v6-c-button--m-secondary--m-danger--m-clicked__icon--Color: var(--pf-t--global--icon--color--status--danger--clicked);
2272
+ --pf-v6-c-button--m-tertiary--Color: var(--pf-t--global--text--color--brand--default);
2273
+ --pf-v6-c-button--m-tertiary--BorderColor: var(--pf-t--global--border--color--default);
2274
+ --pf-v6-c-button--m-tertiary__icon--Color: var(--pf-t--global--icon--color--brand--default);
2275
+ --pf-v6-c-button--m-tertiary--hover--Color: var(--pf-t--global--text--color--brand--hover);
2276
+ --pf-v6-c-button--m-tertiary--hover--BorderColor: var(--pf-t--global--border--color--hover);
2277
+ --pf-v6-c-button--m-tertiary--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
2278
+ --pf-v6-c-button--m-tertiary--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
2279
+ --pf-v6-c-button--m-tertiary--m-clicked--BorderColor: var(--pf-t--global--border--color--clicked);
2280
+ --pf-v6-c-button--m-tertiary--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
2281
+ --pf-v6-c-button--m-link--BorderRadius: var(--pf-t--global--border--radius--small);
2282
+ --pf-v6-c-button--m-link--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2283
+ --pf-v6-c-button--m-link--PaddingInlineStart: var(--pf-t--global--spacer--md);
2284
+ --pf-v6-c-button--m-link--Color: var(--pf-t--global--text--color--brand--default);
2285
+ --pf-v6-c-button--m-link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
2286
+ --pf-v6-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--brand--default);
2287
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-t--global--text--color--brand--hover);
2288
+ --pf-v6-c-button--m-link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
2289
+ --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-t--global--text--color--brand--hover);
2290
+ --pf-v6-c-button--m-link--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
2291
+ --pf-v6-c-button--m-link--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2292
+ --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-t--global--text--color--brand--clicked);
2293
+ --pf-v6-c-button--m-link--m-danger--Color: var(--pf-t--global--text--color--status--danger--default);
2294
+ --pf-v6-c-button--m-link--m-danger--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
2295
+ --pf-v6-c-button--m-link--m-danger__icon--Color: var(--pf-t--global--text--color--status--danger--default);
2296
+ --pf-v6-c-button--m-link--m-danger--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
2297
+ --pf-v6-c-button--m-link--m-danger--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
2298
+ --pf-v6-c-button--m-link--m-danger--hover__icon--Color: var(--pf-t--global--text--color--status--danger--hover);
2299
+ --pf-v6-c-button--m-link--m-danger--m-clicked--Color: var(--pf-t--global--text--color--status--danger--clicked);
2300
+ --pf-v6-c-button--m-link--m-danger--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2301
+ --pf-v6-c-button--m-link--m-danger--m-clicked__icon--Color: var(--pf-t--global--text--color--status--danger--clicked);
2302
+ --pf-v6-c-button--m-link--m-inline--Display: inline-flex;
2303
+ --pf-v6-c-button--m-link--m-inline--JustifyContent: flex-start;
2304
+ --pf-v6-c-button--m-link--m-inline--FontSize: initial;
2305
+ --pf-v6-c-button--m-link--m-inline--LineHeight: initial;
2306
+ --pf-v6-c-button--m-link--m-inline--FontWeight: initial;
2307
+ --pf-v6-c-button--m-link--m-inline--PaddingBlockStart: 0;
2308
+ --pf-v6-c-button--m-link--m-inline--PaddingInlineEnd: 0;
2309
+ --pf-v6-c-button--m-link--m-inline--PaddingBlockEnd: 0;
2310
+ --pf-v6-c-button--m-link--m-inline--PaddingInlineStart: 0;
2311
+ --pf-v6-c-button--m-link--m-inline--hover--TextDecoration: var(--pf-t--global--link--text-decoration--hover);
2312
+ --pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart: var(--pf-t--global--spacer--xs);
2313
+ --pf-v6-c-button--m-link--m-inline--m-in-progress--PaddingInlineStart: calc(var(--pf-v6-c-button--m-link--m-inline__progress--InsetInlineStart) + 1rem + var(--pf-t--global--spacer--sm));
2314
+ --pf-v6-c-button--m-link--m-inline--disabled--Color: var(--pf-t--global--text--color--disabled);
2315
+ --pf-v6-c-button--m-link--m-inline--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
2316
+ --pf-v6-c-button--span--m-link--m-inline--Display: inline;
2317
+ --pf-v6-c-button--span--m-link--m-inline__icon--m-start--MarginInlineEnd: var(--pf-t--global--spacer--xs);
2318
+ --pf-v6-c-button--span--m-link--m-inline__icon--m-end--MarginInlineStart: var(--pf-t--global--spacer--xs);
2319
+ --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--small);
2320
+ --pf-v6-c-button--m-plain--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2321
+ --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2322
+ --pf-v6-c-button--m-plain--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
2323
+ --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2324
+ --pf-v6-c-button--m-plain--Color: var(--pf-t--global--text--color--regular);
2325
+ --pf-v6-c-button--m-plain__icon--Color: var(--pf-t--global--icon--color--regular);
2326
+ --pf-v6-c-button--m-plain--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
2327
+ --pf-v6-c-button--m-plain--MinWidth: calc(1em * var(--pf-v6-c-button--LineHeight) + var(--pf-v6-c-button--m-plain--PaddingBlockStart) + var(--pf-v6-c-button--m-plain--PaddingBlockEnd));
2328
+ --pf-v6-c-button--m-plain--hover--Color: var(--pf-t--global--icon--color--regular);
2329
+ --pf-v6-c-button--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
2330
+ --pf-v6-c-button--m-plain--m-clicked--Color: var(--pf-t--global--icon--color--regular);
2331
+ --pf-v6-c-button--m-plain--m-clicked--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
2332
+ --pf-v6-c-button--m-plain--disabled--Color: var(--pf-t--global--text--color--disabled);
2333
+ --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-t--global--icon--color--disabled);
2334
+ --pf-v6-c-button--m-plain--disabled--BackgroundColor: transparent;
2335
+ --pf-v6-c-button--m-plain--m-small--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2336
+ --pf-v6-c-button--m-plain--m-small--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
2337
+ --pf-v6-c-button--m-plain--m-small--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
2338
+ --pf-v6-c-button--m-plain--m-small--PaddingInlineStart: var(--pf-t--global--spacer--xs);
2339
+ --pf-v6-c-button--m-plain--m-no-padding--MinWidth: auto;
2340
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: 0;
2341
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: 0;
2342
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: 0;
2343
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: 0;
2344
+ --pf-v6-c-button--m-plain--m-no-padding--BackgroundColor: transparent;
2345
+ --pf-v6-c-button--m-plain--m-no-padding--hover--BackgroundColor: transparent;
2346
+ --pf-v6-c-button--m-plain--m-no-padding--m-clicked--BackgroundColor: transparent;
2347
+ --pf-v6-c-button__progress--Color: var(--pf-v6-c-button__icon--Color);
2348
+ --pf-v6-c-button--m-control--BorderRadius: var(--pf-t--global--border--radius--small);
2129
2349
  --pf-v6-c-button--m-control--PaddingInlineStart: var(--pf-t--global--spacer--md);
2130
2350
  --pf-v6-c-button--m-control--PaddingInlineEnd: var(--pf-t--global--spacer--md);
2131
2351
  --pf-v6-c-button--m-control--Color: var(--pf-t--global--text--color--regular);
@@ -2580,261 +2800,41 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2580
2800
  --pf-v6-c-button__progress--InsetInlineStart: var(--pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart);
2581
2801
  --pf-v6-c-button__progress--TranslateX: var(--pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX);
2582
2802
  }
2583
-
2584
- .pf-v6-c-button.pf-m-in-progress.pf-m-plain > :not(.pf-v6-c-button__progress) {
2585
- opacity: 0;
2586
- }
2587
-
2588
- .pf-v6-c-button__icon {
2589
- margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
2590
- margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
2591
- color: var(--pf-v6-c-button__icon--Color);
2592
- }
2593
-
2594
- .pf-v6-c-button__icon.pf-m-start {
2595
- --pf-v6-c-button__icon--MarginInlineEnd: var(--pf-v6-c-button__icon--m-start--MarginInlineEnd);
2596
- }
2597
-
2598
- .pf-v6-c-button__icon.pf-m-end {
2599
- --pf-v6-c-button__icon--MarginInlineStart: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
2600
- }
2601
-
2602
- .pf-v6-c-button__progress {
2603
- position: absolute;
2604
- inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
2605
- inset-inline-start: var(--pf-v6-c-button__progress--InsetInlineStart);
2606
- line-height: 1;
2607
- color: var(--pf-v6-c-button__progress--Color);
2608
- transform: translate(var(--pf-v6-c-button__progress--TranslateX), var(--pf-v6-c-button__progress--TranslateY));
2609
- }
2610
-
2611
- .pf-v6-c-button__progress .pf-v6-c-spinner {
2612
- --pf-v6-c-spinner--Color: currentcolor;
2613
- }
2614
-
2615
- .pf-v6-c-button__count {
2616
- display: inline-flex;
2617
- align-items: center;
2618
- }
2619
-
2620
- :where(:root, .pf-v6-c-calendar-month) {
2621
- --pf-v6-c-calendar-month--BackgroundColor: var(--pf-t--global--background--color--primary--default);
2622
- --pf-v6-c-calendar-month--PaddingBlockStart: var(--pf-t--global--spacer--lg);
2623
- --pf-v6-c-calendar-month--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
2624
- --pf-v6-c-calendar-month--PaddingBlockEnd: var(--pf-t--global--spacer--md);
2625
- --pf-v6-c-calendar-month--PaddingInlineStart: var(--pf-t--global--spacer--lg);
2626
- --pf-v6-c-calendar-month--FontSize: var(--pf-t--global--font--size--sm);
2627
- --pf-v6-c-calendar-month__header--MarginBlockEnd: var(--pf-t--global--spacer--md);
2628
- --pf-v6-c-calendar-month__header--Gap: var(--pf-t--global--spacer--xs);
2629
- --pf-v6-c-calendar-month__header-year--Width: 9ch;
2630
- --pf-v6-c-calendar-month__header-nav-control--MarginInlineEnd: 0;
2631
- --pf-v6-c-calendar-month__header-nav-control--MarginInlineStart: 0;
2632
- --pf-v6-c-calendar-month__days--BorderBlockEndWidth: var(--pf-t--global--border--width--divider--default);
2633
- --pf-v6-c-calendar-month__days--BorderBlockEndColor: var(--pf-t--global--border--color--default);
2634
- --pf-v6-c-calendar-month__day--PaddingBlockEnd: var(--pf-t--global--spacer--md);
2635
- --pf-v6-c-calendar-month__day--FontWeight: var(--pf-t--global--font--weight--body);
2636
- --pf-v6-c-calendar-month__day--Color: var(--pf-t--global--text--color--regular);
2637
- --pf-v6-c-calendar-month__dates-cell--PaddingBlockStart: 0.125rem;
2638
- --pf-v6-c-calendar-month__dates-cell--PaddingInlineEnd: 0.125rem;
2639
- --pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd: 0.125rem;
2640
- --pf-v6-c-calendar-month__dates-cell--PaddingInlineStart: 0.125rem;
2641
- --pf-v6-c-calendar-month__dates-row--first-child__dates-cell--PaddingBlockStart: var(--pf-t--global--spacer--sm);
2642
- --pf-v6-c-calendar-month__dates-cell--m-current__date--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2643
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--BackgroundColor: var(--pf-t--global--color--brand--default);
2644
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor: var(--pf-t--global--color--brand--default);
2645
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor: var(--pf-t--global--color--brand--default);
2646
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor: var(--pf-t--global--border--color--brand--default);
2647
- --pf-v6-c-calendar-month__dates-cell--m-selected__date--Color: var(--pf-t--global--text--color--on-brand--default);
2648
- --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
2649
- --pf-v6-c-calendar-month__dates-cell--before--InsetBlockStart: 0;
2650
- --pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd: 0;
2651
- --pf-v6-c-calendar-month__dates-cell--before--InsetBlockEnd: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd);
2652
- --pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart: 0;
2653
- --pf-v6-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2654
- --pf-v6-c-calendar-month__dates-cell--m-in-range--m-start-range--before--InsetInlineStart: 50%;
2655
- --pf-v6-c-calendar-month__dates-cell--m-in-range--m-end-range--before--InsetInlineEnd: 50%;
2656
- --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2657
- --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderWidth: var(--pf-t--global--border--width--regular);
2658
- --pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderColor: var(--pf-t--global--border--color--hover);
2659
- --pf-v6-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2660
- --pf-v6-c-calendar-month__dates-cell--m-adjacent-month__date--Color: var(--pf-t--global--text--color--subtle);
2661
- --pf-v6-c-calendar-month__date--Width: 4ch;
2662
- --pf-v6-c-calendar-month__date--Height: 4ch;
2663
- --pf-v6-c-calendar-month__date--BorderRadius: var(--pf-t--global--border--radius--large);
2664
- --pf-v6-c-calendar-month__date--Color: var(--pf-t--global--text--color--regular);
2665
- --pf-v6-c-calendar-month__date--BackgroundColor: transparent;
2666
- --pf-v6-c-calendar-month__date--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
2667
- --pf-v6-c-calendar-month__date--disabled--Color: var(--pf-t--global--text--color--on-disabled);
2668
- --pf-v6-c-calendar-month__date--after--BorderWidth: var(--pf-t--global--border--width--regular);
2669
- --pf-v6-c-calendar-month__date--after--BorderColor: transparent;
2670
- --pf-v6-c-calendar-month__date--after--OutlineOffset: 0;
2671
- --pf-v6-c-calendar-month__date--hover--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
2672
- --pf-v6-c-calendar-month__date--hover--BorderWidth: var(--pf-t--global--border--width--regular);
2673
- --pf-v6-c-calendar-month__date--hover--BorderColor: var(--pf-t--global--border--color--hover);
2674
- --pf-v6-c-calendar-month__date--focus--Color: var(--pf-t--global--icon--color--on-brand--clicked);
2675
- --pf-v6-c-calendar-month__date--focus--BackgroundColor: var(--pf-t--global--color--brand--default);
2676
- --pf-v6-c-calendar-month__date--focus--after--BorderColor: var(--pf-t--global--border--color--hover);
2677
- --pf-v6-c-calendar-month__date--after--focus--OutlineOffset: -2px;
2678
- }
2679
-
2680
- .pf-v6-c-calendar-month {
2681
- display: inline-flex;
2682
- flex-direction: column;
2683
- padding-block-start: var(--pf-v6-c-calendar-month--PaddingBlockStart);
2684
- padding-block-end: var(--pf-v6-c-calendar-month--PaddingBlockEnd);
2685
- padding-inline-start: var(--pf-v6-c-calendar-month--PaddingInlineStart);
2686
- padding-inline-end: var(--pf-v6-c-calendar-month--PaddingInlineEnd);
2687
- font-size: var(--pf-v6-c-calendar-month--FontSize);
2688
- background-color: var(--pf-v6-c-calendar-month--BackgroundColor);
2689
- }
2690
-
2691
- .pf-v6-c-calendar-month__header {
2692
- display: flex;
2693
- gap: var(--pf-v6-c-calendar-month__header--Gap);
2694
- margin-block-end: var(--pf-v6-c-calendar-month__header--MarginBlockEnd);
2695
- }
2696
-
2697
- .pf-v6-c-calendar-month__header-nav-control {
2698
- margin-inline-start: var(--pf-v6-c-calendar-month__header-nav-control--MarginInlineStart);
2699
- margin-inline-end: var(--pf-v6-c-calendar-month__header-nav-control--MarginInlineEnd);
2700
- }
2701
-
2702
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-calendar-month__header-nav-control {
2703
- scale: -1 1;
2704
- }
2705
-
2706
- .pf-v6-c-calendar-month__header-month {
2707
- flex-grow: 1;
2708
- }
2709
-
2710
- .pf-v6-c-calendar-month__header-month > .pf-v6-c-menu-toggle {
2711
- width: 100%;
2712
- }
2713
-
2714
- .pf-v6-c-calendar-month__header-year {
2715
- width: var(--pf-v6-c-calendar-month__header-year--Width);
2716
- }
2717
-
2718
- .pf-v6-c-calendar-month__calendar {
2719
- table-layout: fixed;
2720
- }
2721
-
2722
- .pf-v6-c-calendar-month__days {
2723
- color: var(--pf-v6-c-calendar-month__day--Color);
2724
- border-block-end: var(--pf-v6-c-calendar-month__days--BorderBlockEndWidth) solid var(--pf-v6-c-calendar-month__days--BorderBlockEndColor);
2725
- }
2726
-
2727
- .pf-v6-c-calendar-month__day {
2728
- padding-block-end: var(--pf-v6-c-calendar-month__day--PaddingBlockEnd);
2729
- font-weight: var(--pf-v6-c-calendar-month__day--FontWeight);
2730
- text-align: center;
2731
- }
2732
-
2733
- .pf-v6-c-calendar-month__dates-row:first-child {
2734
- --pf-v6-c-calendar-month__dates-cell--PaddingBlockStart: var(--pf-v6-c-calendar-month__dates-row--first-child__dates-cell--PaddingBlockStart);
2735
- }
2736
-
2737
- .pf-v6-c-calendar-month__dates-cell {
2738
- --pf-v6-c-calendar-month__dates-cell--before--InsetBlockStart: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockStart);
2739
- position: relative;
2740
- padding-block-start: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockStart);
2741
- padding-block-end: var(--pf-v6-c-calendar-month__dates-cell--PaddingBlockEnd);
2742
- padding-inline-start: var(--pf-v6-c-calendar-month__dates-cell--PaddingInlineStart);
2743
- padding-inline-end: var(--pf-v6-c-calendar-month__dates-cell--PaddingInlineEnd);
2744
- text-align: center;
2745
- }
2746
-
2747
- .pf-v6-c-calendar-month__dates-cell::before {
2748
- position: absolute;
2749
- inset-block-start: var(--pf-v6-c-calendar-month__dates-cell--before--InsetBlockStart);
2750
- inset-block-end: var(--pf-v6-c-calendar-month__dates-cell--before--InsetBlockEnd);
2751
- inset-inline-start: var(--pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart);
2752
- inset-inline-end: var(--pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd);
2753
- content: "";
2754
- background-color: var(--pf-v6-c-calendar-month__dates-cell--before--BackgroundColor);
2755
- }
2756
-
2757
- .pf-v6-c-calendar-month__dates-cell.pf-m-current {
2758
- --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-current__date--BackgroundColor);
2759
- }
2760
-
2761
- .pf-v6-c-calendar-month__dates-cell.pf-m-in-range {
2762
- --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--before--BackgroundColor);
2763
- --pf-v6-c-calendar-month__date--hover--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BackgroundColor);
2764
- --pf-v6-c-calendar-month__date--hover--BorderWidth: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderWidth);
2765
- --pf-v6-c-calendar-month__date--hover--BorderColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--hover--BorderColor);
2766
- --pf-v6-c-calendar-month__date--focus--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-in-range__date--focus--BackgroundColor);
2767
- }
2768
-
2769
- .pf-v6-c-calendar-month__dates-cell.pf-m-start-range {
2770
- --pf-v6-c-calendar-month__dates-cell--before--InsetInlineStart: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--m-start-range--before--InsetInlineStart);
2771
- }
2772
-
2773
- .pf-v6-c-calendar-month__dates-cell.pf-m-end-range {
2774
- --pf-v6-c-calendar-month__dates-cell--before--InsetInlineEnd: var(--pf-v6-c-calendar-month__dates-cell--m-in-range--m-end-range--before--InsetInlineEnd);
2775
- }
2776
-
2777
- .pf-v6-c-calendar-month__dates-cell.pf-m-adjacent-month {
2778
- --pf-v6-c-calendar-month__date--Color: var(--pf-v6-c-calendar-month__dates-cell--m-adjacent-month__date--Color);
2779
- }
2780
-
2781
- .pf-v6-c-calendar-month__dates-cell.pf-m-selected {
2782
- --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--BackgroundColor);
2783
- --pf-v6-c-calendar-month__date--Color: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--Color);
2784
- --pf-v6-c-calendar-month__date--hover--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--hover--BackgroundColor);
2785
- --pf-v6-c-calendar-month__date--hover--BorderWidth: 0;
2786
- --pf-v6-c-calendar-month__date--focus--BackgroundColor: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--BackgroundColor);
2787
- --pf-v6-c-calendar-month__date--focus--after--BorderColor: var(--pf-v6-c-calendar-month__dates-cell--m-selected__date--focus--after--BorderColor);
2788
- --pf-v6-c-calendar-month__date--after--OutlineOffset: var(--pf-v6-c-calendar-month__date--after--focus--OutlineOffset);
2789
- }
2790
-
2791
- .pf-v6-c-calendar-month__dates-cell.pf-m-disabled {
2792
- --pf-v6-c-calendar-month__dates-cell--before--BackgroundColor: transparent;
2793
- --pf-v6-c-calendar-month__date--BackgroundColor: transparent;
2794
- }
2795
-
2796
- .pf-v6-c-calendar-month__date {
2797
- position: relative;
2798
- display: inline-flex;
2799
- align-items: center;
2800
- justify-content: center;
2801
- width: var(--pf-v6-c-calendar-month__date--Width);
2802
- height: var(--pf-v6-c-calendar-month__date--Height);
2803
- line-height: 1;
2804
- color: var(--pf-v6-c-calendar-month__date--Color);
2805
- background-color: var(--pf-v6-c-calendar-month__date--BackgroundColor);
2806
- border: 0;
2803
+
2804
+ .pf-v6-c-button.pf-m-in-progress.pf-m-plain > :not(.pf-v6-c-button__progress) {
2805
+ opacity: 0;
2807
2806
  }
2808
2807
 
2809
- .pf-v6-c-calendar-month__date::after {
2810
- position: absolute;
2811
- inset-block-start: var(--pf-v6-c-calendar-month__date--after--OutlineOffset);
2812
- inset-block-end: var(--pf-v6-c-calendar-month__date--after--OutlineOffset);
2813
- inset-inline-start: var(--pf-v6-c-calendar-month__date--after--OutlineOffset);
2814
- inset-inline-end: var(--pf-v6-c-calendar-month__date--after--OutlineOffset);
2815
- content: "";
2816
- border: var(--pf-v6-c-calendar-month__date--after--BorderWidth) solid var(--pf-v6-c-calendar-month__date--after--BorderColor);
2808
+ .pf-v6-c-button__icon {
2809
+ margin-inline-start: var(--pf-v6-c-button__icon--MarginInlineStart);
2810
+ margin-inline-end: var(--pf-v6-c-button__icon--MarginInlineEnd);
2811
+ color: var(--pf-v6-c-button__icon--Color);
2817
2812
  }
2818
2813
 
2819
- .pf-v6-c-calendar-month__date, .pf-v6-c-calendar-month__date::after {
2820
- border-radius: var(--pf-v6-c-calendar-month__date--BorderRadius);
2814
+ .pf-v6-c-button__icon.pf-m-start {
2815
+ --pf-v6-c-button__icon--MarginInlineEnd: var(--pf-v6-c-button__icon--m-start--MarginInlineEnd);
2821
2816
  }
2822
2817
 
2823
- .pf-v6-c-calendar-month__date:hover, .pf-v6-c-calendar-month__date.pf-m-hover {
2824
- --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__date--hover--BackgroundColor);
2825
- border: var(--pf-v6-c-calendar-month__date--hover--BorderColor) solid var(--pf-v6-c-calendar-month__date--hover--BorderWidth);
2818
+ .pf-v6-c-button__icon.pf-m-end {
2819
+ --pf-v6-c-button__icon--MarginInlineStart: var(--pf-v6-c-button__icon--m-end--MarginInlineStart);
2826
2820
  }
2827
2821
 
2828
- .pf-v6-c-calendar-month__date:focus, .pf-v6-c-calendar-month__date.pf-m-focus {
2829
- --pf-v6-c-calendar-month__date--after--BorderColor: var(--pf-v6-c-calendar-month__date--focus--after--BorderColor);
2830
- outline: 0;
2822
+ .pf-v6-c-button__progress {
2823
+ position: absolute;
2824
+ inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
2825
+ inset-inline-start: var(--pf-v6-c-button__progress--InsetInlineStart);
2826
+ line-height: 1;
2827
+ color: var(--pf-v6-c-button__progress--Color);
2828
+ transform: translate(var(--pf-v6-c-button__progress--TranslateX), var(--pf-v6-c-button__progress--TranslateY));
2831
2829
  }
2832
2830
 
2833
- .pf-v6-c-calendar-month__date:disabled {
2834
- --pf-v6-c-calendar-month__date--BackgroundColor: var(--pf-v6-c-calendar-month__date--disabled--BackgroundColor);
2835
- --pf-v6-c-calendar-month__date--Color: var(--pf-v6-c-calendar-month__date--disabled--Color);
2836
- --pf-v6-c-calendar-month__date--hover--focus--BorderColor: transparent;
2837
- pointer-events: none;
2831
+ .pf-v6-c-button__progress .pf-v6-c-spinner {
2832
+ --pf-v6-c-spinner--Color: currentcolor;
2833
+ }
2834
+
2835
+ .pf-v6-c-button__count {
2836
+ display: inline-flex;
2837
+ align-items: center;
2838
2838
  }
2839
2839
 
2840
2840
  :where(:root, .pf-v6-c-card) {
@@ -7542,588 +7542,230 @@ select ~ .pf-v6-c-form-control__utilities {
7542
7542
  --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-md__content--FontSize);
7543
7543
  }
7544
7544
 
7545
- .pf-v6-c-icon.pf-m-heading-lg {
7546
- --pf-v6-c-icon--Width: var(--pf-v6-c-icon--m-heading-lg--Width);
7547
- --pf-v6-c-icon--Height: var(--pf-v6-c-icon--m-heading-lg--Height);
7548
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-lg__content--FontSize);
7549
- }
7550
-
7551
- .pf-v6-c-icon.pf-m-heading-xl {
7552
- --pf-v6-c-icon--Width: var(--pf-v6-c-icon--m-heading-xl--Width);
7553
- --pf-v6-c-icon--Height: var(--pf-v6-c-icon--m-heading-xl--Height);
7554
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-xl__content--FontSize);
7555
- }
7556
-
7557
- .pf-v6-c-icon.pf-m-heading-2xl {
7558
- --pf-v6-c-icon--Width: var(--pf-v6-c-icon--m-heading-2xl--Width);
7559
- --pf-v6-c-icon--Height: var(--pf-v6-c-icon--m-heading-2xl--Height);
7560
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-2xl__content--FontSize);
7561
- }
7562
-
7563
- .pf-v6-c-icon.pf-m-heading-3xl {
7564
- --pf-v6-c-icon--Width: var(--pf-v6-c-icon--m-heading-3xl--Width);
7565
- --pf-v6-c-icon--Height: var(--pf-v6-c-icon--m-heading-3xl--Height);
7566
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-3xl__content--FontSize);
7567
- }
7568
-
7569
- .pf-v6-c-icon.pf-m-in-progress {
7570
- --pf-v6-c-icon__content--Opacity: 0;
7571
- --pf-v6-c-icon__progress--Opacity: 1;
7572
- }
7573
-
7574
- .pf-v6-c-icon__content,
7575
- .pf-v6-c-icon__progress {
7576
- font-size: var(--pf-v6-c-icon__content--FontSize);
7577
- }
7578
-
7579
- .pf-v6-c-icon__content svg,
7580
- .pf-v6-c-icon__progress svg {
7581
- vertical-align: var(--pf-v6-c-icon__content--svg--VerticalAlign);
7582
- }
7583
-
7584
- .pf-v6-c-icon__content.pf-m-sm,
7585
- .pf-v6-c-icon__progress.pf-m-sm {
7586
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-sm__content--FontSize);
7587
- }
7588
-
7589
- .pf-v6-c-icon__content.pf-m-md,
7590
- .pf-v6-c-icon__progress.pf-m-md {
7591
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-md__content--FontSize);
7592
- }
7593
-
7594
- .pf-v6-c-icon__content.pf-m-lg,
7595
- .pf-v6-c-icon__progress.pf-m-lg {
7596
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-lg__content--FontSize);
7597
- }
7598
-
7599
- .pf-v6-c-icon__content.pf-m-xl,
7600
- .pf-v6-c-icon__progress.pf-m-xl {
7601
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-xl__content--FontSize);
7602
- }
7603
-
7604
- .pf-v6-c-icon__content.pf-m-2xl,
7605
- .pf-v6-c-icon__progress.pf-m-2xl {
7606
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-2xl__content--FontSize);
7607
- }
7608
-
7609
- .pf-v6-c-icon__content.pf-m-3xl,
7610
- .pf-v6-c-icon__progress.pf-m-3xl {
7611
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-3xl__content--FontSize);
7612
- }
7613
-
7614
- .pf-v6-c-icon__content.pf-m-body-sm,
7615
- .pf-v6-c-icon__progress.pf-m-body-sm {
7616
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-body-sm__content--FontSize);
7617
- }
7618
-
7619
- .pf-v6-c-icon__content.pf-m-body-default,
7620
- .pf-v6-c-icon__progress.pf-m-body-default {
7621
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-md__content--FontSize);
7622
- }
7623
-
7624
- .pf-v6-c-icon__content.pf-m-body-lg,
7625
- .pf-v6-c-icon__progress.pf-m-body-lg {
7626
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-lg__content--FontSize);
7627
- }
7628
-
7629
- .pf-v6-c-icon__content.pf-m-heading-sm,
7630
- .pf-v6-c-icon__progress.pf-m-heading-sm {
7631
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-sm__content--FontSize);
7632
- }
7633
-
7634
- .pf-v6-c-icon__content.pf-m-heading-md,
7635
- .pf-v6-c-icon__progress.pf-m-heading-md {
7636
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-md__content--FontSize);
7637
- }
7638
-
7639
- .pf-v6-c-icon__content.pf-m-heading-lg,
7640
- .pf-v6-c-icon__progress.pf-m-heading-lg {
7641
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-lg__content--FontSize);
7642
- }
7643
-
7644
- .pf-v6-c-icon__content.pf-m-heading-xl,
7645
- .pf-v6-c-icon__progress.pf-m-heading-xl {
7646
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-xl__content--FontSize);
7647
- }
7648
-
7649
- .pf-v6-c-icon__content.pf-m-heading-2xl,
7650
- .pf-v6-c-icon__progress.pf-m-heading-2xl {
7651
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-2xl__content--FontSize);
7652
- }
7653
-
7654
- .pf-v6-c-icon__content.pf-m-heading-3xl,
7655
- .pf-v6-c-icon__progress.pf-m-heading-3xl {
7656
- --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-3xl__content--FontSize);
7657
- }
7658
-
7659
- .pf-v6-c-icon__content {
7660
- color: var(--pf-v6-c-icon__content--Color, inherit);
7661
- opacity: var(--pf-v6-c-icon__content--Opacity, 1);
7662
- }
7663
-
7664
- .pf-v6-c-icon__content.pf-m-danger {
7665
- --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-danger--Color);
7666
- }
7667
-
7668
- .pf-v6-c-icon__content.pf-m-warning {
7669
- --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-warning--Color);
7670
- }
7671
-
7672
- .pf-v6-c-icon__content.pf-m-success {
7673
- --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-success--Color);
7674
- }
7675
-
7676
- .pf-v6-c-icon__content.pf-m-info {
7677
- --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-info--Color);
7678
- }
7679
-
7680
- .pf-v6-c-icon__content.pf-m-custom {
7681
- --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-custom--Color);
7682
- }
7683
-
7684
- .pf-v6-c-icon__progress {
7685
- position: absolute;
7686
- inset-block-start: calc(50% + 0.5 * var(--pf-v6-c-icon__content--svg--VerticalAlign));
7687
- opacity: var(--pf-v6-c-icon__progress--Opacity, 0);
7688
- transform: translateY(calc(-50% - 0.5 * var(--pf-v6-c-icon__content--svg--VerticalAlign)));
7689
- }
7690
-
7691
- :where(:root, .pf-v6-c-input-group) {
7692
- --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--xs);
7693
- --pf-v6-c-input-group__item--offset: var(--pf-t--global--border--width--control--default);
7694
- --pf-v6-c-input-group__item--BorderWidth--base: var(--pf-t--global--border--width--control--default);
7695
- --pf-v6-c-input-group__item--BorderColor--base: var(--pf-t--global--border--color--default);
7696
- --pf-v6-c-input-group__item--BackgroundColor: transparent;
7697
- --pf-v6-c-input-group__item--AlignItems: start;
7698
- --pf-v6-c-input-group__item--m-box--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7699
- --pf-v6-c-input-group__item--m-box--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7700
- --pf-v6-c-input-group__item--m-box--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7701
- --pf-v6-c-input-group__item--m-box--BorderWidth: var(--pf-v6-c-input-group__item--BorderWidth--base);
7702
- --pf-v6-c-input-group__item--m-box--BorderRadius: var(--pf-t--global--border--radius--small);
7703
- --pf-v6-c-input-group__item--m-box--BorderBlockStartColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7704
- --pf-v6-c-input-group__item--m-box--BorderInlineEndColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7705
- --pf-v6-c-input-group__item--m-box--BorderBlockEndColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7706
- --pf-v6-c-input-group__item--m-box--BorderInlineStartColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7707
- --pf-v6-c-input-group__item--m-plain--BackgroundColor: transparent;
7708
- --pf-v6-c-input-group__text--FontSize: var(--pf-t--global--font--size--body--default);
7709
- --pf-v6-c-input-group__text--Color: var(--pf-t--global--text--color--regular);
7710
- --pf-v6-c-input-group__item--m-disabled__text--Color: var(--pf-t--global--text--color--on-disabled);
7711
- --pf-v6-c-input-group__item--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7712
- }
7713
-
7714
- .pf-v6-c-input-group {
7715
- display: flex;
7716
- gap: var(--pf-v6-c-input-group--Gap);
7717
- width: 100%;
7718
- }
7719
-
7720
- .pf-v6-c-input-group__item {
7721
- position: relative;
7722
- display: flex;
7723
- align-items: var(--pf-v6-c-input-group__item--AlignItems);
7724
- min-width: var(--pf-v6-c-input-group__item--MinWidth, revert);
7725
- max-width: var(--pf-v6-c-input-group__item--MaxWidth, revert);
7726
- background-color: var(--pf-v6-c-input-group__item--BackgroundColor);
7727
- border-block-start-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockStartColor);
7728
- border-block-end-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockEndColor);
7729
- border-inline-start-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineStartColor);
7730
- border-inline-end-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineEndColor);
7731
- }
7732
-
7733
- .pf-v6-c-input-group__item.pf-m-box {
7734
- --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-box--BackgroundColor);
7735
- padding-inline-start: var(--pf-v6-c-input-group__item--m-box--PaddingInlineStart);
7736
- padding-inline-end: var(--pf-v6-c-input-group__item--m-box--PaddingInlineEnd);
7737
- border: var(--pf-v6-c-input-group__item--m-box--BorderWidth) solid;
7738
- border-block-start-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockStartColor);
7739
- border-block-end-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockEndColor);
7740
- border-inline-start-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineStartColor);
7741
- border-inline-end-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineEndColor);
7742
- border-radius: var(--pf-v6-c-input-group__item--m-box--BorderRadius);
7743
- }
7744
-
7745
- .pf-v6-c-input-group__item.pf-m-plain {
7746
- --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-plain--BackgroundColor);
7747
- border: none;
7748
- }
7749
-
7750
- .pf-v6-c-input-group__item.pf-m-disabled {
7751
- --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-disabled--BackgroundColor);
7752
- --pf-v6-c-input-group__text--Color: var(--pf-v6-c-input-group__item--m-disabled__text--Color);
7753
- }
7754
-
7755
- .pf-v6-c-input-group__item.pf-m-fill {
7756
- flex-grow: 1;
7545
+ .pf-v6-c-icon.pf-m-heading-lg {
7546
+ --pf-v6-c-icon--Width: var(--pf-v6-c-icon--m-heading-lg--Width);
7547
+ --pf-v6-c-icon--Height: var(--pf-v6-c-icon--m-heading-lg--Height);
7548
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-lg__content--FontSize);
7757
7549
  }
7758
7550
 
7759
- .pf-v6-c-input-group__text {
7760
- align-self: center;
7761
- font-size: var(--pf-v6-c-input-group__text--FontSize);
7762
- color: var(--pf-v6-c-input-group__text--Color);
7551
+ .pf-v6-c-icon.pf-m-heading-xl {
7552
+ --pf-v6-c-icon--Width: var(--pf-v6-c-icon--m-heading-xl--Width);
7553
+ --pf-v6-c-icon--Height: var(--pf-v6-c-icon--m-heading-xl--Height);
7554
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-xl__content--FontSize);
7763
7555
  }
7764
7556
 
7765
- label.pf-v6-c-input-group__text {
7766
- cursor: pointer;
7557
+ .pf-v6-c-icon.pf-m-heading-2xl {
7558
+ --pf-v6-c-icon--Width: var(--pf-v6-c-icon--m-heading-2xl--Width);
7559
+ --pf-v6-c-icon--Height: var(--pf-v6-c-icon--m-heading-2xl--Height);
7560
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-2xl__content--FontSize);
7767
7561
  }
7768
7562
 
7769
- :where(:root, .pf-v6-c-sidebar) {
7770
- --pf-v6-c-sidebar--inset: var(--pf-t--global--spacer--md);
7771
- --pf-v6-c-sidebar--xl--inset: var(--pf-t--global--spacer--lg);
7772
- --pf-v6-c-sidebar--BorderWidth--base: var(--pf-t--global--border--width--regular);
7773
- --pf-v6-c-sidebar--BorderColor--base: var(--pf-t--global--border--color--default);
7774
- --pf-v6-c-sidebar__panel--PaddingBlockStart: 0;
7775
- --pf-v6-c-sidebar__panel--PaddingInlineEnd: 0;
7776
- --pf-v6-c-sidebar__panel--PaddingBlockEnd: 0;
7777
- --pf-v6-c-sidebar__panel--PaddingInlineStart: 0;
7778
- --pf-v6-c-sidebar__panel--Order: -1;
7779
- --pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
7780
- --pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
7781
- --pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
7782
- --pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
7783
- --pf-v6-c-sidebar__content--PaddingBlockStart: 0;
7784
- --pf-v6-c-sidebar__content--PaddingInlineEnd: 0;
7785
- --pf-v6-c-sidebar__content--PaddingBlockEnd: 0;
7786
- --pf-v6-c-sidebar__content--PaddingInlineStart: 0;
7787
- --pf-v6-c-sidebar__content--Order: 1;
7788
- --pf-v6-c-sidebar__content--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
7789
- --pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
7790
- --pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
7791
- --pf-v6-c-sidebar__content--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
7792
- --pf-v6-c-sidebar__main--FlexDirection: column;
7793
- --pf-v6-c-sidebar__main--md--FlexDirection: row;
7794
- --pf-v6-c-sidebar__main--AlignItems: stretch;
7795
- --pf-v6-c-sidebar__main--md--AlignItems: flex-start;
7796
- --pf-v6-c-sidebar__main--child--MarginBlockStart: 0;
7797
- --pf-v6-c-sidebar--m-gutter__main--Gap: var(--pf-v6-c-sidebar--inset);
7798
- --pf-v6-c-sidebar__main--m-border--before--Display: none;
7799
- --pf-v6-c-sidebar__main--m-border--before--md--Display: block;
7800
- --pf-v6-c-sidebar__main--m-border--before--BorderWidth: var(--pf-v6-c-sidebar--BorderWidth--base);
7801
- --pf-v6-c-sidebar__main--m-border--before--BorderColor: var(--pf-v6-c-sidebar--BorderColor--base);
7802
- --pf-v6-c-sidebar--m-panel-right__panel--Order: -1;
7803
- --pf-v6-c-sidebar--m-panel-right__panel--md--Order: 1;
7804
- --pf-v6-c-sidebar--m-panel-right__content--md--Order: -1;
7805
- --pf-v6-c-sidebar--m-stack__main--FlexDirection: column;
7806
- --pf-v6-c-sidebar--m-stack__main--AlignItems: stretch;
7807
- --pf-v6-c-sidebar--m-stack__panel--Position: sticky;
7808
- --pf-v6-c-sidebar--m-stack__panel--InsetBlockStart: 0;
7809
- --pf-v6-c-sidebar--m-stack__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
7810
- --pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order: -1;
7811
- --pf-v6-c-sidebar--m-split__main--AlignItems: flex-start;
7812
- --pf-v6-c-sidebar--m-split__main--FlexDirection: row;
7813
- --pf-v6-c-sidebar--m-split__panel--Position: static;
7814
- --pf-v6-c-sidebar--m-split__panel--InsetBlockStart: auto;
7815
- --pf-v6-c-sidebar--m-split--m-panel-right__panel--Order: 1;
7816
- --pf-v6-c-sidebar--m-split__main--m-border--before--Display: block;
7817
- --pf-v6-c-sidebar__panel--FlexBasis--base: auto;
7818
- --pf-v6-c-sidebar__panel--BoxShadow--base: var(--pf-t--global--box-shadow--md--bottom);
7819
- --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
7820
- --pf-v6-c-sidebar__panel--InsetBlockStart: 0;
7821
- --pf-v6-c-sidebar__panel--md--InsetBlockStart: auto;
7822
- --pf-v6-c-sidebar__panel--Position: sticky;
7823
- --pf-v6-c-sidebar__panel--md--Position: static;
7824
- --pf-v6-c-sidebar__panel--FlexBasis-base: auto;
7825
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis-base);
7826
- --pf-v6-c-sidebar__panel--md--FlexBasis: 15.625rem;
7827
- --pf-v6-c-sidebar__panel--m-split--FlexBasis: 15.625rem;
7828
- --pf-v6-c-sidebar__panel--m-stack--FlexBasis: auto;
7829
- --pf-v6-c-sidebar__panel--ZIndex: var(--pf-t--global--z-index--xs);
7830
- --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7831
- --pf-v6-c-sidebar__panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7832
- --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
7833
- --pf-v6-c-sidebar__content--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7834
- --pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart: 0;
7835
- --pf-v6-c-sidebar__panel--m-sticky--Position: sticky;
7563
+ .pf-v6-c-icon.pf-m-heading-3xl {
7564
+ --pf-v6-c-icon--Width: var(--pf-v6-c-icon--m-heading-3xl--Width);
7565
+ --pf-v6-c-icon--Height: var(--pf-v6-c-icon--m-heading-3xl--Height);
7566
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-3xl__content--FontSize);
7836
7567
  }
7837
7568
 
7838
- .pf-v6-c-sidebar {
7839
- height: 100%;
7569
+ .pf-v6-c-icon.pf-m-in-progress {
7570
+ --pf-v6-c-icon__content--Opacity: 0;
7571
+ --pf-v6-c-icon__progress--Opacity: 1;
7840
7572
  }
7841
7573
 
7842
- @media (min-width: 768px) {
7843
- .pf-v6-c-sidebar {
7844
- --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar__main--md--FlexDirection);
7845
- --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar__main--md--AlignItems);
7846
- --pf-v6-c-sidebar__main--m-border--before--Display: var(--pf-v6-c-sidebar__main--m-border--before--md--Display);
7847
- --pf-v6-c-sidebar__panel--BoxShadow: none;
7848
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--md--FlexBasis);
7849
- --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar__panel--md--InsetBlockStart);
7850
- --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar__panel--md--Position);
7851
- }
7574
+ .pf-v6-c-icon__content,
7575
+ .pf-v6-c-icon__progress {
7576
+ font-size: var(--pf-v6-c-icon__content--FontSize);
7852
7577
  }
7853
- @media (min-width: 1200px) {
7854
- .pf-v6-c-sidebar {
7855
- --pf-v6-c-sidebar--inset: var(--pf-v6-c-sidebar--xl--inset);
7856
- }
7578
+
7579
+ .pf-v6-c-icon__content svg,
7580
+ .pf-v6-c-icon__progress svg {
7581
+ vertical-align: var(--pf-v6-c-icon__content--svg--VerticalAlign);
7857
7582
  }
7858
- .pf-v6-c-sidebar.pf-m-gutter > .pf-v6-c-sidebar__main {
7859
- gap: var(--pf-v6-c-sidebar--m-gutter__main--Gap);
7583
+
7584
+ .pf-v6-c-icon__content.pf-m-sm,
7585
+ .pf-v6-c-icon__progress.pf-m-sm {
7586
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-sm__content--FontSize);
7860
7587
  }
7861
7588
 
7862
- .pf-v6-c-sidebar.pf-m-panel-right {
7863
- --pf-v6-c-sidebar__panel--Order: var(--pf-v6-c-sidebar--m-panel-right__panel--Order);
7864
- --pf-v6-c-sidebar__content--Order: var(--pf-v6-c-sidebar--m-panel-right__content--Order);
7589
+ .pf-v6-c-icon__content.pf-m-md,
7590
+ .pf-v6-c-icon__progress.pf-m-md {
7591
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-md__content--FontSize);
7865
7592
  }
7866
7593
 
7867
- @media (min-width: 768px) {
7868
- .pf-v6-c-sidebar.pf-m-panel-right {
7869
- --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-panel-right__panel--md--Order);
7870
- --pf-v6-c-sidebar--m-panel-right__content--Order: var(--pf-v6-c-sidebar--m-panel-right__content--md--Order);
7871
- }
7594
+ .pf-v6-c-icon__content.pf-m-lg,
7595
+ .pf-v6-c-icon__progress.pf-m-lg {
7596
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-lg__content--FontSize);
7872
7597
  }
7873
- .pf-v6-c-sidebar.pf-m-stack {
7874
- --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar--m-stack__main--FlexDirection);
7875
- --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar--m-stack__main--AlignItems);
7876
- --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar--m-stack__panel--Position);
7877
- --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar--m-stack__panel--InsetBlockStart);
7878
- --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar--m-stack__panel--BoxShadow);
7879
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--m-stack--FlexBasis);
7880
- --pf-v6-c-sidebar__main--m-border--before--Display: none;
7881
- --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order);
7598
+
7599
+ .pf-v6-c-icon__content.pf-m-xl,
7600
+ .pf-v6-c-icon__progress.pf-m-xl {
7601
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-xl__content--FontSize);
7882
7602
  }
7883
7603
 
7884
- .pf-v6-c-sidebar.pf-m-split {
7885
- --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar--m-split__main--FlexDirection);
7886
- --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar--m-split__main--AlignItems);
7887
- --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar--m-split__panel--Position);
7888
- --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar--m-split__panel--InsetBlockStart);
7889
- --pf-v6-c-sidebar__panel--BoxShadow: none;
7890
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--m-split--FlexBasis);
7891
- --pf-v6-c-sidebar__main--m-border--before--Display: var(--pf-v6-c-sidebar--m-split__main--m-border--before--Display);
7892
- --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-split--m-panel-right__panel--Order);
7604
+ .pf-v6-c-icon__content.pf-m-2xl,
7605
+ .pf-v6-c-icon__progress.pf-m-2xl {
7606
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-2xl__content--FontSize);
7893
7607
  }
7894
7608
 
7895
- .pf-v6-c-sidebar__main {
7896
- display: flex;
7897
- flex-direction: var(--pf-v6-c-sidebar__main--FlexDirection);
7898
- align-items: var(--pf-v6-c-sidebar__main--AlignItems);
7609
+ .pf-v6-c-icon__content.pf-m-3xl,
7610
+ .pf-v6-c-icon__progress.pf-m-3xl {
7611
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-3xl__content--FontSize);
7899
7612
  }
7900
7613
 
7901
- .pf-v6-c-sidebar__main.pf-m-border::before {
7902
- display: var(--pf-v6-c-sidebar__main--m-border--before--Display);
7903
- flex: 0 0 var(--pf-v6-c-sidebar__main--m-border--before--BorderWidth);
7904
- align-self: stretch;
7905
- content: "";
7906
- background-color: var(--pf-v6-c-sidebar__main--m-border--before--BorderColor);
7614
+ .pf-v6-c-icon__content.pf-m-body-sm,
7615
+ .pf-v6-c-icon__progress.pf-m-body-sm {
7616
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-body-sm__content--FontSize);
7907
7617
  }
7908
7618
 
7909
- .pf-v6-c-sidebar__panel {
7910
- position: var(--pf-v6-c-sidebar__panel--Position);
7911
- inset-block-start: var(--pf-v6-c-sidebar__panel--InsetBlockStart);
7912
- z-index: var(--pf-v6-c-sidebar__panel--ZIndex);
7913
- flex-basis: var(--pf-v6-c-sidebar__panel--FlexBasis);
7914
- flex-shrink: 0;
7915
- order: var(--pf-v6-c-sidebar__panel--Order);
7916
- padding-block-start: var(--pf-v6-c-sidebar__panel--PaddingBlockStart);
7917
- padding-block-end: var(--pf-v6-c-sidebar__panel--PaddingBlockEnd);
7918
- padding-inline-start: var(--pf-v6-c-sidebar__panel--PaddingInlineStart);
7919
- padding-inline-end: var(--pf-v6-c-sidebar__panel--PaddingInlineEnd);
7920
- background-color: var(--pf-v6-c-sidebar__panel--BackgroundColor);
7921
- box-shadow: var(--pf-v6-c-sidebar__panel--BoxShadow);
7619
+ .pf-v6-c-icon__content.pf-m-body-default,
7620
+ .pf-v6-c-icon__progress.pf-m-body-default {
7621
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-md__content--FontSize);
7922
7622
  }
7923
7623
 
7924
- .pf-v6-c-sidebar__panel.pf-m-padding {
7925
- --pf-v6-c-sidebar__panel--PaddingBlockStart: var(--pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart);
7926
- --pf-v6-c-sidebar__panel--PaddingInlineEnd: var(--pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd);
7927
- --pf-v6-c-sidebar__panel--PaddingBlockEnd: var(--pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd);
7928
- --pf-v6-c-sidebar__panel--PaddingInlineStart: var(--pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart);
7624
+ .pf-v6-c-icon__content.pf-m-body-lg,
7625
+ .pf-v6-c-icon__progress.pf-m-body-lg {
7626
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-lg__content--FontSize);
7929
7627
  }
7930
7628
 
7931
- .pf-v6-c-sidebar__panel.pf-m-sticky {
7932
- --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar__panel--m-sticky--Position);
7933
- --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart);
7629
+ .pf-v6-c-icon__content.pf-m-heading-sm,
7630
+ .pf-v6-c-icon__progress.pf-m-heading-sm {
7631
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-sm__content--FontSize);
7934
7632
  }
7935
7633
 
7936
- .pf-v6-c-sidebar__panel.pf-m-static {
7937
- --pf-v6-c-sidebar__panel--Position: static;
7938
- --pf-v6-c-sidebar__panel--InsetBlockStart: auto;
7634
+ .pf-v6-c-icon__content.pf-m-heading-md,
7635
+ .pf-v6-c-icon__progress.pf-m-heading-md {
7636
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-md__content--FontSize);
7939
7637
  }
7940
7638
 
7941
- .pf-v6-c-sidebar__panel.pf-m-secondary {
7942
- --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-v6-c-sidebar__panel--m-secondary--BackgroundColor);
7639
+ .pf-v6-c-icon__content.pf-m-heading-lg,
7640
+ .pf-v6-c-icon__progress.pf-m-heading-lg {
7641
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-lg__content--FontSize);
7943
7642
  }
7944
7643
 
7945
- .pf-v6-c-sidebar__content {
7946
- flex-grow: 1;
7947
- order: var(--pf-v6-c-sidebar__content--Order);
7948
- padding-block-start: var(--pf-v6-c-sidebar__content--PaddingBlockStart);
7949
- padding-block-end: var(--pf-v6-c-sidebar__content--PaddingBlockEnd);
7950
- padding-inline-start: var(--pf-v6-c-sidebar__content--PaddingInlineStart);
7951
- padding-inline-end: var(--pf-v6-c-sidebar__content--PaddingInlineEnd);
7952
- background-color: var(--pf-v6-c-sidebar__content--BackgroundColor);
7644
+ .pf-v6-c-icon__content.pf-m-heading-xl,
7645
+ .pf-v6-c-icon__progress.pf-m-heading-xl {
7646
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-xl__content--FontSize);
7953
7647
  }
7954
7648
 
7955
- .pf-v6-c-sidebar__content.pf-m-padding {
7956
- --pf-v6-c-sidebar__content--PaddingBlockStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
7957
- --pf-v6-c-sidebar__content--PaddingInlineEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd);
7958
- --pf-v6-c-sidebar__content--PaddingBlockEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd);
7959
- --pf-v6-c-sidebar__content--PaddingInlineStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
7649
+ .pf-v6-c-icon__content.pf-m-heading-2xl,
7650
+ .pf-v6-c-icon__progress.pf-m-heading-2xl {
7651
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-2xl__content--FontSize);
7960
7652
  }
7961
7653
 
7962
- .pf-v6-c-sidebar__content.pf-m-no-background {
7963
- --pf-v6-c-sidebar__content--BackgroundColor: transparent;
7654
+ .pf-v6-c-icon__content.pf-m-heading-3xl,
7655
+ .pf-v6-c-icon__progress.pf-m-heading-3xl {
7656
+ --pf-v6-c-icon__content--FontSize: var(--pf-v6-c-icon--m-heading-3xl__content--FontSize);
7964
7657
  }
7965
7658
 
7966
- .pf-v6-c-sidebar__content.pf-m-secondary {
7967
- --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-v6-c-sidebar__content--m-secondary--BackgroundColor);
7659
+ .pf-v6-c-icon__content {
7660
+ color: var(--pf-v6-c-icon__content--Color, inherit);
7661
+ opacity: var(--pf-v6-c-icon__content--Opacity, 1);
7968
7662
  }
7969
7663
 
7970
- .pf-v6-c-sidebar__content + .pf-v6-c-sidebar__panel {
7971
- --pf-v6-c-sidebar__panel--Order: 1;
7664
+ .pf-v6-c-icon__content.pf-m-danger {
7665
+ --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-danger--Color);
7972
7666
  }
7973
7667
 
7974
- :where(.pf-v6-c-sidebar__content:first-child) {
7975
- --pf-v6-c-sidebar__content--Order: -1;
7668
+ .pf-v6-c-icon__content.pf-m-warning {
7669
+ --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-warning--Color);
7976
7670
  }
7977
7671
 
7978
- .pf-v6-c-sidebar.pf-m-no-background,
7979
- .pf-v6-c-sidebar__panel.pf-m-no-background,
7980
- .pf-v6-c-sidebar__content.pf-m-no-background {
7981
- background-color: transparent;
7672
+ .pf-v6-c-icon__content.pf-m-success {
7673
+ --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-success--Color);
7982
7674
  }
7983
7675
 
7984
- .pf-v6-c-sidebar__panel.pf-m-width-default {
7985
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
7676
+ .pf-v6-c-icon__content.pf-m-info {
7677
+ --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-info--Color);
7986
7678
  }
7987
7679
 
7988
- .pf-v6-c-sidebar__panel.pf-m-width-25 {
7989
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
7680
+ .pf-v6-c-icon__content.pf-m-custom {
7681
+ --pf-v6-c-icon__content--Color: var(--pf-v6-c-icon__content--m-custom--Color);
7990
7682
  }
7991
7683
 
7992
- .pf-v6-c-sidebar__panel.pf-m-width-33 {
7993
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
7684
+ .pf-v6-c-icon__progress {
7685
+ position: absolute;
7686
+ inset-block-start: calc(50% + 0.5 * var(--pf-v6-c-icon__content--svg--VerticalAlign));
7687
+ opacity: var(--pf-v6-c-icon__progress--Opacity, 0);
7688
+ transform: translateY(calc(-50% - 0.5 * var(--pf-v6-c-icon__content--svg--VerticalAlign)));
7994
7689
  }
7995
7690
 
7996
- .pf-v6-c-sidebar__panel.pf-m-width-50 {
7997
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
7691
+ :where(:root, .pf-v6-c-input-group) {
7692
+ --pf-v6-c-input-group--Gap: var(--pf-t--global--spacer--xs);
7693
+ --pf-v6-c-input-group__item--offset: var(--pf-t--global--border--width--control--default);
7694
+ --pf-v6-c-input-group__item--BorderWidth--base: var(--pf-t--global--border--width--control--default);
7695
+ --pf-v6-c-input-group__item--BorderColor--base: var(--pf-t--global--border--color--default);
7696
+ --pf-v6-c-input-group__item--BackgroundColor: transparent;
7697
+ --pf-v6-c-input-group__item--AlignItems: start;
7698
+ --pf-v6-c-input-group__item--m-box--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
7699
+ --pf-v6-c-input-group__item--m-box--PaddingInlineStart: var(--pf-t--global--spacer--sm);
7700
+ --pf-v6-c-input-group__item--m-box--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
7701
+ --pf-v6-c-input-group__item--m-box--BorderWidth: var(--pf-v6-c-input-group__item--BorderWidth--base);
7702
+ --pf-v6-c-input-group__item--m-box--BorderRadius: var(--pf-t--global--border--radius--small);
7703
+ --pf-v6-c-input-group__item--m-box--BorderBlockStartColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7704
+ --pf-v6-c-input-group__item--m-box--BorderInlineEndColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7705
+ --pf-v6-c-input-group__item--m-box--BorderBlockEndColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7706
+ --pf-v6-c-input-group__item--m-box--BorderInlineStartColor: var(--pf-v6-c-input-group__item--BorderColor--base);
7707
+ --pf-v6-c-input-group__item--m-plain--BackgroundColor: transparent;
7708
+ --pf-v6-c-input-group__text--FontSize: var(--pf-t--global--font--size--body--default);
7709
+ --pf-v6-c-input-group__text--Color: var(--pf-t--global--text--color--regular);
7710
+ --pf-v6-c-input-group__item--m-disabled__text--Color: var(--pf-t--global--text--color--on-disabled);
7711
+ --pf-v6-c-input-group__item--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
7998
7712
  }
7999
7713
 
8000
- .pf-v6-c-sidebar__panel.pf-m-width-66 {
8001
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
7714
+ .pf-v6-c-input-group {
7715
+ display: flex;
7716
+ gap: var(--pf-v6-c-input-group--Gap);
7717
+ width: 100%;
8002
7718
  }
8003
7719
 
8004
- .pf-v6-c-sidebar__panel.pf-m-width-75 {
8005
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
7720
+ .pf-v6-c-input-group__item {
7721
+ position: relative;
7722
+ display: flex;
7723
+ align-items: var(--pf-v6-c-input-group__item--AlignItems);
7724
+ min-width: var(--pf-v6-c-input-group__item--MinWidth, revert);
7725
+ max-width: var(--pf-v6-c-input-group__item--MaxWidth, revert);
7726
+ background-color: var(--pf-v6-c-input-group__item--BackgroundColor);
7727
+ border-block-start-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockStartColor);
7728
+ border-block-end-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockEndColor);
7729
+ border-inline-start-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineStartColor);
7730
+ border-inline-end-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineEndColor);
8006
7731
  }
8007
7732
 
8008
- .pf-v6-c-sidebar__panel.pf-m-width-100 {
8009
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
7733
+ .pf-v6-c-input-group__item.pf-m-box {
7734
+ --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-box--BackgroundColor);
7735
+ padding-inline-start: var(--pf-v6-c-input-group__item--m-box--PaddingInlineStart);
7736
+ padding-inline-end: var(--pf-v6-c-input-group__item--m-box--PaddingInlineEnd);
7737
+ border: var(--pf-v6-c-input-group__item--m-box--BorderWidth) solid;
7738
+ border-block-start-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockStartColor);
7739
+ border-block-end-color: var(--pf-v6-c-input-group__item--m-box--BorderBlockEndColor);
7740
+ border-inline-start-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineStartColor);
7741
+ border-inline-end-color: var(--pf-v6-c-input-group__item--m-box--BorderInlineEndColor);
7742
+ border-radius: var(--pf-v6-c-input-group__item--m-box--BorderRadius);
8010
7743
  }
8011
7744
 
8012
- @media (min-width: 576px) {
8013
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-sm {
8014
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8015
- }
8016
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-sm {
8017
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8018
- }
8019
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-sm {
8020
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8021
- }
8022
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-sm {
8023
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8024
- }
8025
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-sm {
8026
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8027
- }
8028
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-sm {
8029
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8030
- }
8031
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-sm {
8032
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8033
- }
7745
+ .pf-v6-c-input-group__item.pf-m-plain {
7746
+ --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-plain--BackgroundColor);
7747
+ border: none;
8034
7748
  }
8035
- @media (min-width: 768px) {
8036
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-md {
8037
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8038
- }
8039
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-md {
8040
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8041
- }
8042
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-md {
8043
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8044
- }
8045
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-md {
8046
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8047
- }
8048
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-md {
8049
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8050
- }
8051
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-md {
8052
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8053
- }
8054
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-md {
8055
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8056
- }
7749
+
7750
+ .pf-v6-c-input-group__item.pf-m-disabled {
7751
+ --pf-v6-c-input-group__item--BackgroundColor: var(--pf-v6-c-input-group__item--m-disabled--BackgroundColor);
7752
+ --pf-v6-c-input-group__text--Color: var(--pf-v6-c-input-group__item--m-disabled__text--Color);
8057
7753
  }
8058
- @media (min-width: 992px) {
8059
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-lg {
8060
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8061
- }
8062
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-lg {
8063
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8064
- }
8065
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-lg {
8066
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8067
- }
8068
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-lg {
8069
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8070
- }
8071
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-lg {
8072
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8073
- }
8074
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-lg {
8075
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8076
- }
8077
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-lg {
8078
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8079
- }
7754
+
7755
+ .pf-v6-c-input-group__item.pf-m-fill {
7756
+ flex-grow: 1;
8080
7757
  }
8081
- @media (min-width: 1200px) {
8082
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-xl {
8083
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8084
- }
8085
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-xl {
8086
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8087
- }
8088
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-xl {
8089
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8090
- }
8091
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-xl {
8092
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8093
- }
8094
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-xl {
8095
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8096
- }
8097
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-xl {
8098
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8099
- }
8100
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-xl {
8101
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8102
- }
7758
+
7759
+ .pf-v6-c-input-group__text {
7760
+ align-self: center;
7761
+ font-size: var(--pf-v6-c-input-group__text--FontSize);
7762
+ color: var(--pf-v6-c-input-group__text--Color);
8103
7763
  }
8104
- @media (min-width: 1450px) {
8105
- .pf-v6-c-sidebar__panel.pf-m-width-default-on-2xl {
8106
- --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8107
- }
8108
- .pf-v6-c-sidebar__panel.pf-m-width-25-on-2xl {
8109
- --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8110
- }
8111
- .pf-v6-c-sidebar__panel.pf-m-width-33-on-2xl {
8112
- --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8113
- }
8114
- .pf-v6-c-sidebar__panel.pf-m-width-50-on-2xl {
8115
- --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8116
- }
8117
- .pf-v6-c-sidebar__panel.pf-m-width-66-on-2xl {
8118
- --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8119
- }
8120
- .pf-v6-c-sidebar__panel.pf-m-width-75-on-2xl {
8121
- --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8122
- }
8123
- .pf-v6-c-sidebar__panel.pf-m-width-100-on-2xl {
8124
- --pf-v6-c-sidebar__panel--FlexBasis: 100%;
8125
- }
7764
+
7765
+ label.pf-v6-c-input-group__text {
7766
+ cursor: pointer;
8126
7767
  }
7768
+
8127
7769
  :where(:root, .pf-v6-c-jump-links) {
8128
7770
  --pf-v6-c-jump-links__list--Display: flex;
8129
7771
  --pf-v6-c-jump-links__list--PaddingBlockStart: 0;
@@ -8886,504 +8528,602 @@ input.pf-v6-c-label__content {
8886
8528
  text-overflow: ellipsis;
8887
8529
  white-space: nowrap;
8888
8530
  }
8889
-
8890
- .pf-v6-c-label__icon {
8891
- color: var(--pf-v6-c-label__icon--Color);
8892
- }
8893
-
8894
- .pf-v6-c-label__actions {
8895
- margin-inline-end: var(--pf-v6-c-label__actions--MarginInlineEnd);
8896
- }
8897
-
8898
- .pf-v6-c-label__actions .pf-v6-c-button {
8899
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label__actions--c-button--FontSize);
8900
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label__actions--c-button--PaddingBlockStart);
8901
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd);
8902
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd);
8903
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label__actions--c-button--PaddingInlineStart);
8904
- margin-block-start: var(--pf-v6-c-label__actions--c-button--MarginBlockStart);
8905
- margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
8906
- outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
8907
- }
8908
-
8909
- :where(:root, .pf-v6-c-label-group) {
8910
- --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
8911
- --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
8912
- --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
8913
- --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
8914
- --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
8915
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
8916
- --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
8917
- --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
8918
- --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
8919
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
8920
- --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
8921
- --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
8922
- --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8923
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8924
- --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
8925
- --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8926
- --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
8927
- --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
8928
- --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
8929
- --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8930
- --pf-v6-c-label-group__label--MaxWidth: 18ch;
8931
- --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
8932
- --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8933
- --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8934
- --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
8935
- --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8936
- --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
8937
- --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
8938
- --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
8939
- --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
8940
- --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
8531
+
8532
+ .pf-v6-c-label__icon {
8533
+ color: var(--pf-v6-c-label__icon--Color);
8941
8534
  }
8942
8535
 
8943
- .pf-v6-c-label-group {
8944
- display: inline-flex;
8945
- row-gap: var(--pf-v6-c-label-group--RowGap);
8946
- column-gap: var(--pf-v6-c-label-group--ColumnGap);
8947
- align-items: center;
8536
+ .pf-v6-c-label__actions {
8537
+ margin-inline-end: var(--pf-v6-c-label__actions--MarginInlineEnd);
8948
8538
  }
8949
8539
 
8950
- .pf-v6-c-label-group.pf-m-category {
8951
- padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
8952
- padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
8953
- padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
8954
- padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
8955
- background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
8956
- border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
8957
- border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
8540
+ .pf-v6-c-label__actions .pf-v6-c-button {
8541
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label__actions--c-button--FontSize);
8542
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label__actions--c-button--PaddingBlockStart);
8543
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd);
8544
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd);
8545
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label__actions--c-button--PaddingInlineStart);
8546
+ margin-block-start: var(--pf-v6-c-label__actions--c-button--MarginBlockStart);
8547
+ margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
8548
+ outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
8958
8549
  }
8959
8550
 
8960
- .pf-v6-c-label-group.pf-m-vertical {
8961
- --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
8962
- --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
8963
- --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
8964
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
8965
- --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
8966
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
8967
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
8551
+ :where(:root, .pf-v6-c-sidebar) {
8552
+ --pf-v6-c-sidebar--inset: var(--pf-t--global--spacer--md);
8553
+ --pf-v6-c-sidebar--xl--inset: var(--pf-t--global--spacer--lg);
8554
+ --pf-v6-c-sidebar--BorderWidth--base: var(--pf-t--global--border--width--regular);
8555
+ --pf-v6-c-sidebar--BorderColor--base: var(--pf-t--global--border--color--default);
8556
+ --pf-v6-c-sidebar__panel--PaddingBlockStart: 0;
8557
+ --pf-v6-c-sidebar__panel--PaddingInlineEnd: 0;
8558
+ --pf-v6-c-sidebar__panel--PaddingBlockEnd: 0;
8559
+ --pf-v6-c-sidebar__panel--PaddingInlineStart: 0;
8560
+ --pf-v6-c-sidebar__panel--Order: -1;
8561
+ --pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
8562
+ --pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
8563
+ --pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
8564
+ --pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
8565
+ --pf-v6-c-sidebar__content--PaddingBlockStart: 0;
8566
+ --pf-v6-c-sidebar__content--PaddingInlineEnd: 0;
8567
+ --pf-v6-c-sidebar__content--PaddingBlockEnd: 0;
8568
+ --pf-v6-c-sidebar__content--PaddingInlineStart: 0;
8569
+ --pf-v6-c-sidebar__content--Order: 1;
8570
+ --pf-v6-c-sidebar__content--m-padding--PaddingBlockStart: var(--pf-v6-c-sidebar--inset);
8571
+ --pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd: var(--pf-v6-c-sidebar--inset);
8572
+ --pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd: var(--pf-v6-c-sidebar--inset);
8573
+ --pf-v6-c-sidebar__content--m-padding--PaddingInlineStart: var(--pf-v6-c-sidebar--inset);
8574
+ --pf-v6-c-sidebar__main--FlexDirection: column;
8575
+ --pf-v6-c-sidebar__main--md--FlexDirection: row;
8576
+ --pf-v6-c-sidebar__main--AlignItems: stretch;
8577
+ --pf-v6-c-sidebar__main--md--AlignItems: flex-start;
8578
+ --pf-v6-c-sidebar__main--child--MarginBlockStart: 0;
8579
+ --pf-v6-c-sidebar--m-gutter__main--Gap: var(--pf-v6-c-sidebar--inset);
8580
+ --pf-v6-c-sidebar__main--m-border--before--Display: none;
8581
+ --pf-v6-c-sidebar__main--m-border--before--md--Display: block;
8582
+ --pf-v6-c-sidebar__main--m-border--before--BorderWidth: var(--pf-v6-c-sidebar--BorderWidth--base);
8583
+ --pf-v6-c-sidebar__main--m-border--before--BorderColor: var(--pf-v6-c-sidebar--BorderColor--base);
8584
+ --pf-v6-c-sidebar--m-panel-right__panel--Order: -1;
8585
+ --pf-v6-c-sidebar--m-panel-right__panel--md--Order: 1;
8586
+ --pf-v6-c-sidebar--m-panel-right__content--md--Order: -1;
8587
+ --pf-v6-c-sidebar--m-stack__main--FlexDirection: column;
8588
+ --pf-v6-c-sidebar--m-stack__main--AlignItems: stretch;
8589
+ --pf-v6-c-sidebar--m-stack__panel--Position: sticky;
8590
+ --pf-v6-c-sidebar--m-stack__panel--InsetBlockStart: 0;
8591
+ --pf-v6-c-sidebar--m-stack__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
8592
+ --pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order: -1;
8593
+ --pf-v6-c-sidebar--m-split__main--AlignItems: flex-start;
8594
+ --pf-v6-c-sidebar--m-split__main--FlexDirection: row;
8595
+ --pf-v6-c-sidebar--m-split__panel--Position: static;
8596
+ --pf-v6-c-sidebar--m-split__panel--InsetBlockStart: auto;
8597
+ --pf-v6-c-sidebar--m-split--m-panel-right__panel--Order: 1;
8598
+ --pf-v6-c-sidebar--m-split__main--m-border--before--Display: block;
8599
+ --pf-v6-c-sidebar__panel--FlexBasis--base: auto;
8600
+ --pf-v6-c-sidebar__panel--BoxShadow--base: var(--pf-t--global--box-shadow--md--bottom);
8601
+ --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar__panel--BoxShadow--base);
8602
+ --pf-v6-c-sidebar__panel--InsetBlockStart: 0;
8603
+ --pf-v6-c-sidebar__panel--md--InsetBlockStart: auto;
8604
+ --pf-v6-c-sidebar__panel--Position: sticky;
8605
+ --pf-v6-c-sidebar__panel--md--Position: static;
8606
+ --pf-v6-c-sidebar__panel--FlexBasis-base: auto;
8607
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis-base);
8608
+ --pf-v6-c-sidebar__panel--md--FlexBasis: 15.625rem;
8609
+ --pf-v6-c-sidebar__panel--m-split--FlexBasis: 15.625rem;
8610
+ --pf-v6-c-sidebar__panel--m-stack--FlexBasis: auto;
8611
+ --pf-v6-c-sidebar__panel--ZIndex: var(--pf-t--global--z-index--xs);
8612
+ --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8613
+ --pf-v6-c-sidebar__panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
8614
+ --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8615
+ --pf-v6-c-sidebar__content--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
8616
+ --pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart: 0;
8617
+ --pf-v6-c-sidebar__panel--m-sticky--Position: sticky;
8968
8618
  }
8969
8619
 
8970
- .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
8971
- align-items: flex-start;
8620
+ .pf-v6-c-sidebar {
8621
+ height: 100%;
8972
8622
  }
8973
8623
 
8974
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
8975
- flex-direction: column;
8976
- align-items: flex-start;
8624
+ @media (min-width: 768px) {
8625
+ .pf-v6-c-sidebar {
8626
+ --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar__main--md--FlexDirection);
8627
+ --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar__main--md--AlignItems);
8628
+ --pf-v6-c-sidebar__main--m-border--before--Display: var(--pf-v6-c-sidebar__main--m-border--before--md--Display);
8629
+ --pf-v6-c-sidebar__panel--BoxShadow: none;
8630
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--md--FlexBasis);
8631
+ --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar__panel--md--InsetBlockStart);
8632
+ --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar__panel--md--Position);
8633
+ }
8634
+ }
8635
+ @media (min-width: 1200px) {
8636
+ .pf-v6-c-sidebar {
8637
+ --pf-v6-c-sidebar--inset: var(--pf-v6-c-sidebar--xl--inset);
8638
+ }
8639
+ }
8640
+ .pf-v6-c-sidebar.pf-m-gutter > .pf-v6-c-sidebar__main {
8641
+ gap: var(--pf-v6-c-sidebar--m-gutter__main--Gap);
8977
8642
  }
8978
8643
 
8979
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
8980
- flex-direction: column;
8644
+ .pf-v6-c-sidebar.pf-m-panel-right {
8645
+ --pf-v6-c-sidebar__panel--Order: var(--pf-v6-c-sidebar--m-panel-right__panel--Order);
8646
+ --pf-v6-c-sidebar__content--Order: var(--pf-v6-c-sidebar--m-panel-right__content--Order);
8981
8647
  }
8982
8648
 
8983
- .pf-v6-c-label-group.pf-m-editable,
8984
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
8985
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
8986
- display: flex;
8649
+ @media (min-width: 768px) {
8650
+ .pf-v6-c-sidebar.pf-m-panel-right {
8651
+ --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-panel-right__panel--md--Order);
8652
+ --pf-v6-c-sidebar--m-panel-right__content--Order: var(--pf-v6-c-sidebar--m-panel-right__content--md--Order);
8653
+ }
8654
+ }
8655
+ .pf-v6-c-sidebar.pf-m-stack {
8656
+ --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar--m-stack__main--FlexDirection);
8657
+ --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar--m-stack__main--AlignItems);
8658
+ --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar--m-stack__panel--Position);
8659
+ --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar--m-stack__panel--InsetBlockStart);
8660
+ --pf-v6-c-sidebar__panel--BoxShadow: var(--pf-v6-c-sidebar--m-stack__panel--BoxShadow);
8661
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--m-stack--FlexBasis);
8662
+ --pf-v6-c-sidebar__main--m-border--before--Display: none;
8663
+ --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-stack--m-panel-right__panel--Order);
8987
8664
  }
8988
8665
 
8989
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
8990
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
8991
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
8992
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
8993
- flex: 1;
8666
+ .pf-v6-c-sidebar.pf-m-split {
8667
+ --pf-v6-c-sidebar__main--FlexDirection: var(--pf-v6-c-sidebar--m-split__main--FlexDirection);
8668
+ --pf-v6-c-sidebar__main--AlignItems: var(--pf-v6-c-sidebar--m-split__main--AlignItems);
8669
+ --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar--m-split__panel--Position);
8670
+ --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar--m-split__panel--InsetBlockStart);
8671
+ --pf-v6-c-sidebar__panel--BoxShadow: none;
8672
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--m-split--FlexBasis);
8673
+ --pf-v6-c-sidebar__main--m-border--before--Display: var(--pf-v6-c-sidebar--m-split__main--m-border--before--Display);
8674
+ --pf-v6-c-sidebar--m-panel-right__panel--Order: var(--pf-v6-c-sidebar--m-split--m-panel-right__panel--Order);
8994
8675
  }
8995
8676
 
8996
- .pf-v6-c-label-group__main {
8677
+ .pf-v6-c-sidebar__main {
8997
8678
  display: flex;
8998
- flex: 1;
8999
- flex-wrap: wrap;
9000
- row-gap: var(--pf-v6-c-label-group__main--RowGap);
9001
- column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
9002
- align-items: baseline;
8679
+ flex-direction: var(--pf-v6-c-sidebar__main--FlexDirection);
8680
+ align-items: var(--pf-v6-c-sidebar__main--AlignItems);
9003
8681
  }
9004
8682
 
9005
- .pf-v6-c-label-group__list {
9006
- display: inline-flex;
9007
- flex-wrap: wrap;
9008
- row-gap: var(--pf-v6-c-label-group__list--RowGap);
9009
- column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
8683
+ .pf-v6-c-sidebar__main.pf-m-border::before {
8684
+ display: var(--pf-v6-c-sidebar__main--m-border--before--Display);
8685
+ flex: 0 0 var(--pf-v6-c-sidebar__main--m-border--before--BorderWidth);
8686
+ align-self: stretch;
8687
+ content: "";
8688
+ background-color: var(--pf-v6-c-sidebar__main--m-border--before--BorderColor);
9010
8689
  }
9011
8690
 
9012
- .pf-v6-c-label-group__list-item {
9013
- display: inline-flex;
8691
+ .pf-v6-c-sidebar__panel {
8692
+ position: var(--pf-v6-c-sidebar__panel--Position);
8693
+ inset-block-start: var(--pf-v6-c-sidebar__panel--InsetBlockStart);
8694
+ z-index: var(--pf-v6-c-sidebar__panel--ZIndex);
8695
+ flex-basis: var(--pf-v6-c-sidebar__panel--FlexBasis);
8696
+ flex-shrink: 0;
8697
+ order: var(--pf-v6-c-sidebar__panel--Order);
8698
+ padding-block-start: var(--pf-v6-c-sidebar__panel--PaddingBlockStart);
8699
+ padding-block-end: var(--pf-v6-c-sidebar__panel--PaddingBlockEnd);
8700
+ padding-inline-start: var(--pf-v6-c-sidebar__panel--PaddingInlineStart);
8701
+ padding-inline-end: var(--pf-v6-c-sidebar__panel--PaddingInlineEnd);
8702
+ background-color: var(--pf-v6-c-sidebar__panel--BackgroundColor);
8703
+ box-shadow: var(--pf-v6-c-sidebar__panel--BoxShadow);
9014
8704
  }
9015
8705
 
9016
- .pf-v6-c-label-group__label {
9017
- overflow: hidden;
9018
- text-overflow: ellipsis;
9019
- white-space: nowrap;
9020
- max-width: var(--pf-v6-c-label-group__label--MaxWidth);
8706
+ .pf-v6-c-sidebar__panel.pf-m-padding {
8707
+ --pf-v6-c-sidebar__panel--PaddingBlockStart: var(--pf-v6-c-sidebar__panel--m-padding--PaddingBlockStart);
8708
+ --pf-v6-c-sidebar__panel--PaddingInlineEnd: var(--pf-v6-c-sidebar__panel--m-padding--PaddingInlineEnd);
8709
+ --pf-v6-c-sidebar__panel--PaddingBlockEnd: var(--pf-v6-c-sidebar__panel--m-padding--PaddingBlockEnd);
8710
+ --pf-v6-c-sidebar__panel--PaddingInlineStart: var(--pf-v6-c-sidebar__panel--m-padding--PaddingInlineStart);
9021
8711
  }
9022
8712
 
9023
- .pf-v6-c-label-group__close {
9024
- display: flex;
9025
- align-self: flex-start;
8713
+ .pf-v6-c-sidebar__panel.pf-m-sticky {
8714
+ --pf-v6-c-sidebar__panel--Position: var(--pf-v6-c-sidebar__panel--m-sticky--Position);
8715
+ --pf-v6-c-sidebar__panel--InsetBlockStart: var(--pf-v6-c-sidebar__panel--m-sticky--InsetBlockStart);
9026
8716
  }
9027
8717
 
9028
- .pf-v6-c-label-group__close .pf-v6-c-button {
9029
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
9030
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
9031
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
9032
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
9033
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
8718
+ .pf-v6-c-sidebar__panel.pf-m-static {
8719
+ --pf-v6-c-sidebar__panel--Position: static;
8720
+ --pf-v6-c-sidebar__panel--InsetBlockStart: auto;
9034
8721
  }
9035
8722
 
9036
- .pf-v6-c-label-group__textarea {
9037
- min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
9038
- padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
9039
- padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
9040
- padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
9041
- padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
9042
- white-space: nowrap;
9043
- resize: none;
9044
- border: 0;
9045
- -ms-overflow-style: none;
9046
- scrollbar-width: none;
8723
+ .pf-v6-c-sidebar__panel.pf-m-secondary {
8724
+ --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-v6-c-sidebar__panel--m-secondary--BackgroundColor);
9047
8725
  }
9048
8726
 
9049
- .pf-v6-c-label-group__textarea::-webkit-scrollbar {
9050
- display: none;
8727
+ .pf-v6-c-sidebar__content {
8728
+ flex-grow: 1;
8729
+ order: var(--pf-v6-c-sidebar__content--Order);
8730
+ padding-block-start: var(--pf-v6-c-sidebar__content--PaddingBlockStart);
8731
+ padding-block-end: var(--pf-v6-c-sidebar__content--PaddingBlockEnd);
8732
+ padding-inline-start: var(--pf-v6-c-sidebar__content--PaddingInlineStart);
8733
+ padding-inline-end: var(--pf-v6-c-sidebar__content--PaddingInlineEnd);
8734
+ background-color: var(--pf-v6-c-sidebar__content--BackgroundColor);
8735
+ }
8736
+
8737
+ .pf-v6-c-sidebar__content.pf-m-padding {
8738
+ --pf-v6-c-sidebar__content--PaddingBlockStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
8739
+ --pf-v6-c-sidebar__content--PaddingInlineEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingInlineEnd);
8740
+ --pf-v6-c-sidebar__content--PaddingBlockEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd);
8741
+ --pf-v6-c-sidebar__content--PaddingInlineStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
8742
+ }
8743
+
8744
+ .pf-v6-c-sidebar__content.pf-m-no-background {
8745
+ --pf-v6-c-sidebar__content--BackgroundColor: transparent;
9051
8746
  }
9052
8747
 
9053
- :where(:root, .pf-v6-c-list) {
9054
- --pf-v6-c-list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9055
- --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
9056
- --pf-v6-c-list--Gap: var(--pf-t--global--spacer--sm);
9057
- --pf-v6-c-list--nested--PaddingBlockStart: var(--pf-v6-c-list--Gap);
9058
- --pf-v6-c-list--m-plain--PaddingInlineStart: 0;
9059
- --pf-v6-c-list--m-inline--PaddingInlineStart: 0;
9060
- --pf-v6-c-list--m-inline--ColumnGap: var(--pf-t--global--spacer--lg);
9061
- --pf-v6-c-list--m-inline--RowGap: var(--pf-t--global--spacer--xs);
9062
- --pf-v6-c-list--m-bordered--li--PaddingBlockStart: var(--pf-v6-c-list--Gap);
9063
- --pf-v6-c-list--m-bordered--li--BorderBlockStartColor: var(--pf-t--global--border--color--default);
9064
- --pf-v6-c-list--m-bordered--li--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
9065
- --pf-v6-c-list__item-icon--MinWidth: var(--pf-t--global--icon--size--sm);
9066
- --pf-v6-c-list__item-icon--MarginBlockStart: var(--pf-t--global--spacer--xs);
9067
- --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
9068
- --pf-v6-c-list__item-icon--Color: var(--pf-t--global--icon--color--regular);
9069
- --pf-v6-c-list__item-icon--FontSize: var(--pf-t--global--icon--size--sm);
9070
- --pf-v6-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-t--global--icon--size--lg);
9071
- --pf-v6-c-list--m-icon-lg__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
9072
- --pf-v6-c-list--m-icon-lg__item-icon--FontSize: var(--pf-t--global--icon--size--lg);
8748
+ .pf-v6-c-sidebar__content.pf-m-secondary {
8749
+ --pf-v6-c-sidebar__content--BackgroundColor: var(--pf-v6-c-sidebar__content--m-secondary--BackgroundColor);
9073
8750
  }
9074
8751
 
9075
- .pf-v6-c-list {
9076
- display: flex;
9077
- flex-direction: column;
9078
- gap: var(--pf-v6-c-list--Gap);
9079
- padding-inline-start: var(--pf-v6-c-list--PaddingInlineStart);
8752
+ .pf-v6-c-sidebar__content + .pf-v6-c-sidebar__panel {
8753
+ --pf-v6-c-sidebar__panel--Order: 1;
9080
8754
  }
9081
8755
 
9082
- .pf-v6-c-list .pf-v6-c-list {
9083
- padding-block-start: var(--pf-v6-c-list--nested--PaddingBlockStart);
8756
+ :where(.pf-v6-c-sidebar__content:first-child) {
8757
+ --pf-v6-c-sidebar__content--Order: -1;
9084
8758
  }
9085
8759
 
9086
- ul.pf-v6-c-list {
9087
- list-style: var(--pf-v6-c-list--ul--ListStyle);
8760
+ .pf-v6-c-sidebar.pf-m-no-background,
8761
+ .pf-v6-c-sidebar__panel.pf-m-no-background,
8762
+ .pf-v6-c-sidebar__content.pf-m-no-background {
8763
+ background-color: transparent;
9088
8764
  }
9089
8765
 
9090
- .pf-v6-c-list.pf-m-icon-lg {
9091
- --pf-v6-c-list__item-icon--MinWidth: var(--pf-v6-c-list--m-icon-lg__item-icon--MinWidth);
9092
- --pf-v6-c-list__item-icon--MarginBlockStart: 0;
9093
- --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-v6-c-list--m-icon-lg__item-icon--MarginInlineEnd);
9094
- --pf-v6-c-list__item-icon--FontSize: var(--pf-v6-c-list--m-icon-lg__item-icon--FontSize);
8766
+ .pf-v6-c-sidebar__panel.pf-m-width-default {
8767
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
9095
8768
  }
9096
8769
 
9097
- .pf-v6-c-list.pf-m-plain {
9098
- --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-plain--PaddingInlineStart);
9099
- list-style: none;
8770
+ .pf-v6-c-sidebar__panel.pf-m-width-25 {
8771
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
9100
8772
  }
9101
8773
 
9102
- .pf-v6-c-list.pf-m-inline {
9103
- --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-inline--PaddingInlineStart);
9104
- --pf-v6-c-list--Gap: var(--pf-v6-c-list--m-inline--RowGap) var(--pf-v6-c-list--m-inline--ColumnGap);
9105
- flex-direction: row;
9106
- flex-wrap: wrap;
9107
- list-style: none;
8774
+ .pf-v6-c-sidebar__panel.pf-m-width-33 {
8775
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
9108
8776
  }
9109
8777
 
9110
- .pf-v6-c-list.pf-m-bordered > * + * {
9111
- padding-block-start: var(--pf-v6-c-list--m-bordered--li--PaddingBlockStart);
9112
- border-block-start: var(--pf-v6-c-list--m-bordered--li--BorderBlockStartWidth) solid var(--pf-v6-c-list--m-bordered--li--BorderBlockStartColor);
8778
+ .pf-v6-c-sidebar__panel.pf-m-width-50 {
8779
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
9113
8780
  }
9114
8781
 
9115
- .pf-v6-c-list__item {
9116
- display: flex;
8782
+ .pf-v6-c-sidebar__panel.pf-m-width-66 {
8783
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
9117
8784
  }
9118
8785
 
9119
- .pf-v6-c-list__item-icon {
9120
- flex-shrink: 0;
9121
- min-width: var(--pf-v6-c-list__item-icon--MinWidth);
9122
- margin-block-start: var(--pf-v6-c-list__item-icon--MarginBlockStart);
9123
- margin-inline-end: var(--pf-v6-c-list__item-icon--MarginInlineEnd);
9124
- font-size: var(--pf-v6-c-list__item-icon--FontSize);
9125
- line-height: 1;
9126
- color: var(--pf-v6-c-list__item-icon--Color);
8786
+ .pf-v6-c-sidebar__panel.pf-m-width-75 {
8787
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
9127
8788
  }
9128
8789
 
9129
- :where(:root, .pf-v6-c-login) {
9130
- --pf-v6-c-login--PaddingBlockStart: var(--pf-t--global--spacer--lg);
9131
- --pf-v6-c-login--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
9132
- --pf-v6-c-login__container--xl--GridColumnGap: var(--pf-t--global--spacer--3xl);
9133
- --pf-v6-c-login__container--MaxWidth: 31.25rem;
9134
- --pf-v6-c-login__container--xl--MaxWidth: none;
9135
- --pf-v6-c-login__container--PaddingInlineStart: 6.125rem;
9136
- --pf-v6-c-login__container--PaddingInlineEnd: 6.125rem;
9137
- --pf-v6-c-login__container--xl--GridTemplateColumns: 34rem minmax(auto, 34rem);
9138
- --pf-v6-c-login__header--MarginBlockEnd: var(--pf-t--global--spacer--md);
9139
- --pf-v6-c-login__header--PaddingInlineStart: var(--pf-t--global--spacer--md);
9140
- --pf-v6-c-login__header--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9141
- --pf-v6-c-login__header--xl--MarginBlockEnd: var(--pf-t--global--spacer--2xl);
9142
- --pf-v6-c-login__header--xl--MarginBlockStart: var(--pf-t--global--spacer--3xl);
9143
- --pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-t--global--spacer--lg);
9144
- --pf-v6-c-login__header--c-brand--xl--MarginBlockEnd: var(--pf-t--global--spacer--2xl);
9145
- --pf-v6-c-login__main--BackgroundColor: var(--pf-t--global--background--color--primary--default);
9146
- --pf-v6-c-login__main--MarginBlockEnd: var(--pf-t--global--spacer--lg);
9147
- --pf-v6-c-login__main--BorderRadius: var(--pf-t--global--border--radius--large);
9148
- --pf-v6-c-login__main-header--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
9149
- --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
9150
- --pf-v6-c-login__main-header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
9151
- --pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-t--global--spacer--xl);
9152
- --pf-v6-c-login__main-header--md--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
9153
- --pf-v6-c-login__main-header--md--PaddingInlineStart: var(--pf-t--global--spacer--2xl);
9154
- --pf-v6-c-login__main-header--ColumnGap: var(--pf-t--global--spacer--md);
9155
- --pf-v6-c-login__main-header--RowGap: var(--pf-t--global--spacer--md);
9156
- --pf-v6-c-login__main-header-desc--MarginBlockEnd: var(--pf-t--global--spacer--sm);
9157
- --pf-v6-c-login__main-header-desc--md--MarginBlockEnd: 0;
9158
- --pf-v6-c-login__main-header-desc--FontSize: var(--pf-t--global--font--size--body--default);
9159
- --pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
9160
- --pf-v6-c-login__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
9161
- --pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-t--global--spacer--xl);
9162
- --pf-v6-c-login__main-body--md--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
9163
- --pf-v6-c-login__main-body--md--PaddingInlineStart: var(--pf-t--global--spacer--2xl);
9164
- --pf-v6-c-login__main-footer--PaddingBlockEnd: var(--pf-t--global--spacer--3xl);
9165
- --pf-v6-c-login__main-footer--c-title--MarginBlockEnd: var(--pf-t--global--spacer--md);
9166
- --pf-v6-c-login__main-footer-links--PaddingBlockStart: var(--pf-t--global--spacer--sm);
9167
- --pf-v6-c-login__main-footer-links--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
9168
- --pf-v6-c-login__main-footer-links--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
9169
- --pf-v6-c-login__main-footer-links--PaddingInlineStart: var(--pf-t--global--spacer--3xl);
9170
- --pf-v6-c-login__main-footer-links--Gap: var(--pf-t--global--spacer--md);
9171
- --pf-v6-c-login__main-footer-links-item--c-button--FontSize: var(--pf-t--global--icon--size--xl);
9172
- --pf-v6-c-login__main-footer-band--PaddingBlockStart: var(--pf-t--global--spacer--lg);
9173
- --pf-v6-c-login__main-footer-band--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9174
- --pf-v6-c-login__main-footer-band--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
9175
- --pf-v6-c-login__main-footer-band--PaddingInlineStart: var(--pf-t--global--spacer--md);
9176
- --pf-v6-c-login__main-footer-band--BorderBlockStartColor: var(--pf-t--global--border--color--default);
9177
- --pf-v6-c-login__main-footer-band--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
9178
- --pf-v6-c-login__main-footer-band-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
9179
- --pf-v6-c-login__footer--PaddingInlineStart: var(--pf-t--global--spacer--md);
9180
- --pf-v6-c-login__footer--PaddingInlineEnd: var(--pf-t--global--spacer--md);
9181
- --pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-t--global--spacer--md);
9182
- --pf-v6-c-login__footer--c-list--xl--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
8790
+ .pf-v6-c-sidebar__panel.pf-m-width-100 {
8791
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
9183
8792
  }
9184
8793
 
9185
- @media (min-width: 1200px) {
9186
- :where(:root, .pf-v6-c-login) {
9187
- --pf-v6-c-login__container--MaxWidth: var(--pf-v6-c-login__container--xl--MaxWidth);
8794
+ @media (min-width: 576px) {
8795
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-sm {
8796
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8797
+ }
8798
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-sm {
8799
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8800
+ }
8801
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-sm {
8802
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8803
+ }
8804
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-sm {
8805
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8806
+ }
8807
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-sm {
8808
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8809
+ }
8810
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-sm {
8811
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8812
+ }
8813
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-sm {
8814
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
9188
8815
  }
9189
8816
  }
9190
- @media (min-width: 576px) {
9191
- :where(:root, .pf-v6-c-login) {
9192
- --pf-v6-c-login__header--PaddingInlineEnd: 0;
9193
- --pf-v6-c-login__header--PaddingInlineStart: 0;
8817
+ @media (min-width: 768px) {
8818
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-md {
8819
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8820
+ }
8821
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-md {
8822
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8823
+ }
8824
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-md {
8825
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8826
+ }
8827
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-md {
8828
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8829
+ }
8830
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-md {
8831
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8832
+ }
8833
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-md {
8834
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8835
+ }
8836
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-md {
8837
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
9194
8838
  }
9195
8839
  }
9196
- @media (min-width: 1200px) {
9197
- :where(:root, .pf-v6-c-login) {
9198
- --pf-v6-c-login__header--MarginBlockEnd: var(--pf-v6-c-login__header--xl--MarginBlockEnd);
9199
- --pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-v6-c-login__header--c-brand--xl--MarginBlockEnd);
8840
+ @media (min-width: 992px) {
8841
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-lg {
8842
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8843
+ }
8844
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-lg {
8845
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8846
+ }
8847
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-lg {
8848
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8849
+ }
8850
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-lg {
8851
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8852
+ }
8853
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-lg {
8854
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8855
+ }
8856
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-lg {
8857
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8858
+ }
8859
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-lg {
8860
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
9200
8861
  }
9201
8862
  }
9202
8863
  @media (min-width: 1200px) {
9203
- :where(:root, .pf-v6-c-login) {
9204
- --pf-v6-c-login__main--MarginBlockEnd: 0;
8864
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-xl {
8865
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
9205
8866
  }
9206
- }
9207
- @media (min-width: 768px) {
9208
- :where(:root, .pf-v6-c-login) {
9209
- --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-v6-c-login__main-header--md--PaddingInlineEnd);
9210
- --pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-v6-c-login__main-header--md--PaddingInlineStart);
9211
- --pf-v6-c-login__main-header-desc--MarginBlockEnd: var(--pf-v6-c-login__main-header-desc--md--MarginBlockEnd);
8867
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-xl {
8868
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8869
+ }
8870
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-xl {
8871
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8872
+ }
8873
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-xl {
8874
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8875
+ }
8876
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-xl {
8877
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
8878
+ }
8879
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-xl {
8880
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
8881
+ }
8882
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-xl {
8883
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
9212
8884
  }
9213
8885
  }
9214
- @media (min-width: 768px) {
9215
- :where(:root, .pf-v6-c-login) {
9216
- --pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-v6-c-login__main-body--md--PaddingInlineEnd);
9217
- --pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-v6-c-login__main-body--md--PaddingInlineStart);
8886
+ @media (min-width: 1450px) {
8887
+ .pf-v6-c-sidebar__panel.pf-m-width-default-on-2xl {
8888
+ --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
8889
+ }
8890
+ .pf-v6-c-sidebar__panel.pf-m-width-25-on-2xl {
8891
+ --pf-v6-c-sidebar__panel--FlexBasis: 25%;
8892
+ }
8893
+ .pf-v6-c-sidebar__panel.pf-m-width-33-on-2xl {
8894
+ --pf-v6-c-sidebar__panel--FlexBasis: 33%;
8895
+ }
8896
+ .pf-v6-c-sidebar__panel.pf-m-width-50-on-2xl {
8897
+ --pf-v6-c-sidebar__panel--FlexBasis: 50%;
8898
+ }
8899
+ .pf-v6-c-sidebar__panel.pf-m-width-66-on-2xl {
8900
+ --pf-v6-c-sidebar__panel--FlexBasis: 66%;
9218
8901
  }
9219
- }
9220
- @media (min-width: 576px) {
9221
- :where(:root, .pf-v6-c-login) {
9222
- --pf-v6-c-login__footer--PaddingInlineEnd: 0;
9223
- --pf-v6-c-login__footer--PaddingInlineStart: 0;
8902
+ .pf-v6-c-sidebar__panel.pf-m-width-75-on-2xl {
8903
+ --pf-v6-c-sidebar__panel--FlexBasis: 75%;
9224
8904
  }
9225
- }
9226
- @media (min-width: 1200px) {
9227
- :where(:root, .pf-v6-c-login) {
9228
- --pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-v6-c-login__footer--c-list--xl--PaddingBlockStart);
8905
+ .pf-v6-c-sidebar__panel.pf-m-width-100-on-2xl {
8906
+ --pf-v6-c-sidebar__panel--FlexBasis: 100%;
9229
8907
  }
9230
8908
  }
9231
- .pf-v6-c-login {
9232
- display: flex;
9233
- justify-content: center;
9234
- min-height: 100vh;
9235
- padding-block-start: var(--pf-v6-c-login--PaddingBlockStart);
9236
- padding-block-end: var(--pf-v6-c-login--PaddingBlockEnd);
8909
+ :where(:root, .pf-v6-c-label-group) {
8910
+ --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
8911
+ --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
8912
+ --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
8913
+ --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
8914
+ --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
8915
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
8916
+ --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
8917
+ --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
8918
+ --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
8919
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
8920
+ --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
8921
+ --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
8922
+ --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8923
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8924
+ --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
8925
+ --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8926
+ --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
8927
+ --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
8928
+ --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
8929
+ --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8930
+ --pf-v6-c-label-group__label--MaxWidth: 18ch;
8931
+ --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
8932
+ --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
8933
+ --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
8934
+ --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
8935
+ --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
8936
+ --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
8937
+ --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
8938
+ --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
8939
+ --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
8940
+ --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
9237
8941
  }
9238
8942
 
9239
- @media (min-width: 576px) {
9240
- .pf-v6-c-login {
9241
- align-items: center;
9242
- }
9243
- }
9244
- .pf-v6-c-login__container {
9245
- width: 100%;
9246
- max-width: var(--pf-v6-c-login__container--MaxWidth);
8943
+ .pf-v6-c-label-group {
8944
+ display: inline-flex;
8945
+ row-gap: var(--pf-v6-c-label-group--RowGap);
8946
+ column-gap: var(--pf-v6-c-label-group--ColumnGap);
8947
+ align-items: center;
9247
8948
  }
9248
8949
 
9249
- @media (min-width: 1200px) {
9250
- .pf-v6-c-login__container {
9251
- display: grid;
9252
- grid-template-areas: "main header" "main footer" "main .";
9253
- grid-template-columns: var(--pf-v6-c-login__container--xl--GridTemplateColumns);
9254
- grid-column-gap: var(--pf-v6-c-login__container--xl--GridColumnGap);
9255
- justify-content: center;
9256
- padding-inline-start: var(--pf-v6-c-login__container--PaddingInlineStart);
9257
- padding-inline-end: var(--pf-v6-c-login__container--PaddingInlineEnd);
9258
- }
8950
+ .pf-v6-c-label-group.pf-m-category {
8951
+ padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
8952
+ padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
8953
+ padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
8954
+ padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
8955
+ background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
8956
+ border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
8957
+ border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
9259
8958
  }
9260
- .pf-v6-c-login__header {
9261
- grid-area: header;
9262
- padding-inline-start: var(--pf-v6-c-login__header--PaddingInlineStart);
9263
- padding-inline-end: var(--pf-v6-c-login__header--PaddingInlineEnd);
8959
+
8960
+ .pf-v6-c-label-group.pf-m-vertical {
8961
+ --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
8962
+ --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
8963
+ --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
8964
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
8965
+ --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
8966
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
8967
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
9264
8968
  }
9265
8969
 
9266
- @media (min-width: 1200px) {
9267
- .pf-v6-c-login__header {
9268
- margin-block-start: var(--pf-v6-c-login__header--xl--MarginBlockStart);
9269
- }
8970
+ .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
8971
+ align-items: flex-start;
9270
8972
  }
9271
- .pf-v6-c-login__header .pf-v6-c-brand {
9272
- margin-block-end: var(--pf-v6-c-login__header--c-brand--MarginBlockEnd);
8973
+
8974
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
8975
+ flex-direction: column;
8976
+ align-items: flex-start;
9273
8977
  }
9274
8978
 
9275
- .pf-v6-c-login__main {
9276
- grid-area: main;
9277
- align-self: start;
9278
- margin-block-end: var(--pf-v6-c-login__main--MarginBlockEnd);
9279
- background-color: var(--pf-v6-c-login__main--BackgroundColor);
9280
- border-radius: var(--pf-v6-c-login__main--BorderRadius);
8979
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
8980
+ flex-direction: column;
9281
8981
  }
9282
8982
 
9283
- .pf-v6-c-login__main > :first-child:not(.pf-v6-c-login__main-header) {
9284
- padding-block-start: var(--pf-v6-c-login__main-header--PaddingBlockStart);
8983
+ .pf-v6-c-label-group.pf-m-editable,
8984
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
8985
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
8986
+ display: flex;
9285
8987
  }
9286
8988
 
9287
- .pf-v6-c-login__main > :last-child:not(.pf-v6-c-login__main-footer) {
9288
- padding-block-end: var(--pf-v6-c-login__main-footer--PaddingBlockEnd);
8989
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
8990
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
8991
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
8992
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
8993
+ flex: 1;
9289
8994
  }
9290
8995
 
9291
- .pf-v6-c-login__main-header {
9292
- display: grid;
9293
- grid-template-columns: 100%;
9294
- row-gap: var(--pf-v6-c-login__main-header--RowGap);
9295
- column-gap: var(--pf-v6-c-login__main-header--ColumnGap);
9296
- align-items: center;
9297
- padding-block-start: var(--pf-v6-c-login__main-header--PaddingBlockStart);
9298
- padding-block-end: var(--pf-v6-c-login__main-header--PaddingBlockEnd);
9299
- padding-inline-start: var(--pf-v6-c-login__main-header--PaddingInlineStart);
9300
- padding-inline-end: var(--pf-v6-c-login__main-header--PaddingInlineEnd);
8996
+ .pf-v6-c-label-group__main {
8997
+ display: flex;
8998
+ flex: 1;
8999
+ flex-wrap: wrap;
9000
+ row-gap: var(--pf-v6-c-label-group__main--RowGap);
9001
+ column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
9002
+ align-items: baseline;
9301
9003
  }
9302
9004
 
9303
- @media (min-width: 768px) {
9304
- .pf-v6-c-login__main-header {
9305
- grid-template-columns: 1fr auto;
9306
- }
9005
+ .pf-v6-c-label-group__list {
9006
+ display: inline-flex;
9007
+ flex-wrap: wrap;
9008
+ row-gap: var(--pf-v6-c-label-group__list--RowGap);
9009
+ column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
9307
9010
  }
9308
- .pf-v6-c-login__main-header-utilities,
9309
- .pf-v6-c-login__main-header .pf-v6-c-menu-toggle {
9310
- grid-row: auto;
9311
- grid-column: auto;
9011
+
9012
+ .pf-v6-c-label-group__list-item {
9013
+ display: inline-flex;
9312
9014
  }
9313
9015
 
9314
- @media (min-width: 768px) {
9315
- .pf-v6-c-login__main-header-utilities,
9316
- .pf-v6-c-login__main-header .pf-v6-c-menu-toggle {
9317
- grid-row: 1;
9318
- grid-column: 2/3;
9319
- }
9016
+ .pf-v6-c-label-group__label {
9017
+ overflow: hidden;
9018
+ text-overflow: ellipsis;
9019
+ white-space: nowrap;
9020
+ max-width: var(--pf-v6-c-label-group__label--MaxWidth);
9320
9021
  }
9321
- .pf-v6-c-login__main-header-desc {
9322
- grid-column: 1/-1;
9323
- margin-block-end: var(--pf-v6-c-login__main-header-desc--MarginBlockEnd);
9324
- font-size: var(--pf-v6-c-login__main-header-desc--FontSize);
9022
+
9023
+ .pf-v6-c-label-group__close {
9024
+ display: flex;
9025
+ align-self: flex-start;
9325
9026
  }
9326
9027
 
9327
- .pf-v6-c-login__main-body {
9328
- padding-block-end: var(--pf-v6-c-login__main-body--PaddingBlockEnd);
9329
- padding-inline-start: var(--pf-v6-c-login__main-body--PaddingInlineStart);
9330
- padding-inline-end: var(--pf-v6-c-login__main-body--PaddingInlineEnd);
9028
+ .pf-v6-c-label-group__close .pf-v6-c-button {
9029
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
9030
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
9031
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
9032
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
9033
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
9331
9034
  }
9332
9035
 
9333
- .pf-v6-c-login__main-footer {
9334
- display: flex;
9335
- flex-wrap: wrap;
9036
+ .pf-v6-c-label-group__textarea {
9037
+ min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
9038
+ padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
9039
+ padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
9040
+ padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
9041
+ padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
9042
+ white-space: nowrap;
9043
+ resize: none;
9044
+ border: 0;
9045
+ -ms-overflow-style: none;
9046
+ scrollbar-width: none;
9336
9047
  }
9337
9048
 
9338
- .pf-v6-c-login__main-footer .pf-v6-c-title {
9339
- margin-block-end: var(--pf-v6-c-login__main-footer--c-title--MarginBlockEnd);
9340
- text-align: center;
9049
+ .pf-v6-c-label-group__textarea::-webkit-scrollbar {
9050
+ display: none;
9341
9051
  }
9342
9052
 
9343
- .pf-v6-c-login__main-footer > * {
9344
- flex-basis: 100%;
9053
+ :where(:root, .pf-v6-c-list) {
9054
+ --pf-v6-c-list--PaddingInlineStart: var(--pf-t--global--spacer--lg);
9055
+ --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
9056
+ --pf-v6-c-list--Gap: var(--pf-t--global--spacer--sm);
9057
+ --pf-v6-c-list--nested--PaddingBlockStart: var(--pf-v6-c-list--Gap);
9058
+ --pf-v6-c-list--m-plain--PaddingInlineStart: 0;
9059
+ --pf-v6-c-list--m-inline--PaddingInlineStart: 0;
9060
+ --pf-v6-c-list--m-inline--ColumnGap: var(--pf-t--global--spacer--lg);
9061
+ --pf-v6-c-list--m-inline--RowGap: var(--pf-t--global--spacer--xs);
9062
+ --pf-v6-c-list--m-bordered--li--PaddingBlockStart: var(--pf-v6-c-list--Gap);
9063
+ --pf-v6-c-list--m-bordered--li--BorderBlockStartColor: var(--pf-t--global--border--color--default);
9064
+ --pf-v6-c-list--m-bordered--li--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
9065
+ --pf-v6-c-list__item-icon--MinWidth: var(--pf-t--global--icon--size--sm);
9066
+ --pf-v6-c-list__item-icon--MarginBlockStart: var(--pf-t--global--spacer--xs);
9067
+ --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
9068
+ --pf-v6-c-list__item-icon--Color: var(--pf-t--global--icon--color--regular);
9069
+ --pf-v6-c-list__item-icon--FontSize: var(--pf-t--global--icon--size--sm);
9070
+ --pf-v6-c-list--m-icon-lg__item-icon--MinWidth: var(--pf-t--global--icon--size--lg);
9071
+ --pf-v6-c-list--m-icon-lg__item-icon--MarginInlineEnd: var(--pf-t--global--spacer--md);
9072
+ --pf-v6-c-list--m-icon-lg__item-icon--FontSize: var(--pf-t--global--icon--size--lg);
9345
9073
  }
9346
9074
 
9347
- .pf-v6-c-login__main-footer-links {
9075
+ .pf-v6-c-list {
9348
9076
  display: flex;
9349
- flex-wrap: wrap;
9350
- gap: var(--pf-v6-c-login__main-footer-links--Gap);
9351
- justify-content: center;
9352
- padding-block-start: var(--pf-v6-c-login__main-footer-links--PaddingBlockStart);
9353
- padding-block-end: var(--pf-v6-c-login__main-footer-links--PaddingBlockEnd);
9354
- padding-inline-start: var(--pf-v6-c-login__main-footer-links--PaddingInlineStart);
9355
- padding-inline-end: var(--pf-v6-c-login__main-footer-links--PaddingInlineEnd);
9077
+ flex-direction: column;
9078
+ gap: var(--pf-v6-c-list--Gap);
9079
+ padding-inline-start: var(--pf-v6-c-list--PaddingInlineStart);
9356
9080
  }
9357
9081
 
9358
- .pf-v6-c-login__main-footer-links-item .pf-v6-c-button {
9359
- --pf-v6-c-button--FontSize: var(--pf-v6-c-login__main-footer-links-item--c-button--FontSize);
9082
+ .pf-v6-c-list .pf-v6-c-list {
9083
+ padding-block-start: var(--pf-v6-c-list--nested--PaddingBlockStart);
9084
+ }
9085
+
9086
+ ul.pf-v6-c-list {
9087
+ list-style: var(--pf-v6-c-list--ul--ListStyle);
9088
+ }
9089
+
9090
+ .pf-v6-c-list.pf-m-icon-lg {
9091
+ --pf-v6-c-list__item-icon--MinWidth: var(--pf-v6-c-list--m-icon-lg__item-icon--MinWidth);
9092
+ --pf-v6-c-list__item-icon--MarginBlockStart: 0;
9093
+ --pf-v6-c-list__item-icon--MarginInlineEnd: var(--pf-v6-c-list--m-icon-lg__item-icon--MarginInlineEnd);
9094
+ --pf-v6-c-list__item-icon--FontSize: var(--pf-v6-c-list--m-icon-lg__item-icon--FontSize);
9360
9095
  }
9361
9096
 
9362
- .pf-v6-c-login__main-footer-band {
9363
- padding-block-start: var(--pf-v6-c-login__main-footer-band--PaddingBlockStart);
9364
- padding-block-end: var(--pf-v6-c-login__main-footer-band--PaddingBlockEnd);
9365
- padding-inline-start: var(--pf-v6-c-login__main-footer-band--PaddingInlineStart);
9366
- padding-inline-end: var(--pf-v6-c-login__main-footer-band--PaddingInlineEnd);
9367
- text-align: center;
9368
- border-block-start: var(--pf-v6-c-login__main-footer-band--BorderBlockStartWidth) solid var(--pf-v6-c-login__main-footer-band--BorderBlockStartColor);
9097
+ .pf-v6-c-list.pf-m-plain {
9098
+ --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-plain--PaddingInlineStart);
9099
+ list-style: none;
9369
9100
  }
9370
9101
 
9371
- .pf-v6-c-login__main-footer-band > * + * {
9372
- padding-block-start: var(--pf-v6-c-login__main-footer-band-item--PaddingBlockStart);
9102
+ .pf-v6-c-list.pf-m-inline {
9103
+ --pf-v6-c-list--PaddingInlineStart: var(--pf-v6-c-list--m-inline--PaddingInlineStart);
9104
+ --pf-v6-c-list--Gap: var(--pf-v6-c-list--m-inline--RowGap) var(--pf-v6-c-list--m-inline--ColumnGap);
9105
+ flex-direction: row;
9106
+ flex-wrap: wrap;
9107
+ list-style: none;
9373
9108
  }
9374
9109
 
9375
- .pf-v6-c-login__footer {
9376
- grid-area: footer;
9377
- padding-inline-start: var(--pf-v6-c-login__footer--PaddingInlineStart);
9378
- padding-inline-end: var(--pf-v6-c-login__footer--PaddingInlineEnd);
9110
+ .pf-v6-c-list.pf-m-bordered > * + * {
9111
+ padding-block-start: var(--pf-v6-c-list--m-bordered--li--PaddingBlockStart);
9112
+ border-block-start: var(--pf-v6-c-list--m-bordered--li--BorderBlockStartWidth) solid var(--pf-v6-c-list--m-bordered--li--BorderBlockStartColor);
9379
9113
  }
9380
9114
 
9381
- .pf-v6-c-login__footer .pf-v6-c-list a {
9382
- color: unset;
9115
+ .pf-v6-c-list__item {
9116
+ display: flex;
9383
9117
  }
9384
9118
 
9385
- .pf-v6-c-login__footer .pf-v6-c-list:not(:only-child) {
9386
- padding-block-start: var(--pf-v6-c-login__footer--c-list--PaddingBlockStart);
9119
+ .pf-v6-c-list__item-icon {
9120
+ flex-shrink: 0;
9121
+ min-width: var(--pf-v6-c-list__item-icon--MinWidth);
9122
+ margin-block-start: var(--pf-v6-c-list__item-icon--MarginBlockStart);
9123
+ margin-inline-end: var(--pf-v6-c-list__item-icon--MarginInlineEnd);
9124
+ font-size: var(--pf-v6-c-list__item-icon--FontSize);
9125
+ line-height: 1;
9126
+ color: var(--pf-v6-c-list__item-icon--Color);
9387
9127
  }
9388
9128
 
9389
9129
  :where(:root, .pf-v6-c-masthead) {
@@ -10383,123 +10123,383 @@ ul.pf-v6-c-list {
10383
10123
  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
10384
10124
  }
10385
10125
  }
10386
- @media screen and (min-width: 1200px) {
10387
- .pf-v6-c-menu__item.pf-m-hidden-on-xl {
10388
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
10389
- }
10390
- .pf-v6-c-menu__item.pf-m-visible-on-xl {
10391
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
10126
+ @media screen and (min-width: 1200px) {
10127
+ .pf-v6-c-menu__item.pf-m-hidden-on-xl {
10128
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
10129
+ }
10130
+ .pf-v6-c-menu__item.pf-m-visible-on-xl {
10131
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
10132
+ }
10133
+ }
10134
+ @media screen and (min-width: 1450px) {
10135
+ .pf-v6-c-menu__item.pf-m-hidden-on-2xl {
10136
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
10137
+ }
10138
+ .pf-v6-c-menu__item.pf-m-visible-on-2xl {
10139
+ --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
10140
+ }
10141
+ }
10142
+ :where(label).pf-v6-c-menu__item {
10143
+ cursor: pointer;
10144
+ }
10145
+
10146
+ .pf-v6-c-menu__item.pf-m-selected {
10147
+ --pf-v6-c-menu__item-select-icon--Color: var(--pf-v6-c-menu__item--m-selected__item-select-icon--Color);
10148
+ }
10149
+
10150
+ .pf-v6-c-menu__item:is(:hover, :focus, .pf-m-selected) .pf-v6-c-menu__item-select-icon,
10151
+ .pf-v6-c-menu__item:is(:hover, :focus, .pf-m-selected) .pf-v6-c-menu__item-external-icon {
10152
+ opacity: 1;
10153
+ }
10154
+
10155
+ .pf-v6-c-menu__item:is(:hover, :focus, .pf-m-selected) .pf-v6-c-menu__item-external-icon {
10156
+ color: var(--pf-v6-c-menu__item-external--Color);
10157
+ }
10158
+
10159
+ .pf-v6-c-menu__item-select-icon {
10160
+ color: var(--pf-v6-c-menu__item-select-icon--Color);
10161
+ }
10162
+
10163
+ .pf-v6-c-menu__item-main {
10164
+ column-gap: var(--pf-v6-c-menu__item-main--ColumnGap);
10165
+ align-items: center;
10166
+ width: 100%;
10167
+ }
10168
+
10169
+ .pf-v6-c-menu__item-text {
10170
+ overflow: hidden;
10171
+ text-overflow: ellipsis;
10172
+ white-space: nowrap;
10173
+ flex-grow: 1;
10174
+ }
10175
+
10176
+ .pf-v6-c-menu__group-title {
10177
+ padding-block-start: var(--pf-v6-c-menu__group-title--PaddingBlockStart);
10178
+ padding-block-end: var(--pf-v6-c-menu__group-title--PaddingBlockEnd);
10179
+ padding-inline-start: var(--pf-v6-c-menu__group-title--PaddingInlineStart);
10180
+ padding-inline-end: var(--pf-v6-c-menu__group-title--PaddingInlineEnd);
10181
+ font-size: var(--pf-v6-c-menu__group-title--FontSize, inherit);
10182
+ font-weight: var(--pf-v6-c-menu__group-title--FontWeight, inherit);
10183
+ color: var(--pf-v6-c-menu__group-title--Color);
10184
+ }
10185
+
10186
+ .pf-v6-c-menu__item-description {
10187
+ font-size: var(--pf-v6-c-menu__item-description--FontSize);
10188
+ color: var(--pf-v6-c-menu__item-description--Color);
10189
+ word-break: break-word;
10190
+ }
10191
+
10192
+ .pf-v6-c-menu__item-check .pf-v6-c-check {
10193
+ --pf-v6-c-check__input--TranslateY: none;
10194
+ }
10195
+
10196
+ .pf-v6-c-menu__item-toggle-icon {
10197
+ color: var(--pf-v6-c-menu__item-toggle-icon--Color, inherit);
10198
+ }
10199
+
10200
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-menu__item-toggle-icon {
10201
+ scale: -1 1;
10202
+ }
10203
+
10204
+ .pf-v6-c-menu__item-icon {
10205
+ color: var(--pf-v6-c-menu__item--icon--Color, inherit);
10206
+ }
10207
+
10208
+ .pf-v6-c-menu__item-select-icon,
10209
+ .pf-v6-c-menu__item-external-icon {
10210
+ opacity: 0;
10211
+ }
10212
+
10213
+ .pf-v6-c-menu__item-toggle-icon.pf-m-favorited, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button,
10214
+ .pf-v6-c-menu__item-action.pf-m-favorited,
10215
+ .pf-v6-c-menu__item-action.pf-m-favorited:hover,
10216
+ .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button {
10217
+ --pf-v6-c-button--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
10218
+ --pf-v6-c-menu__item-action--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
10219
+ }
10220
+
10221
+ .pf-v6-c-menu__breadcrumb {
10222
+ --pf-v6-c-breadcrumb__item--FontSize: var(--pf-v6-c-menu__breadcrumb--FontSize);
10223
+ padding-block-start: var(--pf-v6-c-menu__breadcrumb--PaddingBlockStart);
10224
+ padding-block-end: var(--pf-v6-c-menu__breadcrumb--PaddingBlockEnd);
10225
+ padding-inline-start: var(--pf-v6-c-menu__breadcrumb--PaddingInlineStart);
10226
+ padding-inline-end: var(--pf-v6-c-menu__breadcrumb--PaddingInlineEnd);
10227
+ }
10228
+
10229
+ .pf-v6-c-menu__breadcrumb .pf-v6-c-menu {
10230
+ min-width: auto;
10231
+ padding-block-start: var(--pf-v6-c-menu--PaddingBlockStart);
10232
+ padding-block-end: var(--pf-v6-c-menu--PaddingBlockEnd);
10233
+ }
10234
+
10235
+ .pf-v6-c-menu__breadcrumb .pf-v6-c-menu__content {
10236
+ height: auto;
10237
+ }
10238
+
10239
+ .pf-v6-c-menu__breadcrumb .pf-v6-c-menu-toggle {
10240
+ --pf-v6-c-menu-toggle--BorderWidth: 0;
10241
+ --pf-v6-c-menu-toggle--BorderColor: transparent;
10242
+ outline-offset: var(--pf-v6-c-menu--OutlineOffset);
10243
+ }
10244
+
10245
+ :where(:root, .pf-v6-c-login) {
10246
+ --pf-v6-c-login--PaddingBlockStart: var(--pf-t--global--spacer--lg);
10247
+ --pf-v6-c-login--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
10248
+ --pf-v6-c-login__container--xl--GridColumnGap: var(--pf-t--global--spacer--3xl);
10249
+ --pf-v6-c-login__container--MaxWidth: 31.25rem;
10250
+ --pf-v6-c-login__container--xl--MaxWidth: none;
10251
+ --pf-v6-c-login__container--PaddingInlineStart: 6.125rem;
10252
+ --pf-v6-c-login__container--PaddingInlineEnd: 6.125rem;
10253
+ --pf-v6-c-login__container--xl--GridTemplateColumns: 34rem minmax(auto, 34rem);
10254
+ --pf-v6-c-login__header--MarginBlockEnd: var(--pf-t--global--spacer--md);
10255
+ --pf-v6-c-login__header--PaddingInlineStart: var(--pf-t--global--spacer--md);
10256
+ --pf-v6-c-login__header--PaddingInlineEnd: var(--pf-t--global--spacer--md);
10257
+ --pf-v6-c-login__header--xl--MarginBlockEnd: var(--pf-t--global--spacer--2xl);
10258
+ --pf-v6-c-login__header--xl--MarginBlockStart: var(--pf-t--global--spacer--3xl);
10259
+ --pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-t--global--spacer--lg);
10260
+ --pf-v6-c-login__header--c-brand--xl--MarginBlockEnd: var(--pf-t--global--spacer--2xl);
10261
+ --pf-v6-c-login__main--BackgroundColor: var(--pf-t--global--background--color--primary--default);
10262
+ --pf-v6-c-login__main--MarginBlockEnd: var(--pf-t--global--spacer--lg);
10263
+ --pf-v6-c-login__main--BorderRadius: var(--pf-t--global--border--radius--large);
10264
+ --pf-v6-c-login__main-header--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
10265
+ --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
10266
+ --pf-v6-c-login__main-header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
10267
+ --pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-t--global--spacer--xl);
10268
+ --pf-v6-c-login__main-header--md--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
10269
+ --pf-v6-c-login__main-header--md--PaddingInlineStart: var(--pf-t--global--spacer--2xl);
10270
+ --pf-v6-c-login__main-header--ColumnGap: var(--pf-t--global--spacer--md);
10271
+ --pf-v6-c-login__main-header--RowGap: var(--pf-t--global--spacer--md);
10272
+ --pf-v6-c-login__main-header-desc--MarginBlockEnd: var(--pf-t--global--spacer--sm);
10273
+ --pf-v6-c-login__main-header-desc--md--MarginBlockEnd: 0;
10274
+ --pf-v6-c-login__main-header-desc--FontSize: var(--pf-t--global--font--size--body--default);
10275
+ --pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--xl);
10276
+ --pf-v6-c-login__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
10277
+ --pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-t--global--spacer--xl);
10278
+ --pf-v6-c-login__main-body--md--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
10279
+ --pf-v6-c-login__main-body--md--PaddingInlineStart: var(--pf-t--global--spacer--2xl);
10280
+ --pf-v6-c-login__main-footer--PaddingBlockEnd: var(--pf-t--global--spacer--3xl);
10281
+ --pf-v6-c-login__main-footer--c-title--MarginBlockEnd: var(--pf-t--global--spacer--md);
10282
+ --pf-v6-c-login__main-footer-links--PaddingBlockStart: var(--pf-t--global--spacer--sm);
10283
+ --pf-v6-c-login__main-footer-links--PaddingInlineEnd: var(--pf-t--global--spacer--3xl);
10284
+ --pf-v6-c-login__main-footer-links--PaddingBlockEnd: var(--pf-t--global--spacer--xl);
10285
+ --pf-v6-c-login__main-footer-links--PaddingInlineStart: var(--pf-t--global--spacer--3xl);
10286
+ --pf-v6-c-login__main-footer-links--Gap: var(--pf-t--global--spacer--md);
10287
+ --pf-v6-c-login__main-footer-links-item--c-button--FontSize: var(--pf-t--global--icon--size--xl);
10288
+ --pf-v6-c-login__main-footer-band--PaddingBlockStart: var(--pf-t--global--spacer--lg);
10289
+ --pf-v6-c-login__main-footer-band--PaddingInlineEnd: var(--pf-t--global--spacer--md);
10290
+ --pf-v6-c-login__main-footer-band--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
10291
+ --pf-v6-c-login__main-footer-band--PaddingInlineStart: var(--pf-t--global--spacer--md);
10292
+ --pf-v6-c-login__main-footer-band--BorderBlockStartColor: var(--pf-t--global--border--color--default);
10293
+ --pf-v6-c-login__main-footer-band--BorderBlockStartWidth: var(--pf-t--global--border--width--divider--default);
10294
+ --pf-v6-c-login__main-footer-band-item--PaddingBlockStart: var(--pf-t--global--spacer--md);
10295
+ --pf-v6-c-login__footer--PaddingInlineStart: var(--pf-t--global--spacer--md);
10296
+ --pf-v6-c-login__footer--PaddingInlineEnd: var(--pf-t--global--spacer--md);
10297
+ --pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-t--global--spacer--md);
10298
+ --pf-v6-c-login__footer--c-list--xl--PaddingBlockStart: var(--pf-t--global--spacer--2xl);
10299
+ }
10300
+
10301
+ @media (min-width: 1200px) {
10302
+ :where(:root, .pf-v6-c-login) {
10303
+ --pf-v6-c-login__container--MaxWidth: var(--pf-v6-c-login__container--xl--MaxWidth);
10304
+ }
10305
+ }
10306
+ @media (min-width: 576px) {
10307
+ :where(:root, .pf-v6-c-login) {
10308
+ --pf-v6-c-login__header--PaddingInlineEnd: 0;
10309
+ --pf-v6-c-login__header--PaddingInlineStart: 0;
10310
+ }
10311
+ }
10312
+ @media (min-width: 1200px) {
10313
+ :where(:root, .pf-v6-c-login) {
10314
+ --pf-v6-c-login__header--MarginBlockEnd: var(--pf-v6-c-login__header--xl--MarginBlockEnd);
10315
+ --pf-v6-c-login__header--c-brand--MarginBlockEnd: var(--pf-v6-c-login__header--c-brand--xl--MarginBlockEnd);
10316
+ }
10317
+ }
10318
+ @media (min-width: 1200px) {
10319
+ :where(:root, .pf-v6-c-login) {
10320
+ --pf-v6-c-login__main--MarginBlockEnd: 0;
10321
+ }
10322
+ }
10323
+ @media (min-width: 768px) {
10324
+ :where(:root, .pf-v6-c-login) {
10325
+ --pf-v6-c-login__main-header--PaddingInlineEnd: var(--pf-v6-c-login__main-header--md--PaddingInlineEnd);
10326
+ --pf-v6-c-login__main-header--PaddingInlineStart: var(--pf-v6-c-login__main-header--md--PaddingInlineStart);
10327
+ --pf-v6-c-login__main-header-desc--MarginBlockEnd: var(--pf-v6-c-login__main-header-desc--md--MarginBlockEnd);
10328
+ }
10329
+ }
10330
+ @media (min-width: 768px) {
10331
+ :where(:root, .pf-v6-c-login) {
10332
+ --pf-v6-c-login__main-body--PaddingInlineEnd: var(--pf-v6-c-login__main-body--md--PaddingInlineEnd);
10333
+ --pf-v6-c-login__main-body--PaddingInlineStart: var(--pf-v6-c-login__main-body--md--PaddingInlineStart);
10334
+ }
10335
+ }
10336
+ @media (min-width: 576px) {
10337
+ :where(:root, .pf-v6-c-login) {
10338
+ --pf-v6-c-login__footer--PaddingInlineEnd: 0;
10339
+ --pf-v6-c-login__footer--PaddingInlineStart: 0;
10340
+ }
10341
+ }
10342
+ @media (min-width: 1200px) {
10343
+ :where(:root, .pf-v6-c-login) {
10344
+ --pf-v6-c-login__footer--c-list--PaddingBlockStart: var(--pf-v6-c-login__footer--c-list--xl--PaddingBlockStart);
10392
10345
  }
10393
10346
  }
10394
- @media screen and (min-width: 1450px) {
10395
- .pf-v6-c-menu__item.pf-m-hidden-on-2xl {
10396
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
10347
+ .pf-v6-c-login {
10348
+ display: flex;
10349
+ justify-content: center;
10350
+ min-height: 100vh;
10351
+ padding-block-start: var(--pf-v6-c-login--PaddingBlockStart);
10352
+ padding-block-end: var(--pf-v6-c-login--PaddingBlockEnd);
10353
+ }
10354
+
10355
+ @media (min-width: 576px) {
10356
+ .pf-v6-c-login {
10357
+ align-items: center;
10397
10358
  }
10398
- .pf-v6-c-menu__item.pf-m-visible-on-2xl {
10399
- --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
10359
+ }
10360
+ .pf-v6-c-login__container {
10361
+ width: 100%;
10362
+ max-width: var(--pf-v6-c-login__container--MaxWidth);
10363
+ }
10364
+
10365
+ @media (min-width: 1200px) {
10366
+ .pf-v6-c-login__container {
10367
+ display: grid;
10368
+ grid-template-areas: "main header" "main footer" "main .";
10369
+ grid-template-columns: var(--pf-v6-c-login__container--xl--GridTemplateColumns);
10370
+ grid-column-gap: var(--pf-v6-c-login__container--xl--GridColumnGap);
10371
+ justify-content: center;
10372
+ padding-inline-start: var(--pf-v6-c-login__container--PaddingInlineStart);
10373
+ padding-inline-end: var(--pf-v6-c-login__container--PaddingInlineEnd);
10400
10374
  }
10401
10375
  }
10402
- :where(label).pf-v6-c-menu__item {
10403
- cursor: pointer;
10376
+ .pf-v6-c-login__header {
10377
+ grid-area: header;
10378
+ padding-inline-start: var(--pf-v6-c-login__header--PaddingInlineStart);
10379
+ padding-inline-end: var(--pf-v6-c-login__header--PaddingInlineEnd);
10404
10380
  }
10405
10381
 
10406
- .pf-v6-c-menu__item.pf-m-selected {
10407
- --pf-v6-c-menu__item-select-icon--Color: var(--pf-v6-c-menu__item--m-selected__item-select-icon--Color);
10382
+ @media (min-width: 1200px) {
10383
+ .pf-v6-c-login__header {
10384
+ margin-block-start: var(--pf-v6-c-login__header--xl--MarginBlockStart);
10385
+ }
10386
+ }
10387
+ .pf-v6-c-login__header .pf-v6-c-brand {
10388
+ margin-block-end: var(--pf-v6-c-login__header--c-brand--MarginBlockEnd);
10408
10389
  }
10409
10390
 
10410
- .pf-v6-c-menu__item:is(:hover, :focus, .pf-m-selected) .pf-v6-c-menu__item-select-icon,
10411
- .pf-v6-c-menu__item:is(:hover, :focus, .pf-m-selected) .pf-v6-c-menu__item-external-icon {
10412
- opacity: 1;
10391
+ .pf-v6-c-login__main {
10392
+ grid-area: main;
10393
+ align-self: start;
10394
+ margin-block-end: var(--pf-v6-c-login__main--MarginBlockEnd);
10395
+ background-color: var(--pf-v6-c-login__main--BackgroundColor);
10396
+ border-radius: var(--pf-v6-c-login__main--BorderRadius);
10413
10397
  }
10414
10398
 
10415
- .pf-v6-c-menu__item:is(:hover, :focus, .pf-m-selected) .pf-v6-c-menu__item-external-icon {
10416
- color: var(--pf-v6-c-menu__item-external--Color);
10399
+ .pf-v6-c-login__main > :first-child:not(.pf-v6-c-login__main-header) {
10400
+ padding-block-start: var(--pf-v6-c-login__main-header--PaddingBlockStart);
10417
10401
  }
10418
10402
 
10419
- .pf-v6-c-menu__item-select-icon {
10420
- color: var(--pf-v6-c-menu__item-select-icon--Color);
10403
+ .pf-v6-c-login__main > :last-child:not(.pf-v6-c-login__main-footer) {
10404
+ padding-block-end: var(--pf-v6-c-login__main-footer--PaddingBlockEnd);
10421
10405
  }
10422
10406
 
10423
- .pf-v6-c-menu__item-main {
10424
- column-gap: var(--pf-v6-c-menu__item-main--ColumnGap);
10407
+ .pf-v6-c-login__main-header {
10408
+ display: grid;
10409
+ grid-template-columns: 100%;
10410
+ row-gap: var(--pf-v6-c-login__main-header--RowGap);
10411
+ column-gap: var(--pf-v6-c-login__main-header--ColumnGap);
10425
10412
  align-items: center;
10426
- width: 100%;
10413
+ padding-block-start: var(--pf-v6-c-login__main-header--PaddingBlockStart);
10414
+ padding-block-end: var(--pf-v6-c-login__main-header--PaddingBlockEnd);
10415
+ padding-inline-start: var(--pf-v6-c-login__main-header--PaddingInlineStart);
10416
+ padding-inline-end: var(--pf-v6-c-login__main-header--PaddingInlineEnd);
10427
10417
  }
10428
10418
 
10429
- .pf-v6-c-menu__item-text {
10430
- overflow: hidden;
10431
- text-overflow: ellipsis;
10432
- white-space: nowrap;
10433
- flex-grow: 1;
10419
+ @media (min-width: 768px) {
10420
+ .pf-v6-c-login__main-header {
10421
+ grid-template-columns: 1fr auto;
10422
+ }
10423
+ }
10424
+ .pf-v6-c-login__main-header-utilities,
10425
+ .pf-v6-c-login__main-header .pf-v6-c-menu-toggle {
10426
+ grid-row: auto;
10427
+ grid-column: auto;
10434
10428
  }
10435
10429
 
10436
- .pf-v6-c-menu__group-title {
10437
- padding-block-start: var(--pf-v6-c-menu__group-title--PaddingBlockStart);
10438
- padding-block-end: var(--pf-v6-c-menu__group-title--PaddingBlockEnd);
10439
- padding-inline-start: var(--pf-v6-c-menu__group-title--PaddingInlineStart);
10440
- padding-inline-end: var(--pf-v6-c-menu__group-title--PaddingInlineEnd);
10441
- font-size: var(--pf-v6-c-menu__group-title--FontSize, inherit);
10442
- font-weight: var(--pf-v6-c-menu__group-title--FontWeight, inherit);
10443
- color: var(--pf-v6-c-menu__group-title--Color);
10430
+ @media (min-width: 768px) {
10431
+ .pf-v6-c-login__main-header-utilities,
10432
+ .pf-v6-c-login__main-header .pf-v6-c-menu-toggle {
10433
+ grid-row: 1;
10434
+ grid-column: 2/3;
10435
+ }
10436
+ }
10437
+ .pf-v6-c-login__main-header-desc {
10438
+ grid-column: 1/-1;
10439
+ margin-block-end: var(--pf-v6-c-login__main-header-desc--MarginBlockEnd);
10440
+ font-size: var(--pf-v6-c-login__main-header-desc--FontSize);
10444
10441
  }
10445
10442
 
10446
- .pf-v6-c-menu__item-description {
10447
- font-size: var(--pf-v6-c-menu__item-description--FontSize);
10448
- color: var(--pf-v6-c-menu__item-description--Color);
10449
- word-break: break-word;
10443
+ .pf-v6-c-login__main-body {
10444
+ padding-block-end: var(--pf-v6-c-login__main-body--PaddingBlockEnd);
10445
+ padding-inline-start: var(--pf-v6-c-login__main-body--PaddingInlineStart);
10446
+ padding-inline-end: var(--pf-v6-c-login__main-body--PaddingInlineEnd);
10450
10447
  }
10451
10448
 
10452
- .pf-v6-c-menu__item-check .pf-v6-c-check {
10453
- --pf-v6-c-check__input--TranslateY: none;
10449
+ .pf-v6-c-login__main-footer {
10450
+ display: flex;
10451
+ flex-wrap: wrap;
10454
10452
  }
10455
10453
 
10456
- .pf-v6-c-menu__item-toggle-icon {
10457
- color: var(--pf-v6-c-menu__item-toggle-icon--Color, inherit);
10454
+ .pf-v6-c-login__main-footer .pf-v6-c-title {
10455
+ margin-block-end: var(--pf-v6-c-login__main-footer--c-title--MarginBlockEnd);
10456
+ text-align: center;
10458
10457
  }
10459
10458
 
10460
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-menu__item-toggle-icon {
10461
- scale: -1 1;
10459
+ .pf-v6-c-login__main-footer > * {
10460
+ flex-basis: 100%;
10462
10461
  }
10463
10462
 
10464
- .pf-v6-c-menu__item-icon {
10465
- color: var(--pf-v6-c-menu__item--icon--Color, inherit);
10463
+ .pf-v6-c-login__main-footer-links {
10464
+ display: flex;
10465
+ flex-wrap: wrap;
10466
+ gap: var(--pf-v6-c-login__main-footer-links--Gap);
10467
+ justify-content: center;
10468
+ padding-block-start: var(--pf-v6-c-login__main-footer-links--PaddingBlockStart);
10469
+ padding-block-end: var(--pf-v6-c-login__main-footer-links--PaddingBlockEnd);
10470
+ padding-inline-start: var(--pf-v6-c-login__main-footer-links--PaddingInlineStart);
10471
+ padding-inline-end: var(--pf-v6-c-login__main-footer-links--PaddingInlineEnd);
10466
10472
  }
10467
10473
 
10468
- .pf-v6-c-menu__item-select-icon,
10469
- .pf-v6-c-menu__item-external-icon {
10470
- opacity: 0;
10474
+ .pf-v6-c-login__main-footer-links-item .pf-v6-c-button {
10475
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-login__main-footer-links-item--c-button--FontSize);
10471
10476
  }
10472
10477
 
10473
- .pf-v6-c-menu__item-toggle-icon.pf-m-favorited, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited:hover, .pf-v6-c-menu__item-toggle-icon.pf-m-favorited .pf-v6-c-button,
10474
- .pf-v6-c-menu__item-action.pf-m-favorited,
10475
- .pf-v6-c-menu__item-action.pf-m-favorited:hover,
10476
- .pf-v6-c-menu__item-action.pf-m-favorited .pf-v6-c-button {
10477
- --pf-v6-c-button--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
10478
- --pf-v6-c-menu__item-action--Color: var(--pf-v6-c-menu__item-action--m-favorited--Color);
10478
+ .pf-v6-c-login__main-footer-band {
10479
+ padding-block-start: var(--pf-v6-c-login__main-footer-band--PaddingBlockStart);
10480
+ padding-block-end: var(--pf-v6-c-login__main-footer-band--PaddingBlockEnd);
10481
+ padding-inline-start: var(--pf-v6-c-login__main-footer-band--PaddingInlineStart);
10482
+ padding-inline-end: var(--pf-v6-c-login__main-footer-band--PaddingInlineEnd);
10483
+ text-align: center;
10484
+ border-block-start: var(--pf-v6-c-login__main-footer-band--BorderBlockStartWidth) solid var(--pf-v6-c-login__main-footer-band--BorderBlockStartColor);
10479
10485
  }
10480
10486
 
10481
- .pf-v6-c-menu__breadcrumb {
10482
- --pf-v6-c-breadcrumb__item--FontSize: var(--pf-v6-c-menu__breadcrumb--FontSize);
10483
- padding-block-start: var(--pf-v6-c-menu__breadcrumb--PaddingBlockStart);
10484
- padding-block-end: var(--pf-v6-c-menu__breadcrumb--PaddingBlockEnd);
10485
- padding-inline-start: var(--pf-v6-c-menu__breadcrumb--PaddingInlineStart);
10486
- padding-inline-end: var(--pf-v6-c-menu__breadcrumb--PaddingInlineEnd);
10487
+ .pf-v6-c-login__main-footer-band > * + * {
10488
+ padding-block-start: var(--pf-v6-c-login__main-footer-band-item--PaddingBlockStart);
10487
10489
  }
10488
10490
 
10489
- .pf-v6-c-menu__breadcrumb .pf-v6-c-menu {
10490
- min-width: auto;
10491
- padding-block-start: var(--pf-v6-c-menu--PaddingBlockStart);
10492
- padding-block-end: var(--pf-v6-c-menu--PaddingBlockEnd);
10491
+ .pf-v6-c-login__footer {
10492
+ grid-area: footer;
10493
+ padding-inline-start: var(--pf-v6-c-login__footer--PaddingInlineStart);
10494
+ padding-inline-end: var(--pf-v6-c-login__footer--PaddingInlineEnd);
10493
10495
  }
10494
10496
 
10495
- .pf-v6-c-menu__breadcrumb .pf-v6-c-menu__content {
10496
- height: auto;
10497
+ .pf-v6-c-login__footer .pf-v6-c-list a {
10498
+ color: unset;
10497
10499
  }
10498
10500
 
10499
- .pf-v6-c-menu__breadcrumb .pf-v6-c-menu-toggle {
10500
- --pf-v6-c-menu-toggle--BorderWidth: 0;
10501
- --pf-v6-c-menu-toggle--BorderColor: transparent;
10502
- outline-offset: var(--pf-v6-c-menu--OutlineOffset);
10501
+ .pf-v6-c-login__footer .pf-v6-c-list:not(:only-child) {
10502
+ padding-block-start: var(--pf-v6-c-login__footer--c-list--PaddingBlockStart);
10503
10503
  }
10504
10504
 
10505
10505
  :where(:root, .pf-v6-c-modal-box) {
@@ -12541,157 +12541,375 @@ ul.pf-v6-c-list {
12541
12541
  .pf-v6-c-pagination.pf-m-inset-2xl {
12542
12542
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
12543
12543
  }
12544
-
12545
- @media (min-width: 576px) {
12546
- .pf-v6-c-pagination.pf-m-display-summary-on-sm {
12544
+
12545
+ @media (min-width: 576px) {
12546
+ .pf-v6-c-pagination.pf-m-display-summary-on-sm {
12547
+ --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-summary__nav--Display);
12548
+ --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-summary__page-menu--Display);
12549
+ --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-summary__total-items--Display);
12550
+ }
12551
+ .pf-v6-c-pagination.pf-m-display-full-on-sm {
12552
+ --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-full__nav--Display);
12553
+ --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-full__page-menu--Display);
12554
+ --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-full__total-items--Display);
12555
+ }
12556
+ .pf-v6-c-pagination.pf-m-inset-none-on-sm {
12557
+ --pf-v6-c-pagination--inset: 0;
12558
+ }
12559
+ .pf-v6-c-pagination.pf-m-inset-sm-on-sm {
12560
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--sm);
12561
+ }
12562
+ .pf-v6-c-pagination.pf-m-inset-md-on-sm {
12563
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--md);
12564
+ }
12565
+ .pf-v6-c-pagination.pf-m-inset-lg-on-sm {
12566
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--lg);
12567
+ }
12568
+ .pf-v6-c-pagination.pf-m-inset-xl-on-sm {
12569
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--xl);
12570
+ }
12571
+ .pf-v6-c-pagination.pf-m-inset-2xl-on-sm {
12572
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
12573
+ }
12574
+ }
12575
+ @media (min-width: 768px) {
12576
+ .pf-v6-c-pagination.pf-m-display-summary-on-md {
12577
+ --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-summary__nav--Display);
12578
+ --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-summary__page-menu--Display);
12579
+ --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-summary__total-items--Display);
12580
+ }
12581
+ .pf-v6-c-pagination.pf-m-display-full-on-md {
12582
+ --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-full__nav--Display);
12583
+ --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-full__page-menu--Display);
12584
+ --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-full__total-items--Display);
12585
+ }
12586
+ .pf-v6-c-pagination.pf-m-inset-none-on-md {
12587
+ --pf-v6-c-pagination--inset: 0;
12588
+ }
12589
+ .pf-v6-c-pagination.pf-m-inset-sm-on-md {
12590
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--sm);
12591
+ }
12592
+ .pf-v6-c-pagination.pf-m-inset-md-on-md {
12593
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--md);
12594
+ }
12595
+ .pf-v6-c-pagination.pf-m-inset-lg-on-md {
12596
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--lg);
12597
+ }
12598
+ .pf-v6-c-pagination.pf-m-inset-xl-on-md {
12599
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--xl);
12600
+ }
12601
+ .pf-v6-c-pagination.pf-m-inset-2xl-on-md {
12602
+ --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
12603
+ }
12604
+ }
12605
+ @media (min-width: 992px) {
12606
+ .pf-v6-c-pagination.pf-m-display-summary-on-lg {
12547
12607
  --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-summary__nav--Display);
12548
12608
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-summary__page-menu--Display);
12549
12609
  --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-summary__total-items--Display);
12550
12610
  }
12551
- .pf-v6-c-pagination.pf-m-display-full-on-sm {
12611
+ .pf-v6-c-pagination.pf-m-display-full-on-lg {
12552
12612
  --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-full__nav--Display);
12553
12613
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-full__page-menu--Display);
12554
12614
  --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-full__total-items--Display);
12555
12615
  }
12556
- .pf-v6-c-pagination.pf-m-inset-none-on-sm {
12616
+ .pf-v6-c-pagination.pf-m-inset-none-on-lg {
12557
12617
  --pf-v6-c-pagination--inset: 0;
12558
12618
  }
12559
- .pf-v6-c-pagination.pf-m-inset-sm-on-sm {
12619
+ .pf-v6-c-pagination.pf-m-inset-sm-on-lg {
12560
12620
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--sm);
12561
12621
  }
12562
- .pf-v6-c-pagination.pf-m-inset-md-on-sm {
12622
+ .pf-v6-c-pagination.pf-m-inset-md-on-lg {
12563
12623
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--md);
12564
12624
  }
12565
- .pf-v6-c-pagination.pf-m-inset-lg-on-sm {
12625
+ .pf-v6-c-pagination.pf-m-inset-lg-on-lg {
12566
12626
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--lg);
12567
12627
  }
12568
- .pf-v6-c-pagination.pf-m-inset-xl-on-sm {
12628
+ .pf-v6-c-pagination.pf-m-inset-xl-on-lg {
12569
12629
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--xl);
12570
12630
  }
12571
- .pf-v6-c-pagination.pf-m-inset-2xl-on-sm {
12631
+ .pf-v6-c-pagination.pf-m-inset-2xl-on-lg {
12572
12632
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
12573
12633
  }
12574
12634
  }
12575
- @media (min-width: 768px) {
12576
- .pf-v6-c-pagination.pf-m-display-summary-on-md {
12635
+ @media (min-width: 1200px) {
12636
+ .pf-v6-c-pagination.pf-m-display-summary-on-xl {
12577
12637
  --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-summary__nav--Display);
12578
12638
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-summary__page-menu--Display);
12579
12639
  --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-summary__total-items--Display);
12580
12640
  }
12581
- .pf-v6-c-pagination.pf-m-display-full-on-md {
12641
+ .pf-v6-c-pagination.pf-m-display-full-on-xl {
12582
12642
  --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-full__nav--Display);
12583
12643
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-full__page-menu--Display);
12584
12644
  --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-full__total-items--Display);
12585
12645
  }
12586
- .pf-v6-c-pagination.pf-m-inset-none-on-md {
12646
+ .pf-v6-c-pagination.pf-m-inset-none-on-xl {
12587
12647
  --pf-v6-c-pagination--inset: 0;
12588
12648
  }
12589
- .pf-v6-c-pagination.pf-m-inset-sm-on-md {
12649
+ .pf-v6-c-pagination.pf-m-inset-sm-on-xl {
12590
12650
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--sm);
12591
12651
  }
12592
- .pf-v6-c-pagination.pf-m-inset-md-on-md {
12652
+ .pf-v6-c-pagination.pf-m-inset-md-on-xl {
12593
12653
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--md);
12594
12654
  }
12595
- .pf-v6-c-pagination.pf-m-inset-lg-on-md {
12655
+ .pf-v6-c-pagination.pf-m-inset-lg-on-xl {
12596
12656
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--lg);
12597
12657
  }
12598
- .pf-v6-c-pagination.pf-m-inset-xl-on-md {
12658
+ .pf-v6-c-pagination.pf-m-inset-xl-on-xl {
12599
12659
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--xl);
12600
12660
  }
12601
- .pf-v6-c-pagination.pf-m-inset-2xl-on-md {
12661
+ .pf-v6-c-pagination.pf-m-inset-2xl-on-xl {
12602
12662
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
12603
12663
  }
12604
12664
  }
12605
- @media (min-width: 992px) {
12606
- .pf-v6-c-pagination.pf-m-display-summary-on-lg {
12665
+ @media (min-width: 1450px) {
12666
+ .pf-v6-c-pagination.pf-m-display-summary-on-2xl {
12607
12667
  --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-summary__nav--Display);
12608
12668
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-summary__page-menu--Display);
12609
12669
  --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-summary__total-items--Display);
12610
12670
  }
12611
- .pf-v6-c-pagination.pf-m-display-full-on-lg {
12671
+ .pf-v6-c-pagination.pf-m-display-full-on-2xl {
12612
12672
  --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-full__nav--Display);
12613
12673
  --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-full__page-menu--Display);
12614
12674
  --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-full__total-items--Display);
12615
12675
  }
12616
- .pf-v6-c-pagination.pf-m-inset-none-on-lg {
12676
+ .pf-v6-c-pagination.pf-m-inset-none-on-2xl {
12617
12677
  --pf-v6-c-pagination--inset: 0;
12618
12678
  }
12619
- .pf-v6-c-pagination.pf-m-inset-sm-on-lg {
12679
+ .pf-v6-c-pagination.pf-m-inset-sm-on-2xl {
12620
12680
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--sm);
12621
12681
  }
12622
- .pf-v6-c-pagination.pf-m-inset-md-on-lg {
12682
+ .pf-v6-c-pagination.pf-m-inset-md-on-2xl {
12623
12683
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--md);
12624
12684
  }
12625
- .pf-v6-c-pagination.pf-m-inset-lg-on-lg {
12685
+ .pf-v6-c-pagination.pf-m-inset-lg-on-2xl {
12626
12686
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--lg);
12627
12687
  }
12628
- .pf-v6-c-pagination.pf-m-inset-xl-on-lg {
12688
+ .pf-v6-c-pagination.pf-m-inset-xl-on-2xl {
12629
12689
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--xl);
12630
12690
  }
12631
- .pf-v6-c-pagination.pf-m-inset-2xl-on-lg {
12691
+ .pf-v6-c-pagination.pf-m-inset-2xl-on-2xl {
12632
12692
  --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
12633
12693
  }
12634
12694
  }
12635
- @media (min-width: 1200px) {
12636
- .pf-v6-c-pagination.pf-m-display-summary-on-xl {
12637
- --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-summary__nav--Display);
12638
- --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-summary__page-menu--Display);
12639
- --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-summary__total-items--Display);
12640
- }
12641
- .pf-v6-c-pagination.pf-m-display-full-on-xl {
12642
- --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-full__nav--Display);
12643
- --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-full__page-menu--Display);
12644
- --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-full__total-items--Display);
12645
- }
12646
- .pf-v6-c-pagination.pf-m-inset-none-on-xl {
12647
- --pf-v6-c-pagination--inset: 0;
12648
- }
12649
- .pf-v6-c-pagination.pf-m-inset-sm-on-xl {
12650
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--sm);
12651
- }
12652
- .pf-v6-c-pagination.pf-m-inset-md-on-xl {
12653
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--md);
12654
- }
12655
- .pf-v6-c-pagination.pf-m-inset-lg-on-xl {
12656
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--lg);
12657
- }
12658
- .pf-v6-c-pagination.pf-m-inset-xl-on-xl {
12659
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--xl);
12660
- }
12661
- .pf-v6-c-pagination.pf-m-inset-2xl-on-xl {
12662
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
12663
- }
12695
+ :where(:root, .pf-v6-c-popover) {
12696
+ --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
12697
+ --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
12698
+ --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
12699
+ --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
12700
+ --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
12701
+ --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
12702
+ --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
12703
+ --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
12704
+ --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
12705
+ --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
12706
+ --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
12707
+ --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
12708
+ --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
12709
+ --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
12710
+ --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
12711
+ --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
12712
+ --pf-v6-c-popover__arrow--Width: 0.9375rem;
12713
+ --pf-v6-c-popover__arrow--Height: 0.9375rem;
12714
+ --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
12715
+ --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
12716
+ --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
12717
+ --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
12718
+ --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
12719
+ --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
12720
+ --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
12721
+ --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
12722
+ --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
12723
+ --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
12724
+ --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
12725
+ --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
12726
+ --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
12727
+ --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
12728
+ --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
12729
+ --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
12730
+ --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
12731
+ --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
12732
+ --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
12733
+ --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
12734
+ --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
12735
+ --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
12736
+ --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
12737
+ --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
12738
+ --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
12739
+ --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
12740
+ --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
12741
+ --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
12742
+ --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
12743
+ }
12744
+
12745
+ .pf-v6-c-popover {
12746
+ position: relative;
12747
+ min-width: var(--pf-v6-c-popover--MinWidth);
12748
+ max-width: var(--pf-v6-c-popover--MaxWidth);
12749
+ font-size: var(--pf-v6-c-popover--FontSize);
12750
+ border-radius: var(--pf-v6-c-popover--BorderRadius);
12751
+ box-shadow: var(--pf-v6-c-popover--BoxShadow);
12752
+ }
12753
+
12754
+ .pf-v6-c-popover.pf-m-no-padding {
12755
+ --pf-v6-c-popover__content--PaddingBlockStart: 0px;
12756
+ --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
12757
+ --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
12758
+ --pf-v6-c-popover__content--PaddingInlineStart: 0px;
12759
+ }
12760
+
12761
+ .pf-v6-c-popover.pf-m-width-auto {
12762
+ --pf-v6-c-popover--MinWidth: auto;
12763
+ --pf-v6-c-popover--MaxWidth: none;
12764
+ }
12765
+
12766
+ .pf-v6-c-popover:is(.pf-m-top,
12767
+ .pf-m-top-left,
12768
+ .pf-m-top-right) {
12769
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
12770
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
12771
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
12772
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
12773
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
12774
+ }
12775
+
12776
+ .pf-v6-c-popover:is(.pf-m-bottom,
12777
+ .pf-m-bottom-left,
12778
+ .pf-m-bottom-right) {
12779
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
12780
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
12781
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
12782
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
12783
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
12784
+ }
12785
+
12786
+ .pf-v6-c-popover:is(.pf-m-left,
12787
+ .pf-m-left-top,
12788
+ .pf-m-left-bottom) {
12789
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
12790
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
12791
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
12792
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
12793
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
12794
+ }
12795
+
12796
+ .pf-v6-c-popover:is(.pf-m-right,
12797
+ .pf-m-right-top,
12798
+ .pf-m-right-bottom) {
12799
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
12800
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
12801
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
12802
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
12803
+ --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
12804
+ }
12805
+
12806
+ .pf-v6-c-popover:is(.pf-m-left-top,
12807
+ .pf-m-right-top) {
12808
+ --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
12809
+ --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
12810
+ }
12811
+
12812
+ .pf-v6-c-popover:is(.pf-m-left-bottom,
12813
+ .pf-m-right-bottom) {
12814
+ --pf-v6-c-popover__arrow--InsetBlockStart: auto;
12815
+ --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
12816
+ }
12817
+
12818
+ .pf-v6-c-popover:is(.pf-m-top-left,
12819
+ .pf-m-bottom-left) {
12820
+ --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
12821
+ --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
12822
+ }
12823
+
12824
+ .pf-v6-c-popover:is(.pf-m-top-right,
12825
+ .pf-m-bottom-right) {
12826
+ --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
12827
+ --pf-v6-c-popover__arrow--InsetInlineStart: auto;
12828
+ }
12829
+
12830
+ .pf-v6-c-popover.pf-m-danger {
12831
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
12832
+ }
12833
+
12834
+ .pf-v6-c-popover.pf-m-warning {
12835
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
12836
+ }
12837
+
12838
+ .pf-v6-c-popover.pf-m-success {
12839
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
12840
+ }
12841
+
12842
+ .pf-v6-c-popover.pf-m-custom {
12843
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
12844
+ }
12845
+
12846
+ .pf-v6-c-popover.pf-m-info {
12847
+ --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
12848
+ }
12849
+
12850
+ .pf-v6-c-popover__content {
12851
+ position: relative;
12852
+ padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
12853
+ padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
12854
+ padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
12855
+ padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
12856
+ background-color: var(--pf-v6-c-popover__content--BackgroundColor);
12857
+ border-radius: var(--pf-v6-c-popover__content--BorderRadius);
12858
+ }
12859
+
12860
+ .pf-v6-c-popover__close {
12861
+ position: absolute;
12862
+ inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
12863
+ inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
12864
+ }
12865
+
12866
+ .pf-v6-c-popover__close + * {
12867
+ padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
12868
+ }
12869
+
12870
+ .pf-v6-c-popover__arrow {
12871
+ position: absolute;
12872
+ top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
12873
+ right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
12874
+ bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
12875
+ left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
12876
+ width: var(--pf-v6-c-popover__arrow--Width);
12877
+ height: var(--pf-v6-c-popover__arrow--Height);
12878
+ pointer-events: none;
12879
+ background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
12880
+ box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
12881
+ transform: translateX(var(--pf-v6-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-popover__arrow--Rotate, 0));
12882
+ }
12883
+
12884
+ .pf-v6-c-popover__header {
12885
+ margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
12886
+ }
12887
+
12888
+ .pf-v6-c-popover__title {
12889
+ display: flex;
12890
+ flex: 0 0 auto;
12891
+ }
12892
+
12893
+ .pf-v6-c-popover__title-icon {
12894
+ margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
12895
+ font-size: var(--pf-v6-c-popover__title-icon--FontSize);
12896
+ color: var(--pf-v6-c-popover__title-icon--Color);
12897
+ }
12898
+
12899
+ .pf-v6-c-popover__title-text {
12900
+ font-size: var(--pf-v6-c-popover__title-text--FontSize);
12901
+ font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
12902
+ color: var(--pf-v6-c-popover__title-text--Color);
12664
12903
  }
12665
- @media (min-width: 1450px) {
12666
- .pf-v6-c-pagination.pf-m-display-summary-on-2xl {
12667
- --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-summary__nav--Display);
12668
- --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-summary__page-menu--Display);
12669
- --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-summary__total-items--Display);
12670
- }
12671
- .pf-v6-c-pagination.pf-m-display-full-on-2xl {
12672
- --pf-v6-c-pagination__nav--Display: var(--pf-v6-c-pagination--m-display-full__nav--Display);
12673
- --pf-v6-c-pagination__page-menu--Display: var(--pf-v6-c-pagination--m-display-full__page-menu--Display);
12674
- --pf-v6-c-pagination__total-items--Display: var(--pf-v6-c-pagination--m-display-full__total-items--Display);
12675
- }
12676
- .pf-v6-c-pagination.pf-m-inset-none-on-2xl {
12677
- --pf-v6-c-pagination--inset: 0;
12678
- }
12679
- .pf-v6-c-pagination.pf-m-inset-sm-on-2xl {
12680
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--sm);
12681
- }
12682
- .pf-v6-c-pagination.pf-m-inset-md-on-2xl {
12683
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--md);
12684
- }
12685
- .pf-v6-c-pagination.pf-m-inset-lg-on-2xl {
12686
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--lg);
12687
- }
12688
- .pf-v6-c-pagination.pf-m-inset-xl-on-2xl {
12689
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--xl);
12690
- }
12691
- .pf-v6-c-pagination.pf-m-inset-2xl-on-2xl {
12692
- --pf-v6-c-pagination--inset: var(--pf-t--global--spacer--2xl);
12693
- }
12904
+
12905
+ .pf-v6-c-popover__body {
12906
+ word-wrap: break-word;
12907
+ }
12908
+
12909
+ .pf-v6-c-popover__footer {
12910
+ margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
12694
12911
  }
12912
+
12695
12913
  :where(:root, .pf-v6-c-progress) {
12696
12914
  --pf-v6-c-progress--GridGap: var(--pf-t--global--spacer--md);
12697
12915
  --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
@@ -12871,222 +13089,90 @@ ul.pf-v6-c-list {
12871
13089
  margin-block-start: var(--pf-v6-c-progress__helper-text--MarginBlockStart);
12872
13090
  }
12873
13091
 
12874
- :where(:root, .pf-v6-c-popover) {
12875
- --pf-v6-c-popover--FontSize: var(--pf-t--global--font--size--body--sm);
12876
- --pf-v6-c-popover--MinWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
12877
- --pf-v6-c-popover--MaxWidth: calc(var(--pf-v6-c-popover__content--PaddingInlineStart) + var(--pf-v6-c-popover__content--PaddingInlineEnd) + 18.75rem);
12878
- --pf-v6-c-popover--BoxShadow: var(--pf-t--global--box-shadow--md);
12879
- --pf-v6-c-popover--BorderRadius: var(--pf-t--global--border--radius--medium);
12880
- --pf-v6-c-popover--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
12881
- --pf-v6-c-popover--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
12882
- --pf-v6-c-popover--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
12883
- --pf-v6-c-popover--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
12884
- --pf-v6-c-popover--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
12885
- --pf-v6-c-popover__content--BackgroundColor: var(--pf-t--global--background--color--floating--default);
12886
- --pf-v6-c-popover__content--PaddingBlockStart: var(--pf-t--global--spacer--md);
12887
- --pf-v6-c-popover__content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
12888
- --pf-v6-c-popover__content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
12889
- --pf-v6-c-popover__content--PaddingInlineStart: var(--pf-t--global--spacer--md);
12890
- --pf-v6-c-popover__content--BorderRadius: var(--pf-t--global--border--radius--medium);
12891
- --pf-v6-c-popover__arrow--Width: 0.9375rem;
12892
- --pf-v6-c-popover__arrow--Height: 0.9375rem;
12893
- --pf-v6-c-popover__arrow--BoxShadow: var(--pf-t--global--box-shadow--md);
12894
- --pf-v6-c-popover__arrow--BackgroundColor: var(--pf-t--global--background--color--floating--default);
12895
- --pf-v6-c-popover__arrow--m-top--TranslateX: -50%;
12896
- --pf-v6-c-popover__arrow--m-top--TranslateY: 50%;
12897
- --pf-v6-c-popover__arrow--m-top--Rotate: 45deg;
12898
- --pf-v6-c-popover__arrow--m-right--TranslateX: -50%;
12899
- --pf-v6-c-popover__arrow--m-right--TranslateY: -50%;
12900
- --pf-v6-c-popover__arrow--m-right--Rotate: 45deg;
12901
- --pf-v6-c-popover__arrow--m-bottom--TranslateX: -50%;
12902
- --pf-v6-c-popover__arrow--m-bottom--TranslateY: -50%;
12903
- --pf-v6-c-popover__arrow--m-bottom--Rotate: 45deg;
12904
- --pf-v6-c-popover__arrow--m-left--TranslateX: 50%;
12905
- --pf-v6-c-popover__arrow--m-left--TranslateY: -50%;
12906
- --pf-v6-c-popover__arrow--m-left--Rotate: 45deg;
12907
- --pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart: var(--pf-t--global--border--radius--medium);
12908
- --pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd: var(--pf-t--global--border--radius--medium);
12909
- --pf-v6-c-popover__arrow--m-block-left--InsetInlineStart: var(--pf-t--global--border--radius--medium);
12910
- --pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd: var(--pf-t--global--border--radius--medium);
12911
- --pf-v6-c-popover__close--InsetBlockStart: calc(var(--pf-v6-c-popover__content--PaddingBlockStart) - var(--pf-t--global--spacer--control--vertical--default));
12912
- --pf-v6-c-popover__close--InsetInlineEnd: var(--pf-v6-c-popover__content--PaddingInlineEnd);
12913
- --pf-v6-c-popover__close--sibling--PaddingInlineEnd: var(--pf-t--global--spacer--2xl);
12914
- --pf-v6-c-popover__header--MarginBlockEnd: var(--pf-t--global--spacer--sm);
12915
- --pf-v6-c-popover__title-text--Color: var(--pf-t--global--text--color--regular);
12916
- --pf-v6-c-popover__title-text--FontWeight: var(--pf-t--global--font--weight--body--bold);
12917
- --pf-v6-c-popover__title-text--FontSize: var(--pf-t--global--font--size--body--default);
12918
- --pf-v6-c-popover__title-icon--MarginInlineEnd: var(--pf-t--global--spacer--sm);
12919
- --pf-v6-c-popover__title-icon--Color: var(--pf-t--global--icon--color--regular);
12920
- --pf-v6-c-popover__title-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
12921
- --pf-v6-c-popover__footer--MarginBlockStart: var(--pf-t--global--spacer--md);
12922
- }
12923
-
12924
- .pf-v6-c-popover {
12925
- position: relative;
12926
- min-width: var(--pf-v6-c-popover--MinWidth);
12927
- max-width: var(--pf-v6-c-popover--MaxWidth);
12928
- font-size: var(--pf-v6-c-popover--FontSize);
12929
- border-radius: var(--pf-v6-c-popover--BorderRadius);
12930
- box-shadow: var(--pf-v6-c-popover--BoxShadow);
12931
- }
12932
-
12933
- .pf-v6-c-popover.pf-m-no-padding {
12934
- --pf-v6-c-popover__content--PaddingBlockStart: 0px;
12935
- --pf-v6-c-popover__content--PaddingInlineEnd: 0px;
12936
- --pf-v6-c-popover__content--PaddingBlockEnd: 0px;
12937
- --pf-v6-c-popover__content--PaddingInlineStart: 0px;
12938
- }
12939
-
12940
- .pf-v6-c-popover.pf-m-width-auto {
12941
- --pf-v6-c-popover--MinWidth: auto;
12942
- --pf-v6-c-popover--MaxWidth: none;
12943
- }
12944
-
12945
- .pf-v6-c-popover:is(.pf-m-top,
12946
- .pf-m-top-left,
12947
- .pf-m-top-right) {
12948
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover--m-top--InsetBlockEnd, 0);
12949
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-top--InsetInlineStart, 50%);
12950
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-top--TranslateX);
12951
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
12952
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-top--Rotate);
12953
- }
12954
-
12955
- .pf-v6-c-popover:is(.pf-m-bottom,
12956
- .pf-m-bottom-left,
12957
- .pf-m-bottom-right) {
12958
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-bottom--InsetBlockStart, 0);
12959
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-bottom--InsetInlineStart, 50%);
12960
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-bottom--TranslateX);
12961
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-bottom--TranslateY);
12962
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-bottom--Rotate);
12963
- }
12964
-
12965
- .pf-v6-c-popover:is(.pf-m-left,
12966
- .pf-m-left-top,
12967
- .pf-m-left-bottom) {
12968
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-left--InsetBlockStart, 50%);
12969
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover--m-left--InsetInlineEnd, 0);
12970
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
12971
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-left--TranslateY);
12972
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-left--Rotate);
12973
- }
12974
-
12975
- .pf-v6-c-popover:is(.pf-m-right,
12976
- .pf-m-right-top,
12977
- .pf-m-right-bottom) {
12978
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover--m-right--InsetBlockStart, 50%);
12979
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover--m-right--InsetInlineStart, 0);
12980
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-right--TranslateX);
12981
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-right--TranslateY);
12982
- --pf-v6-c-popover__arrow--Rotate: var(--pf-v6-c-popover__arrow--m-right--Rotate);
12983
- }
12984
-
12985
- .pf-v6-c-popover:is(.pf-m-left-top,
12986
- .pf-m-right-top) {
12987
- --pf-v6-c-popover__arrow--InsetBlockStart: var(--pf-v6-c-popover__arrow--m-inline-top--InsetBlockStart);
12988
- --pf-v6-c-popover__arrow--TranslateY: var(--pf-v6-c-popover__arrow--m-top--TranslateY);
12989
- }
12990
-
12991
- .pf-v6-c-popover:is(.pf-m-left-bottom,
12992
- .pf-m-right-bottom) {
12993
- --pf-v6-c-popover__arrow--InsetBlockStart: auto;
12994
- --pf-v6-c-popover__arrow--InsetBlockEnd: var(--pf-v6-c-popover__arrow--m-inline-bottom--InsetBlockEnd);
12995
- }
12996
-
12997
- .pf-v6-c-popover:is(.pf-m-top-left,
12998
- .pf-m-bottom-left) {
12999
- --pf-v6-c-popover__arrow--InsetInlineStart: var(--pf-v6-c-popover__arrow--m-block-left--InsetInlineStart);
13000
- --pf-v6-c-popover__arrow--TranslateX: var(--pf-v6-c-popover__arrow--m-left--TranslateX);
13001
- }
13002
-
13003
- .pf-v6-c-popover:is(.pf-m-top-right,
13004
- .pf-m-bottom-right) {
13005
- --pf-v6-c-popover__arrow--InsetInlineEnd: var(--pf-v6-c-popover__arrow--m-block-right--InsetInlineEnd);
13006
- --pf-v6-c-popover__arrow--InsetInlineStart: auto;
13007
- }
13008
-
13009
- .pf-v6-c-popover.pf-m-danger {
13010
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-danger__title-icon--Color);
13011
- }
13012
-
13013
- .pf-v6-c-popover.pf-m-warning {
13014
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-warning__title-icon--Color);
13015
- }
13016
-
13017
- .pf-v6-c-popover.pf-m-success {
13018
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-success__title-icon--Color);
13019
- }
13020
-
13021
- .pf-v6-c-popover.pf-m-custom {
13022
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-custom__title-icon--Color);
13092
+ :where(:root, .pf-v6-c-radio) {
13093
+ --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
13094
+ --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
13095
+ --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
13096
+ --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
13097
+ --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
13098
+ --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body);
13099
+ --pf-v6-c-radio__label--FontSize: var(--pf-t--global--font--size--body--default);
13100
+ --pf-v6-c-radio__label--LineHeight: var(--pf-t--global--font--line-height--body);
13101
+ --pf-v6-c-radio__description--FontSize: var(--pf-t--global--font--size--body--sm);
13102
+ --pf-v6-c-radio__description--Color: var(--pf-t--global--text--color--subtle);
13103
+ --pf-v6-c-radio__input--first-child--MarginInlineStart: 0.0625rem;
13104
+ --pf-v6-c-radio__input--last-child--MarginInlineEnd: 0.0625rem;
13105
+ --pf-v6-c-radio__body--MarginBlockStart: var(--pf-t--global--spacer--sm);
13106
+ --pf-v6-c-radio__input--TranslateY: calc((var(--pf-v6-c-radio__label--LineHeight) * var(--pf-v6-c-radio__label--FontSize) / 2 ) - 50%);
13023
13107
  }
13024
13108
 
13025
- .pf-v6-c-popover.pf-m-info {
13026
- --pf-v6-c-popover__title-icon--Color: var(--pf-v6-c-popover--m-info__title-icon--Color);
13109
+ .pf-v6-c-radio {
13110
+ display: grid;
13111
+ grid-template-columns: auto 1fr;
13112
+ grid-gap: var(--pf-v6-c-radio--GridGap);
13113
+ align-items: baseline;
13114
+ accent-color: var(--pf-v6-c-radio--AccentColor);
13027
13115
  }
13028
13116
 
13029
- .pf-v6-c-popover__content {
13030
- position: relative;
13031
- padding-block-start: var(--pf-v6-c-popover__content--PaddingBlockStart);
13032
- padding-block-end: var(--pf-v6-c-popover__content--PaddingBlockEnd);
13033
- padding-inline-start: var(--pf-v6-c-popover__content--PaddingInlineStart);
13034
- padding-inline-end: var(--pf-v6-c-popover__content--PaddingInlineEnd);
13035
- background-color: var(--pf-v6-c-popover__content--BackgroundColor);
13036
- border-radius: var(--pf-v6-c-popover__content--BorderRadius);
13117
+ .pf-v6-c-radio.pf-m-standalone {
13118
+ display: inline-grid;
13119
+ grid-template-columns: auto;
13120
+ height: var(--pf-v6-c-check--Height);
13037
13121
  }
13038
13122
 
13039
- .pf-v6-c-popover__close {
13040
- position: absolute;
13041
- inset-block-start: var(--pf-v6-c-popover__close--InsetBlockStart);
13042
- inset-inline-end: var(--pf-v6-c-popover__close--InsetInlineEnd);
13123
+ .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
13124
+ align-self: center;
13125
+ transform: none;
13043
13126
  }
13044
13127
 
13045
- .pf-v6-c-popover__close + * {
13046
- padding-inline-end: var(--pf-v6-c-popover__close--sibling--PaddingInlineEnd);
13128
+ .pf-v6-c-radio__input {
13129
+ align-self: start;
13130
+ font-size: var(--pf-v6-c-radio__label--FontSize);
13131
+ line-height: var(--pf-v6-c-radio__label--LineHeight);
13132
+ transform: translateY(var(--pf-v6-c-radio__input--TranslateY));
13047
13133
  }
13048
13134
 
13049
- .pf-v6-c-popover__arrow {
13050
- position: absolute;
13051
- top: var(--pf-v6-c-popover__arrow--InsetBlockStart, auto);
13052
- right: var(--pf-v6-c-popover__arrow--InsetInlineEnd, auto);
13053
- bottom: var(--pf-v6-c-popover__arrow--InsetBlockEnd, auto);
13054
- left: var(--pf-v6-c-popover__arrow--InsetInlineStart, auto);
13055
- width: var(--pf-v6-c-popover__arrow--Width);
13056
- height: var(--pf-v6-c-popover__arrow--Height);
13057
- pointer-events: none;
13058
- background-color: var(--pf-v6-c-popover__arrow--BackgroundColor);
13059
- box-shadow: var(--pf-v6-c-popover__arrow--BoxShadow);
13060
- transform: translateX(var(--pf-v6-c-popover__arrow--TranslateX, 0)) translateY(var(--pf-v6-c-popover__arrow--TranslateY, 0)) rotate(var(--pf-v6-c-popover__arrow--Rotate, 0));
13135
+ .pf-v6-c-radio__input:first-child {
13136
+ margin-inline-start: var(--pf-v6-c-radio__input--first-child--MarginInlineStart);
13061
13137
  }
13062
13138
 
13063
- .pf-v6-c-popover__header {
13064
- margin-block-end: var(--pf-v6-c-popover__header--MarginBlockEnd);
13139
+ .pf-v6-c-radio__input:last-child {
13140
+ margin-inline-end: var(--pf-v6-c-radio__input--last-child--MarginInlineEnd);
13065
13141
  }
13066
13142
 
13067
- .pf-v6-c-popover__title {
13068
- display: flex;
13069
- flex: 0 0 auto;
13143
+ .pf-v6-c-radio__label {
13144
+ font-size: var(--pf-v6-c-radio__label--FontSize);
13145
+ font-weight: var(--pf-v6-c-radio__label--FontWeight);
13146
+ line-height: var(--pf-v6-c-radio__label--LineHeight);
13147
+ color: var(--pf-v6-c-radio__label--Color);
13070
13148
  }
13071
13149
 
13072
- .pf-v6-c-popover__title-icon {
13073
- margin-inline-end: var(--pf-v6-c-popover__title-icon--MarginInlineEnd);
13074
- font-size: var(--pf-v6-c-popover__title-icon--FontSize);
13075
- color: var(--pf-v6-c-popover__title-icon--Color);
13150
+ .pf-v6-c-radio__description {
13151
+ grid-column: 2;
13152
+ font-size: var(--pf-v6-c-radio__description--FontSize);
13153
+ color: var(--pf-v6-c-radio__description--Color);
13076
13154
  }
13077
13155
 
13078
- .pf-v6-c-popover__title-text {
13079
- font-size: var(--pf-v6-c-popover__title-text--FontSize);
13080
- font-weight: var(--pf-v6-c-popover__title-text--FontWeight);
13081
- color: var(--pf-v6-c-popover__title-text--Color);
13156
+ .pf-v6-c-radio__body {
13157
+ grid-column: 2;
13158
+ margin-block-start: var(--pf-v6-c-radio__body--MarginBlockStart);
13082
13159
  }
13083
13160
 
13084
- .pf-v6-c-popover__body {
13085
- word-wrap: break-word;
13161
+ .pf-v6-c-radio__label,
13162
+ .pf-v6-c-radio__input {
13163
+ justify-self: start;
13086
13164
  }
13087
13165
 
13088
- .pf-v6-c-popover__footer {
13089
- margin-block-start: var(--pf-v6-c-popover__footer--MarginBlockStart);
13166
+ label.pf-v6-c-radio, .pf-v6-c-radio__label,
13167
+ .pf-v6-c-radio__input {
13168
+ cursor: pointer;
13169
+ }
13170
+
13171
+ .pf-v6-c-radio__label:disabled, .pf-v6-c-radio__label.pf-m-disabled,
13172
+ .pf-v6-c-radio__input:disabled,
13173
+ .pf-v6-c-radio__input.pf-m-disabled {
13174
+ --pf-v6-c-radio__label--Color: var(--pf-v6-c-radio__label--disabled--Color);
13175
+ cursor: not-allowed;
13090
13176
  }
13091
13177
 
13092
13178
  :where(:root, .pf-v6-c-progress-stepper) {
@@ -13724,92 +13810,6 @@ ul.pf-v6-c-list {
13724
13810
  --pf-v6-c-progress-stepper--m-center__step-main--before--Content: "";
13725
13811
  }
13726
13812
  }
13727
- :where(:root, .pf-v6-c-radio) {
13728
- --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
13729
- --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
13730
- --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
13731
- --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
13732
- --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
13733
- --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body);
13734
- --pf-v6-c-radio__label--FontSize: var(--pf-t--global--font--size--body--default);
13735
- --pf-v6-c-radio__label--LineHeight: var(--pf-t--global--font--line-height--body);
13736
- --pf-v6-c-radio__description--FontSize: var(--pf-t--global--font--size--body--sm);
13737
- --pf-v6-c-radio__description--Color: var(--pf-t--global--text--color--subtle);
13738
- --pf-v6-c-radio__input--first-child--MarginInlineStart: 0.0625rem;
13739
- --pf-v6-c-radio__input--last-child--MarginInlineEnd: 0.0625rem;
13740
- --pf-v6-c-radio__body--MarginBlockStart: var(--pf-t--global--spacer--sm);
13741
- --pf-v6-c-radio__input--TranslateY: calc((var(--pf-v6-c-radio__label--LineHeight) * var(--pf-v6-c-radio__label--FontSize) / 2 ) - 50%);
13742
- }
13743
-
13744
- .pf-v6-c-radio {
13745
- display: grid;
13746
- grid-template-columns: auto 1fr;
13747
- grid-gap: var(--pf-v6-c-radio--GridGap);
13748
- align-items: baseline;
13749
- accent-color: var(--pf-v6-c-radio--AccentColor);
13750
- }
13751
-
13752
- .pf-v6-c-radio.pf-m-standalone {
13753
- display: inline-grid;
13754
- grid-template-columns: auto;
13755
- height: var(--pf-v6-c-check--Height);
13756
- }
13757
-
13758
- .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
13759
- align-self: center;
13760
- transform: none;
13761
- }
13762
-
13763
- .pf-v6-c-radio__input {
13764
- align-self: start;
13765
- font-size: var(--pf-v6-c-radio__label--FontSize);
13766
- line-height: var(--pf-v6-c-radio__label--LineHeight);
13767
- transform: translateY(var(--pf-v6-c-radio__input--TranslateY));
13768
- }
13769
-
13770
- .pf-v6-c-radio__input:first-child {
13771
- margin-inline-start: var(--pf-v6-c-radio__input--first-child--MarginInlineStart);
13772
- }
13773
-
13774
- .pf-v6-c-radio__input:last-child {
13775
- margin-inline-end: var(--pf-v6-c-radio__input--last-child--MarginInlineEnd);
13776
- }
13777
-
13778
- .pf-v6-c-radio__label {
13779
- font-size: var(--pf-v6-c-radio__label--FontSize);
13780
- font-weight: var(--pf-v6-c-radio__label--FontWeight);
13781
- line-height: var(--pf-v6-c-radio__label--LineHeight);
13782
- color: var(--pf-v6-c-radio__label--Color);
13783
- }
13784
-
13785
- .pf-v6-c-radio__description {
13786
- grid-column: 2;
13787
- font-size: var(--pf-v6-c-radio__description--FontSize);
13788
- color: var(--pf-v6-c-radio__description--Color);
13789
- }
13790
-
13791
- .pf-v6-c-radio__body {
13792
- grid-column: 2;
13793
- margin-block-start: var(--pf-v6-c-radio__body--MarginBlockStart);
13794
- }
13795
-
13796
- .pf-v6-c-radio__label,
13797
- .pf-v6-c-radio__input {
13798
- justify-self: start;
13799
- }
13800
-
13801
- label.pf-v6-c-radio, .pf-v6-c-radio__label,
13802
- .pf-v6-c-radio__input {
13803
- cursor: pointer;
13804
- }
13805
-
13806
- .pf-v6-c-radio__label:disabled, .pf-v6-c-radio__label.pf-m-disabled,
13807
- .pf-v6-c-radio__input:disabled,
13808
- .pf-v6-c-radio__input.pf-m-disabled {
13809
- --pf-v6-c-radio__label--Color: var(--pf-v6-c-radio__label--disabled--Color);
13810
- cursor: not-allowed;
13811
- }
13812
-
13813
13813
  :where(:root, .pf-v6-c-text-input-group) {
13814
13814
  --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
13815
13815
  --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
@@ -19633,54 +19633,6 @@ label.pf-v6-c-tree-view__node-text {
19633
19633
  --pf-v6-c-alert-group__overflow-button--BoxShadow: var(--pf-v6-c-alert-group__overflow-button--active--BoxShadow);
19634
19634
  }
19635
19635
 
19636
- :where(:root, .pf-v6-c-truncate) {
19637
- --pf-v6-c-truncate--MinWidth: 6ch;
19638
- --pf-v6-c-truncate__start--MinWidth: 6ch;
19639
- }
19640
-
19641
- .pf-v6-c-truncate {
19642
- display: inline-grid;
19643
- grid-auto-flow: column;
19644
- align-items: baseline;
19645
- min-width: var(--pf-v6-c-truncate--MinWidth);
19646
- }
19647
-
19648
- .pf-v6-c-truncate__start,
19649
- .pf-v6-c-truncate__end {
19650
- overflow: hidden;
19651
- text-overflow: ellipsis;
19652
- white-space: pre;
19653
- }
19654
-
19655
- .pf-v6-c-truncate__start {
19656
- min-width: var(--pf-v6-c-truncate__start--MinWidth);
19657
- }
19658
-
19659
- .pf-v6-c-truncate__end {
19660
- direction: rtl;
19661
- }
19662
-
19663
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-truncate__end {
19664
- direction: ltr;
19665
- }
19666
-
19667
- .pf-v6-c-truncate__start + .pf-v6-c-truncate__end {
19668
- overflow: visible;
19669
- direction: ltr;
19670
- }
19671
-
19672
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-truncate__start + .pf-v6-c-truncate__end {
19673
- direction: rtl;
19674
- }
19675
-
19676
- @supports (-webkit-hyphens: none) {
19677
- .pf-v6-c-truncate__end {
19678
- direction: ltr;
19679
- }
19680
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-truncate__end {
19681
- direction: rtl;
19682
- }
19683
- }
19684
19636
  :where(:root, .pf-v6-c-panel) {
19685
19637
  --pf-v6-c-panel--Width: auto;
19686
19638
  --pf-v6-c-panel--MinWidth: auto;
@@ -19783,6 +19735,54 @@ label.pf-v6-c-tree-view__node-text {
19783
19735
  box-shadow: var(--pf-v6-c-panel__footer--BoxShadow);
19784
19736
  }
19785
19737
 
19738
+ :where(:root, .pf-v6-c-truncate) {
19739
+ --pf-v6-c-truncate--MinWidth: 6ch;
19740
+ --pf-v6-c-truncate__start--MinWidth: 6ch;
19741
+ }
19742
+
19743
+ .pf-v6-c-truncate {
19744
+ display: inline-grid;
19745
+ grid-auto-flow: column;
19746
+ align-items: baseline;
19747
+ min-width: var(--pf-v6-c-truncate--MinWidth);
19748
+ }
19749
+
19750
+ .pf-v6-c-truncate__start,
19751
+ .pf-v6-c-truncate__end {
19752
+ overflow: hidden;
19753
+ text-overflow: ellipsis;
19754
+ white-space: pre;
19755
+ }
19756
+
19757
+ .pf-v6-c-truncate__start {
19758
+ min-width: var(--pf-v6-c-truncate__start--MinWidth);
19759
+ }
19760
+
19761
+ .pf-v6-c-truncate__end {
19762
+ direction: rtl;
19763
+ }
19764
+
19765
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-truncate__end {
19766
+ direction: ltr;
19767
+ }
19768
+
19769
+ .pf-v6-c-truncate__start + .pf-v6-c-truncate__end {
19770
+ overflow: visible;
19771
+ direction: ltr;
19772
+ }
19773
+
19774
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-truncate__start + .pf-v6-c-truncate__end {
19775
+ direction: rtl;
19776
+ }
19777
+
19778
+ @supports (-webkit-hyphens: none) {
19779
+ .pf-v6-c-truncate__end {
19780
+ direction: ltr;
19781
+ }
19782
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-truncate__end {
19783
+ direction: rtl;
19784
+ }
19785
+ }
19786
19786
  :where(:root, .pf-v6-l-bullseye) {
19787
19787
  --pf-v6-l-bullseye--Padding: 0;
19788
19788
  }