@patternfly/react-core 4.263.0 → 4.264.1

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 (100) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/dist/esm/components/Tabs/Tab.d.ts +4 -2
  3. package/dist/esm/components/Tabs/Tab.d.ts.map +1 -1
  4. package/dist/esm/components/Tabs/Tab.js +6 -7
  5. package/dist/esm/components/Tabs/Tab.js.map +1 -1
  6. package/dist/esm/components/Tabs/TabAction.d.ts +20 -0
  7. package/dist/esm/components/Tabs/TabAction.d.ts.map +1 -0
  8. package/dist/esm/components/Tabs/TabAction.js +17 -0
  9. package/dist/esm/components/Tabs/TabAction.js.map +1 -0
  10. package/dist/esm/components/Tabs/Tabs.d.ts +1 -1
  11. package/dist/esm/components/Tabs/Tabs.d.ts.map +1 -1
  12. package/dist/esm/components/Tabs/index.d.ts +1 -0
  13. package/dist/esm/components/Tabs/index.d.ts.map +1 -1
  14. package/dist/esm/components/Tabs/index.js +1 -0
  15. package/dist/esm/components/Tabs/index.js.map +1 -1
  16. package/dist/js/components/Tabs/Tab.d.ts +4 -2
  17. package/dist/js/components/Tabs/Tab.d.ts.map +1 -1
  18. package/dist/js/components/Tabs/Tab.js +6 -7
  19. package/dist/js/components/Tabs/Tab.js.map +1 -1
  20. package/dist/js/components/Tabs/TabAction.d.ts +20 -0
  21. package/dist/js/components/Tabs/TabAction.d.ts.map +1 -0
  22. package/dist/js/components/Tabs/TabAction.js +20 -0
  23. package/dist/js/components/Tabs/TabAction.js.map +1 -0
  24. package/dist/js/components/Tabs/Tabs.d.ts +1 -1
  25. package/dist/js/components/Tabs/Tabs.d.ts.map +1 -1
  26. package/dist/js/components/Tabs/index.d.ts +1 -0
  27. package/dist/js/components/Tabs/index.d.ts.map +1 -1
  28. package/dist/js/components/Tabs/index.js +1 -0
  29. package/dist/js/components/Tabs/index.js.map +1 -1
  30. package/dist/styles/assets/pficon/pficon.scss +12 -0
  31. package/dist/styles/assets/pficon/pficon.woff +0 -0
  32. package/dist/styles/assets/pficon/pficon.woff2 +0 -0
  33. package/dist/styles/base-no-reset.css +10 -0
  34. package/dist/styles/base.css +10 -0
  35. package/dist/umd/react-core.min.css +1063 -894
  36. package/dist/umd/react-core.min.js +1 -1
  37. package/package.json +14 -7
  38. package/src/components/Tabs/Tab.tsx +17 -16
  39. package/src/components/Tabs/TabAction.tsx +57 -0
  40. package/src/components/Tabs/Tabs.tsx +1 -1
  41. package/src/components/Tabs/__tests__/Tab.test.tsx +10 -0
  42. package/src/components/Tabs/__tests__/__snapshots__/Tab.test.tsx.snap +45 -0
  43. package/src/components/Tabs/examples/Tabs.md +64 -20
  44. package/src/components/Tabs/examples/TabsHelp.tsx +61 -0
  45. package/src/components/Tabs/examples/TabsHelpAndClose.tsx +84 -0
  46. package/src/components/Tabs/index.ts +1 -0
  47. package/src/components/Tooltip/examples/Tooltip.md +5 -285
  48. package/src/components/Tooltip/examples/TooltipBasic.tsx +16 -0
  49. package/src/components/Tooltip/examples/TooltipIcon.tsx +24 -0
  50. package/src/components/Tooltip/examples/TooltipOptions.tsx +197 -0
  51. package/src/components/Tooltip/examples/TooltipReactRef.tsx +22 -0
  52. package/src/components/Tooltip/examples/TooltipSelectorRef.tsx +19 -0
  53. package/src/demos/Tabs.md +0 -10
  54. package/src/demos/examples/DashboardWrapper.js +1 -0
  55. package/src/demos/examples/Tabs/ModalTabs.tsx +3 -3
  56. package/src/demos/examples/Tabs/NestedTabs.tsx +11 -3
  57. package/src/demos/examples/Tabs/NestedUnindentedTabs.tsx +25 -40
  58. package/src/demos/examples/Tabs/TabsAndTable.tsx +9 -52
  59. package/dist/esm/components/Button/__mocks__/Button.d.ts +0 -8
  60. package/dist/esm/components/Button/__mocks__/Button.d.ts.map +0 -1
  61. package/dist/esm/components/Button/__mocks__/Button.js +0 -14
  62. package/dist/esm/components/Button/__mocks__/Button.js.map +0 -1
  63. package/dist/esm/components/Button/__mocks__/index.d.ts +0 -2
  64. package/dist/esm/components/Button/__mocks__/index.d.ts.map +0 -1
  65. package/dist/esm/components/Button/__mocks__/index.js +0 -2
  66. package/dist/esm/components/Button/__mocks__/index.js.map +0 -1
  67. package/dist/esm/components/HelperText/__mocks__/HelperText.d.ts +0 -4
  68. package/dist/esm/components/HelperText/__mocks__/HelperText.d.ts.map +0 -1
  69. package/dist/esm/components/HelperText/__mocks__/HelperText.js +0 -5
  70. package/dist/esm/components/HelperText/__mocks__/HelperText.js.map +0 -1
  71. package/dist/esm/components/HelperText/__mocks__/HelperTextItem.d.ts +0 -4
  72. package/dist/esm/components/HelperText/__mocks__/HelperTextItem.d.ts.map +0 -1
  73. package/dist/esm/components/HelperText/__mocks__/HelperTextItem.js +0 -5
  74. package/dist/esm/components/HelperText/__mocks__/HelperTextItem.js.map +0 -1
  75. package/dist/esm/components/HelperText/__mocks__/index.d.ts +0 -3
  76. package/dist/esm/components/HelperText/__mocks__/index.d.ts.map +0 -1
  77. package/dist/esm/components/HelperText/__mocks__/index.js +0 -3
  78. package/dist/esm/components/HelperText/__mocks__/index.js.map +0 -1
  79. package/dist/js/components/Button/__mocks__/Button.d.ts +0 -8
  80. package/dist/js/components/Button/__mocks__/Button.d.ts.map +0 -1
  81. package/dist/js/components/Button/__mocks__/Button.js +0 -18
  82. package/dist/js/components/Button/__mocks__/Button.js.map +0 -1
  83. package/dist/js/components/Button/__mocks__/index.d.ts +0 -2
  84. package/dist/js/components/Button/__mocks__/index.d.ts.map +0 -1
  85. package/dist/js/components/Button/__mocks__/index.js +0 -5
  86. package/dist/js/components/Button/__mocks__/index.js.map +0 -1
  87. package/dist/js/components/HelperText/__mocks__/HelperText.d.ts +0 -4
  88. package/dist/js/components/HelperText/__mocks__/HelperText.d.ts.map +0 -1
  89. package/dist/js/components/HelperText/__mocks__/HelperText.js +0 -10
  90. package/dist/js/components/HelperText/__mocks__/HelperText.js.map +0 -1
  91. package/dist/js/components/HelperText/__mocks__/HelperTextItem.d.ts +0 -4
  92. package/dist/js/components/HelperText/__mocks__/HelperTextItem.d.ts.map +0 -1
  93. package/dist/js/components/HelperText/__mocks__/HelperTextItem.js +0 -10
  94. package/dist/js/components/HelperText/__mocks__/HelperTextItem.js.map +0 -1
  95. package/dist/js/components/HelperText/__mocks__/index.d.ts +0 -3
  96. package/dist/js/components/HelperText/__mocks__/index.d.ts.map +0 -1
  97. package/dist/js/components/HelperText/__mocks__/index.js +0 -6
  98. package/dist/js/components/HelperText/__mocks__/index.js.map +0 -1
  99. package/src/demos/examples/Tabs/GrayTabs.tsx +0 -152
  100. package/src/demos/examples/Tabs/TabsAndTablesAutoWidthTabs.tsx +0 -442
@@ -297,238 +297,6 @@
297
297
  --pf-c-action-list--child--spacer: var(--pf-c-action-list--m-icon--spacer);
298
298
  }
299
299
 
300
- .pf-c-alert {
301
- --pf-global--Color--100: var(--pf-global--Color--dark-100);
302
- --pf-global--Color--200: var(--pf-global--Color--dark-200);
303
- --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
304
- --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
305
- --pf-global--link--Color: var(--pf-global--link--Color--dark);
306
- --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
307
- --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
308
- }
309
-
310
- .pf-c-alert {
311
- --pf-c-alert--BoxShadow: var(--pf-global--BoxShadow--lg);
312
- --pf-c-alert--BackgroundColor: var(--pf-global--BackgroundColor--100);
313
- --pf-c-alert--GridTemplateColumns: max-content 1fr max-content;
314
- --pf-c-alert--GridTemplateAreas:
315
- "icon title action"
316
- ". description description"
317
- ". actiongroup actiongroup";
318
- --pf-c-alert--BorderTopWidth: var(--pf-global--BorderWidth--md);
319
- --pf-c-alert--BorderTopColor: var(--pf-global--default-color--200);
320
- --pf-c-alert--PaddingTop: var(--pf-global--spacer--md);
321
- --pf-c-alert--PaddingRight: var(--pf-global--spacer--md);
322
- --pf-c-alert--PaddingBottom: var(--pf-global--spacer--md);
323
- --pf-c-alert--PaddingLeft: var(--pf-global--spacer--md);
324
- --pf-c-alert__FontSize: var(--pf-global--FontSize--sm);
325
- --pf-c-alert__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element) - 0.0625rem);
326
- --pf-c-alert__toggle--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
327
- --pf-c-alert__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
328
- --pf-c-alert__toggle-icon--Rotate: 0;
329
- --pf-c-alert__toggle-icon--Transition: var(--pf-global--Transition);
330
- --pf-c-alert__icon--Color: var(--pf-global--default-color--200);
331
- --pf-c-alert__icon--MarginTop: 0.0625rem;
332
- --pf-c-alert__icon--MarginRight: var(--pf-global--spacer--sm);
333
- --pf-c-alert__icon--FontSize: var(--pf-global--icon--FontSize--md);
334
- --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--bold);
335
- --pf-c-alert__title--Color: var(--pf-global--default-color--300);
336
- --pf-c-alert__title--max-lines: 1;
337
- --pf-c-alert__action--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
338
- --pf-c-alert__action--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
339
- --pf-c-alert__action--TranslateY: 0.125rem;
340
- --pf-c-alert__action--MarginRight: calc(var(--pf-global--spacer--sm) * -1);
341
- --pf-c-alert__description--PaddingTop: var(--pf-global--spacer--xs);
342
- --pf-c-alert__action-group--PaddingTop-base: var(--pf-global--spacer--xs);
343
- --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
344
- --pf-c-alert__description--action-group--PaddingTop-base: var(--pf-global--spacer--md);
345
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
346
- --pf-c-alert__action-group__c-button--not-last-child--MarginRight: var(--pf-global--spacer--lg);
347
- --pf-c-alert--m-success--BorderTopColor: var(--pf-global--success-color--100);
348
- --pf-c-alert--m-success__icon--Color: var(--pf-global--success-color--100);
349
- --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--200);
350
- --pf-c-alert--m-danger--BorderTopColor: var(--pf-global--danger-color--100);
351
- --pf-c-alert--m-danger__icon--Color: var(--pf-global--danger-color--100);
352
- --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--200);
353
- --pf-c-alert--m-warning--BorderTopColor: var(--pf-global--warning-color--100);
354
- --pf-c-alert--m-warning__icon--Color: var(--pf-global--warning-color--100);
355
- --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--200);
356
- --pf-c-alert--m-info--BorderTopColor: var(--pf-global--info-color--100);
357
- --pf-c-alert--m-info__icon--Color: var(--pf-global--info-color--100);
358
- --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--200);
359
- --pf-c-alert--m-inline--BoxShadow: none;
360
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--cyan-50);
361
- --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--green-50);
362
- --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--red-50);
363
- --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--gold-50);
364
- --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--blue-50);
365
- --pf-c-alert--m-inline--m-plain--BorderTopWidth: 0;
366
- --pf-c-alert--m-inline--m-plain--BackgroundColor: transparent;
367
- --pf-c-alert--m-inline--m-plain--PaddingTop: 0;
368
- --pf-c-alert--m-inline--m-plain--PaddingRight: 0;
369
- --pf-c-alert--m-inline--m-plain--PaddingBottom: 0;
370
- --pf-c-alert--m-inline--m-plain--PaddingLeft: 0;
371
- --pf-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content;
372
- --pf-c-alert--m-expandable--GridTemplateAreas:
373
- "toggle icon title action"
374
- ". . description description"
375
- ". . actiongroup actiongroup";
376
- --pf-c-alert--m-expandable__description--action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
377
- --pf-c-alert--m-expanded__toggle-icon--Rotate: 90deg;
378
- --pf-c-alert--m-expanded__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
379
- color: var(--pf-global--Color--100);
380
- position: relative;
381
- display: grid;
382
- padding: var(--pf-c-alert--PaddingTop) var(--pf-c-alert--PaddingRight) var(--pf-c-alert--PaddingBottom) var(--pf-c-alert--PaddingLeft);
383
- font-size: var(--pf-c-alert__FontSize);
384
- background-color: var(--pf-c-alert--BackgroundColor);
385
- border-top: var(--pf-c-alert--BorderTopWidth) solid var(--pf-c-alert--BorderTopColor);
386
- box-shadow: var(--pf-c-alert--BoxShadow);
387
- grid-template-columns: var(--pf-c-alert--GridTemplateColumns);
388
- grid-template-areas: var(--pf-c-alert--GridTemplateAreas);
389
- }
390
-
391
- .pf-c-alert.pf-m-success {
392
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-success--BorderTopColor);
393
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-success__icon--Color);
394
- --pf-c-alert__title--Color: var(--pf-c-alert--m-success__title--Color);
395
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-success--BackgroundColor);
396
- }
397
-
398
- .pf-c-alert.pf-m-danger {
399
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-danger--BorderTopColor);
400
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-danger__icon--Color);
401
- --pf-c-alert__title--Color: var(--pf-c-alert--m-danger__title--Color);
402
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-danger--BackgroundColor);
403
- }
404
-
405
- .pf-c-alert.pf-m-warning {
406
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-warning--BorderTopColor);
407
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-warning__icon--Color);
408
- --pf-c-alert__title--Color: var(--pf-c-alert--m-warning__title--Color);
409
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-warning--BackgroundColor);
410
- }
411
-
412
- .pf-c-alert.pf-m-info {
413
- --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-info--BorderTopColor);
414
- --pf-c-alert__icon--Color: var(--pf-c-alert--m-info__icon--Color);
415
- --pf-c-alert__title--Color: var(--pf-c-alert--m-info__title--Color);
416
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-info--BackgroundColor);
417
- }
418
-
419
- .pf-c-alert.pf-m-inline {
420
- --pf-c-alert--BoxShadow: var(--pf-c-alert--m-inline--BoxShadow);
421
- --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--BackgroundColor);
422
- }
423
-
424
- .pf-c-alert.pf-m-plain {
425
- --pf-c-alert--BorderTopWidth: var(--pf-c-alert--m-inline--m-plain--BorderTopWidth);
426
- --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--m-plain--BackgroundColor);
427
- --pf-c-alert--PaddingTop: var(--pf-c-alert--m-inline--m-plain--PaddingTop);
428
- --pf-c-alert--PaddingRight: var(--pf-c-alert--m-inline--m-plain--PaddingRight);
429
- --pf-c-alert--PaddingBottom: var(--pf-c-alert--m-inline--m-plain--PaddingBottom);
430
- --pf-c-alert--PaddingLeft: var(--pf-c-alert--m-inline--m-plain--PaddingLeft);
431
- }
432
-
433
- .pf-c-alert.pf-m-expandable {
434
- --pf-c-alert--GridTemplateColumns: var(--pf-c-alert--m-expandable--GridTemplateColumns);
435
- --pf-c-alert--GridTemplateAreas: var(--pf-c-alert--m-expandable--GridTemplateAreas);
436
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expandable__description--action-group--PaddingTop);
437
- }
438
-
439
- .pf-c-alert.pf-m-expanded {
440
- --pf-c-alert__toggle-icon--Rotate: var(--pf-c-alert--m-expanded__toggle-icon--Rotate);
441
- --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expanded__description--action-group--PaddingTop);
442
- }
443
-
444
- .pf-c-alert__toggle {
445
- margin-top: var(--pf-c-alert__toggle--MarginTop);
446
- margin-bottom: var(--pf-c-alert__toggle--MarginBottom);
447
- margin-left: var(--pf-c-alert__toggle--MarginLeft);
448
- }
449
-
450
- .pf-c-alert__toggle-icon {
451
- display: inline-block;
452
- transition: var(--pf-c-alert__toggle-icon--Transition);
453
- transform: rotate(var(--pf-c-alert__toggle-icon--Rotate));
454
- }
455
-
456
- .pf-c-alert__icon {
457
- grid-area: icon;
458
- display: flex;
459
- margin-top: var(--pf-c-alert__icon--MarginTop);
460
- margin-right: var(--pf-c-alert__icon--MarginRight);
461
- font-size: var(--pf-c-alert__icon--FontSize);
462
- color: var(--pf-c-alert__icon--Color);
463
- }
464
-
465
- .pf-c-alert__title {
466
- grid-area: title;
467
- font-weight: var(--pf-c-alert__title--FontWeight);
468
- color: var(--pf-c-alert__title--Color);
469
- word-break: break-word;
470
- }
471
-
472
- .pf-c-alert__title.pf-m-truncate {
473
- display: -webkit-box;
474
- -webkit-box-orient: vertical;
475
- -webkit-line-clamp: var(--pf-c-alert__title--max-lines);
476
- overflow: hidden;
477
- }
478
-
479
- .pf-c-alert__description {
480
- grid-area: description;
481
- padding-top: var(--pf-c-alert__description--PaddingTop);
482
- word-break: break-word;
483
- }
484
-
485
- .pf-c-alert__description + .pf-c-alert__action-group {
486
- --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop);
487
- }
488
-
489
- .pf-c-alert__action {
490
- grid-area: action;
491
- margin-top: var(--pf-c-alert__action--MarginTop);
492
- margin-right: var(--pf-c-alert__action--MarginRight);
493
- margin-bottom: var(--pf-c-alert__action--MarginBottom);
494
- transform: translateY(var(--pf-c-alert__action--TranslateY));
495
- }
496
-
497
- .pf-c-alert__action > .pf-c-button {
498
- --pf-c-button--LineHeight: 1;
499
- }
500
-
501
- .pf-c-alert__action-group {
502
- grid-area: actiongroup;
503
- padding-top: var(--pf-c-alert__action-group--PaddingTop);
504
- }
505
-
506
- .pf-c-alert__action-group > .pf-c-button {
507
- --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
508
- }
509
-
510
- .pf-c-alert__action-group > .pf-c-button:not(:last-child) {
511
- margin-right: var(--pf-c-alert__action-group__c-button--not-last-child--MarginRight);
512
- }
513
-
514
- .pf-m-overpass-font .pf-c-alert__title {
515
- --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--normal);
516
- }
517
-
518
- :where(.pf-theme-dark) .pf-c-alert {
519
- --pf-c-alert--BackgroundColor: var(--pf-global--palette--black-600);
520
- --pf-c-alert__title--Color: var(--pf-global--default-color--200);
521
- --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--100);
522
- --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--100);
523
- --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--100);
524
- --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--100);
525
- --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--black-600);
526
- --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--black-600);
527
- --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--black-600);
528
- --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--black-600);
529
- --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--black-600);
530
- }
531
-
532
300
  .pf-c-app-launcher {
533
301
  --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
534
302
  --pf-c-app-launcher__menu--BoxShadow: var(--pf-global--BoxShadow--md);
@@ -1160,22 +928,254 @@ textarea.pf-c-form-control {
1160
928
  color: var(--pf-global--palette--black-100);
1161
929
  }
1162
930
 
1163
- .pf-u-screen-reader {
1164
- position: fixed;
1165
- top: 0;
1166
- left: 0;
1167
- overflow: hidden;
1168
- clip: rect(0, 0, 0, 0);
1169
- white-space: nowrap;
1170
- border: 0;
1171
- }
1172
-
1173
- .pf-u-visible {
1174
- position: static;
1175
- overflow: visible;
1176
- clip: auto;
1177
- white-space: normal;
1178
- border: inherit;
931
+ .pf-c-alert {
932
+ --pf-global--Color--100: var(--pf-global--Color--dark-100);
933
+ --pf-global--Color--200: var(--pf-global--Color--dark-200);
934
+ --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
935
+ --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
936
+ --pf-global--link--Color: var(--pf-global--link--Color--dark);
937
+ --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
938
+ --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
939
+ }
940
+
941
+ .pf-c-alert {
942
+ --pf-c-alert--BoxShadow: var(--pf-global--BoxShadow--lg);
943
+ --pf-c-alert--BackgroundColor: var(--pf-global--BackgroundColor--100);
944
+ --pf-c-alert--GridTemplateColumns: max-content 1fr max-content;
945
+ --pf-c-alert--GridTemplateAreas:
946
+ "icon title action"
947
+ ". description description"
948
+ ". actiongroup actiongroup";
949
+ --pf-c-alert--BorderTopWidth: var(--pf-global--BorderWidth--md);
950
+ --pf-c-alert--BorderTopColor: var(--pf-global--default-color--200);
951
+ --pf-c-alert--PaddingTop: var(--pf-global--spacer--md);
952
+ --pf-c-alert--PaddingRight: var(--pf-global--spacer--md);
953
+ --pf-c-alert--PaddingBottom: var(--pf-global--spacer--md);
954
+ --pf-c-alert--PaddingLeft: var(--pf-global--spacer--md);
955
+ --pf-c-alert__FontSize: var(--pf-global--FontSize--sm);
956
+ --pf-c-alert__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element) - 0.0625rem);
957
+ --pf-c-alert__toggle--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
958
+ --pf-c-alert__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
959
+ --pf-c-alert__toggle-icon--Rotate: 0;
960
+ --pf-c-alert__toggle-icon--Transition: var(--pf-global--Transition);
961
+ --pf-c-alert__icon--Color: var(--pf-global--default-color--200);
962
+ --pf-c-alert__icon--MarginTop: 0.0625rem;
963
+ --pf-c-alert__icon--MarginRight: var(--pf-global--spacer--sm);
964
+ --pf-c-alert__icon--FontSize: var(--pf-global--icon--FontSize--md);
965
+ --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--bold);
966
+ --pf-c-alert__title--Color: var(--pf-global--default-color--300);
967
+ --pf-c-alert__title--max-lines: 1;
968
+ --pf-c-alert__action--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
969
+ --pf-c-alert__action--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
970
+ --pf-c-alert__action--TranslateY: 0.125rem;
971
+ --pf-c-alert__action--MarginRight: calc(var(--pf-global--spacer--sm) * -1);
972
+ --pf-c-alert__description--PaddingTop: var(--pf-global--spacer--xs);
973
+ --pf-c-alert__action-group--PaddingTop-base: var(--pf-global--spacer--xs);
974
+ --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
975
+ --pf-c-alert__description--action-group--PaddingTop-base: var(--pf-global--spacer--md);
976
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
977
+ --pf-c-alert__action-group__c-button--not-last-child--MarginRight: var(--pf-global--spacer--lg);
978
+ --pf-c-alert--m-success--BorderTopColor: var(--pf-global--success-color--100);
979
+ --pf-c-alert--m-success__icon--Color: var(--pf-global--success-color--100);
980
+ --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--200);
981
+ --pf-c-alert--m-danger--BorderTopColor: var(--pf-global--danger-color--100);
982
+ --pf-c-alert--m-danger__icon--Color: var(--pf-global--danger-color--100);
983
+ --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--200);
984
+ --pf-c-alert--m-warning--BorderTopColor: var(--pf-global--warning-color--100);
985
+ --pf-c-alert--m-warning__icon--Color: var(--pf-global--warning-color--100);
986
+ --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--200);
987
+ --pf-c-alert--m-info--BorderTopColor: var(--pf-global--info-color--100);
988
+ --pf-c-alert--m-info__icon--Color: var(--pf-global--info-color--100);
989
+ --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--200);
990
+ --pf-c-alert--m-inline--BoxShadow: none;
991
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--cyan-50);
992
+ --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--green-50);
993
+ --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--red-50);
994
+ --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--gold-50);
995
+ --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--blue-50);
996
+ --pf-c-alert--m-inline--m-plain--BorderTopWidth: 0;
997
+ --pf-c-alert--m-inline--m-plain--BackgroundColor: transparent;
998
+ --pf-c-alert--m-inline--m-plain--PaddingTop: 0;
999
+ --pf-c-alert--m-inline--m-plain--PaddingRight: 0;
1000
+ --pf-c-alert--m-inline--m-plain--PaddingBottom: 0;
1001
+ --pf-c-alert--m-inline--m-plain--PaddingLeft: 0;
1002
+ --pf-c-alert--m-expandable--GridTemplateColumns: auto max-content 1fr max-content;
1003
+ --pf-c-alert--m-expandable--GridTemplateAreas:
1004
+ "toggle icon title action"
1005
+ ". . description description"
1006
+ ". . actiongroup actiongroup";
1007
+ --pf-c-alert--m-expandable__description--action-group--PaddingTop: var(--pf-c-alert__action-group--PaddingTop-base);
1008
+ --pf-c-alert--m-expanded__toggle-icon--Rotate: 90deg;
1009
+ --pf-c-alert--m-expanded__description--action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop-base);
1010
+ color: var(--pf-global--Color--100);
1011
+ position: relative;
1012
+ display: grid;
1013
+ padding: var(--pf-c-alert--PaddingTop) var(--pf-c-alert--PaddingRight) var(--pf-c-alert--PaddingBottom) var(--pf-c-alert--PaddingLeft);
1014
+ font-size: var(--pf-c-alert__FontSize);
1015
+ background-color: var(--pf-c-alert--BackgroundColor);
1016
+ border-top: var(--pf-c-alert--BorderTopWidth) solid var(--pf-c-alert--BorderTopColor);
1017
+ box-shadow: var(--pf-c-alert--BoxShadow);
1018
+ grid-template-columns: var(--pf-c-alert--GridTemplateColumns);
1019
+ grid-template-areas: var(--pf-c-alert--GridTemplateAreas);
1020
+ }
1021
+
1022
+ .pf-c-alert.pf-m-success {
1023
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-success--BorderTopColor);
1024
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-success__icon--Color);
1025
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-success__title--Color);
1026
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-success--BackgroundColor);
1027
+ }
1028
+
1029
+ .pf-c-alert.pf-m-danger {
1030
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-danger--BorderTopColor);
1031
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-danger__icon--Color);
1032
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-danger__title--Color);
1033
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-danger--BackgroundColor);
1034
+ }
1035
+
1036
+ .pf-c-alert.pf-m-warning {
1037
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-warning--BorderTopColor);
1038
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-warning__icon--Color);
1039
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-warning__title--Color);
1040
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-warning--BackgroundColor);
1041
+ }
1042
+
1043
+ .pf-c-alert.pf-m-info {
1044
+ --pf-c-alert--BorderTopColor: var(--pf-c-alert--m-info--BorderTopColor);
1045
+ --pf-c-alert__icon--Color: var(--pf-c-alert--m-info__icon--Color);
1046
+ --pf-c-alert__title--Color: var(--pf-c-alert--m-info__title--Color);
1047
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-c-alert--m-inline--m-info--BackgroundColor);
1048
+ }
1049
+
1050
+ .pf-c-alert.pf-m-inline {
1051
+ --pf-c-alert--BoxShadow: var(--pf-c-alert--m-inline--BoxShadow);
1052
+ --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--BackgroundColor);
1053
+ }
1054
+
1055
+ .pf-c-alert.pf-m-plain {
1056
+ --pf-c-alert--BorderTopWidth: var(--pf-c-alert--m-inline--m-plain--BorderTopWidth);
1057
+ --pf-c-alert--BackgroundColor: var(--pf-c-alert--m-inline--m-plain--BackgroundColor);
1058
+ --pf-c-alert--PaddingTop: var(--pf-c-alert--m-inline--m-plain--PaddingTop);
1059
+ --pf-c-alert--PaddingRight: var(--pf-c-alert--m-inline--m-plain--PaddingRight);
1060
+ --pf-c-alert--PaddingBottom: var(--pf-c-alert--m-inline--m-plain--PaddingBottom);
1061
+ --pf-c-alert--PaddingLeft: var(--pf-c-alert--m-inline--m-plain--PaddingLeft);
1062
+ }
1063
+
1064
+ .pf-c-alert.pf-m-expandable {
1065
+ --pf-c-alert--GridTemplateColumns: var(--pf-c-alert--m-expandable--GridTemplateColumns);
1066
+ --pf-c-alert--GridTemplateAreas: var(--pf-c-alert--m-expandable--GridTemplateAreas);
1067
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expandable__description--action-group--PaddingTop);
1068
+ }
1069
+
1070
+ .pf-c-alert.pf-m-expanded {
1071
+ --pf-c-alert__toggle-icon--Rotate: var(--pf-c-alert--m-expanded__toggle-icon--Rotate);
1072
+ --pf-c-alert__description--action-group--PaddingTop: var(--pf-c-alert--m-expanded__description--action-group--PaddingTop);
1073
+ }
1074
+
1075
+ .pf-c-alert__toggle {
1076
+ margin-top: var(--pf-c-alert__toggle--MarginTop);
1077
+ margin-bottom: var(--pf-c-alert__toggle--MarginBottom);
1078
+ margin-left: var(--pf-c-alert__toggle--MarginLeft);
1079
+ }
1080
+
1081
+ .pf-c-alert__toggle-icon {
1082
+ display: inline-block;
1083
+ transition: var(--pf-c-alert__toggle-icon--Transition);
1084
+ transform: rotate(var(--pf-c-alert__toggle-icon--Rotate));
1085
+ }
1086
+
1087
+ .pf-c-alert__icon {
1088
+ grid-area: icon;
1089
+ display: flex;
1090
+ margin-top: var(--pf-c-alert__icon--MarginTop);
1091
+ margin-right: var(--pf-c-alert__icon--MarginRight);
1092
+ font-size: var(--pf-c-alert__icon--FontSize);
1093
+ color: var(--pf-c-alert__icon--Color);
1094
+ }
1095
+
1096
+ .pf-c-alert__title {
1097
+ grid-area: title;
1098
+ font-weight: var(--pf-c-alert__title--FontWeight);
1099
+ color: var(--pf-c-alert__title--Color);
1100
+ word-break: break-word;
1101
+ }
1102
+
1103
+ .pf-c-alert__title.pf-m-truncate {
1104
+ display: -webkit-box;
1105
+ -webkit-box-orient: vertical;
1106
+ -webkit-line-clamp: var(--pf-c-alert__title--max-lines);
1107
+ overflow: hidden;
1108
+ }
1109
+
1110
+ .pf-c-alert__description {
1111
+ grid-area: description;
1112
+ padding-top: var(--pf-c-alert__description--PaddingTop);
1113
+ word-break: break-word;
1114
+ }
1115
+
1116
+ .pf-c-alert__description + .pf-c-alert__action-group {
1117
+ --pf-c-alert__action-group--PaddingTop: var(--pf-c-alert__description--action-group--PaddingTop);
1118
+ }
1119
+
1120
+ .pf-c-alert__action {
1121
+ grid-area: action;
1122
+ margin-top: var(--pf-c-alert__action--MarginTop);
1123
+ margin-right: var(--pf-c-alert__action--MarginRight);
1124
+ margin-bottom: var(--pf-c-alert__action--MarginBottom);
1125
+ transform: translateY(var(--pf-c-alert__action--TranslateY));
1126
+ }
1127
+
1128
+ .pf-c-alert__action > .pf-c-button {
1129
+ --pf-c-button--LineHeight: 1;
1130
+ }
1131
+
1132
+ .pf-c-alert__action-group {
1133
+ grid-area: actiongroup;
1134
+ padding-top: var(--pf-c-alert__action-group--PaddingTop);
1135
+ }
1136
+
1137
+ .pf-c-alert__action-group > .pf-c-button {
1138
+ --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
1139
+ }
1140
+
1141
+ .pf-c-alert__action-group > .pf-c-button:not(:last-child) {
1142
+ margin-right: var(--pf-c-alert__action-group__c-button--not-last-child--MarginRight);
1143
+ }
1144
+
1145
+ .pf-m-overpass-font .pf-c-alert__title {
1146
+ --pf-c-alert__title--FontWeight: var(--pf-global--FontWeight--normal);
1147
+ }
1148
+
1149
+ :where(.pf-theme-dark) .pf-c-alert {
1150
+ --pf-c-alert--BackgroundColor: var(--pf-global--palette--black-600);
1151
+ --pf-c-alert__title--Color: var(--pf-global--default-color--200);
1152
+ --pf-c-alert--m-success__title--Color: var(--pf-global--success-color--100);
1153
+ --pf-c-alert--m-danger__title--Color: var(--pf-global--danger-color--100);
1154
+ --pf-c-alert--m-warning__title--Color: var(--pf-global--warning-color--100);
1155
+ --pf-c-alert--m-info__title--Color: var(--pf-global--info-color--100);
1156
+ --pf-c-alert--m-inline--BackgroundColor: var(--pf-global--palette--black-600);
1157
+ --pf-c-alert--m-inline--m-success--BackgroundColor: var(--pf-global--palette--black-600);
1158
+ --pf-c-alert--m-inline--m-danger--BackgroundColor: var(--pf-global--palette--black-600);
1159
+ --pf-c-alert--m-inline--m-warning--BackgroundColor: var(--pf-global--palette--black-600);
1160
+ --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--black-600);
1161
+ }
1162
+
1163
+ .pf-u-screen-reader {
1164
+ position: fixed;
1165
+ top: 0;
1166
+ left: 0;
1167
+ overflow: hidden;
1168
+ clip: rect(0, 0, 0, 0);
1169
+ white-space: nowrap;
1170
+ border: 0;
1171
+ }
1172
+
1173
+ .pf-u-visible {
1174
+ position: static;
1175
+ overflow: visible;
1176
+ clip: auto;
1177
+ white-space: normal;
1178
+ border: inherit;
1179
1179
  }
1180
1180
 
1181
1181
  .pf-u-hidden {
@@ -7310,331 +7310,6 @@ label.pf-c-check, .pf-c-check__label,
7310
7310
  --pf-c-drawer__panel--BackgroundColor: var(--pf-global--BackgroundColor--100);
7311
7311
  }
7312
7312
 
7313
- .pf-c-dual-list-selector {
7314
- --pf-c-dual-list-selector__header--GridArea: pane-header;
7315
- --pf-c-dual-list-selector__tools--GridArea: pane-tools;
7316
- --pf-c-dual-list-selector__status--GridArea: pane-status;
7317
- --pf-c-dual-list-selector__menu--GridArea: pane-menu;
7318
- --pf-c-dual-list-selector__controls--GridArea: controls;
7319
- --pf-c-dual-list-selector--m-chosen__header--GridArea: pane-header-c;
7320
- --pf-c-dual-list-selector--m-chosen__tools--GridArea: pane-tools-c;
7321
- --pf-c-dual-list-selector--m-chosen__status--GridArea: pane-status-c;
7322
- --pf-c-dual-list-selector--m-chosen__menu--GridArea: pane-menu-c;
7323
- --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min: 12.5rem;
7324
- --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max: 28.125rem;
7325
- --pf-c-dual-list-selector__header--MarginBottom: var(--pf-global--spacer--sm);
7326
- --pf-c-dual-list-selector__title-text--FontWeight: var(--pf-global--FontWeight--bold);
7327
- --pf-c-dual-list-selector__tools--MarginBottom: var(--pf-global--spacer--md);
7328
- --pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft: var(--pf-global--spacer--sm);
7329
- --pf-c-dual-list-selector__menu--BorderWidth: var(--pf-global--BorderWidth--sm);
7330
- --pf-c-dual-list-selector__menu--BorderColor: var(--pf-global--BorderColor--100);
7331
- --pf-c-dual-list-selector__menu--MinHeight: 12.5rem;
7332
- --pf-c-dual-list-selector__menu--MaxHeight: 20rem;
7333
- --pf-c-dual-list-selector__list-item-row--FontSize: var(--pf-global--FontSize--sm);
7334
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: transparent;
7335
- --pf-c-dual-list-selector__list-item-row--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7336
- --pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7337
- --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
7338
- --pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor: var(--pf-global--BackgroundColor--100);
7339
- --pf-c-dual-list-selector__list-item--m-ghost-row--Opacity: .4;
7340
- --pf-c-dual-list-selector__item--PaddingTop: var(--pf-global--spacer--sm);
7341
- --pf-c-dual-list-selector__item--PaddingRight: var(--pf-global--spacer--md);
7342
- --pf-c-dual-list-selector__item--PaddingBottom: var(--pf-global--spacer--sm);
7343
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-global--spacer--md);
7344
- --pf-c-dual-list-selector__item--m-expandable--PaddingLeft: 0;
7345
- --pf-c-dual-list-selector__item--indent--base: calc(var(--pf-global--spacer--md) + var(--pf-global--spacer--sm) + var(--pf-c-dual-list-selector__list-item-row--FontSize));
7346
- --pf-c-dual-list-selector__item--nested-indent--base: calc(var(--pf-c-dual-list-selector__item--indent--base) - var(--pf-global--spacer--md));
7347
- --pf-c-dual-list-selector__draggable--item--PaddingLeft: var(--pf-global--spacer--xs);
7348
- --pf-c-dual-list-selector__item-text--Color: var(--pf-global--Color--100);
7349
- --pf-c-dual-list-selector__list-item-row--m-selected__text--Color: var(--pf-global--active-color--100);
7350
- --pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight: var(--pf-global--FontWeight--bold);
7351
- --pf-c-dual-list-selector__list-item--m-disabled__item-text--Color: var(--pf-global--disabled-color--100);
7352
- --pf-c-dual-list-selector__status--MarginBottom: var(--pf-global--spacer--sm);
7353
- --pf-c-dual-list-selector__status-text--FontSize: var(--pf-global--FontSize--sm);
7354
- --pf-c-dual-list-selector__status-text--Color: var(--pf-global--Color--200);
7355
- --pf-c-dual-list-selector__controls--PaddingRight: var(--pf-global--spacer--md);
7356
- --pf-c-dual-list-selector__controls--PaddingLeft: var(--pf-global--spacer--md);
7357
- --pf-c-dual-list-selector__item-toggle--PaddingTop: var(--pf-global--spacer--sm);
7358
- --pf-c-dual-list-selector__item-toggle--PaddingRight: var(--pf-global--spacer--sm);
7359
- --pf-c-dual-list-selector__item-toggle--PaddingBottom: var(--pf-global--spacer--sm);
7360
- --pf-c-dual-list-selector__item-toggle--PaddingLeft: var(--pf-global--spacer--md);
7361
- --pf-c-dual-list-selector__item-toggle--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
7362
- --pf-c-dual-list-selector__item-toggle--MarginBottom: calc(var(--pf-global--spacer--sm) * -1);
7363
- --pf-c-dual-list-selector__list__list__item-toggle--Left: 0;
7364
- --pf-c-dual-list-selector__list__list__item-toggle--TranslateX: -100%;
7365
- --pf-c-dual-list-selector__item-check--MarginRight: var(--pf-global--spacer--sm);
7366
- --pf-c-dual-list-selector__item-count--Marginleft: var(--pf-global--spacer--sm);
7367
- --pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
7368
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
7369
- --pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
7370
- --pf-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-global--Transition);
7371
- --pf-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-c-dual-list-selector__list-item-row--FontSize);
7372
- --pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-global--disabled-color--200);
7373
- display: grid;
7374
- grid-template-areas: "pane-header . pane-header-c" "pane-tools . pane-tools-c" "pane-status . pane-status-c" "pane-menu controls pane-menu-c";
7375
- grid-template-columns: minmax(var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min), var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max)) min-content minmax(var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min), var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max));
7376
- grid-template-rows: repeat(3, auto) auto;
7377
- }
7378
-
7379
- .pf-c-dual-list-selector__pane {
7380
- display: contents;
7381
- }
7382
-
7383
- .pf-c-dual-list-selector__pane.pf-m-chosen {
7384
- --pf-c-dual-list-selector__header--GridArea: var(--pf-c-dual-list-selector--m-chosen__header--GridArea);
7385
- --pf-c-dual-list-selector__tools--GridArea: var(--pf-c-dual-list-selector--m-chosen__tools--GridArea);
7386
- --pf-c-dual-list-selector__status--GridArea: var(--pf-c-dual-list-selector--m-chosen__status--GridArea);
7387
- --pf-c-dual-list-selector__menu--GridArea: var(--pf-c-dual-list-selector--m-chosen__menu--GridArea);
7388
- }
7389
-
7390
- .pf-c-dual-list-selector__header {
7391
- grid-area: var(--pf-c-dual-list-selector__header--GridArea);
7392
- margin-bottom: var(--pf-c-dual-list-selector__header--MarginBottom);
7393
- }
7394
-
7395
- .pf-c-dual-list-selector__title-text {
7396
- font-weight: var(--pf-c-dual-list-selector__title-text--FontWeight);
7397
- }
7398
-
7399
- .pf-c-dual-list-selector__tools {
7400
- display: flex;
7401
- grid-area: var(--pf-c-dual-list-selector__tools--GridArea);
7402
- margin-bottom: var(--pf-c-dual-list-selector__tools--MarginBottom);
7403
- }
7404
-
7405
- .pf-c-dual-list-selector__tools-filter {
7406
- flex-grow: 1;
7407
- }
7408
-
7409
- .pf-c-dual-list-selector__tools-actions {
7410
- display: flex;
7411
- }
7412
-
7413
- .pf-c-dual-list-selector__tools-filter ~ .pf-c-dual-list-selector__tools-actions {
7414
- margin-left: var(--pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft);
7415
- }
7416
-
7417
- .pf-c-dual-list-selector__status {
7418
- display: flex;
7419
- grid-area: var(--pf-c-dual-list-selector__status--GridArea);
7420
- margin-bottom: var(--pf-c-dual-list-selector__status--MarginBottom);
7421
- }
7422
-
7423
- .pf-c-dual-list-selector__status-text {
7424
- flex-grow: 1;
7425
- font-size: var(--pf-c-dual-list-selector__status-text--FontSize);
7426
- color: var(--pf-c-dual-list-selector__status-text--Color);
7427
- }
7428
-
7429
- .pf-c-dual-list-selector__menu {
7430
- grid-area: var(--pf-c-dual-list-selector__menu--GridArea);
7431
- min-height: var(--pf-c-dual-list-selector__menu--MinHeight);
7432
- max-height: var(--pf-c-dual-list-selector__menu--MaxHeight);
7433
- overflow: auto;
7434
- border: var(--pf-c-dual-list-selector__menu--BorderWidth) solid var(--pf-c-dual-list-selector__menu--BorderColor);
7435
- }
7436
-
7437
- .pf-c-dual-list-selector__list {
7438
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
7439
- display: flex;
7440
- flex-direction: column;
7441
- }
7442
-
7443
- .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list {
7444
- --pf-c-dual-list-selector__item-toggle--MarginTop: 0;
7445
- --pf-c-dual-list-selector__item-toggle--MarginBottom: 0;
7446
- }
7447
-
7448
- .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list .pf-c-dual-list-selector__item-toggle {
7449
- position: absolute;
7450
- top: 0;
7451
- left: var(--pf-c-dual-list-selector__list__list__item-toggle--Left);
7452
- transform: translateX(var(--pf-c-dual-list-selector__list__list__item-toggle--TranslateX));
7453
- }
7454
-
7455
- .pf-c-dual-list-selector__list.pf-m-drag-over {
7456
- overflow-anchor: none;
7457
- }
7458
-
7459
- .pf-c-dual-list-selector__list-item:focus {
7460
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
7461
- }
7462
-
7463
- .pf-c-dual-list-selector__list-item.pf-m-expandable {
7464
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__item--m-expandable--PaddingLeft);
7465
- }
7466
-
7467
- .pf-c-dual-list-selector__list-item.pf-m-expanded {
7468
- --pf-c-dual-list-selector__item-toggle-icon--Rotate: var(--pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate);
7469
- }
7470
-
7471
- .pf-c-dual-list-selector__list-item.pf-m-disabled {
7472
- --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-text--Color);
7473
- --pf-c-dual-list-selector__item-toggle-icon--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color);
7474
- pointer-events: none;
7475
- }
7476
-
7477
- .pf-c-dual-list-selector__list-item-row {
7478
- display: flex;
7479
- font-size: var(--pf-c-dual-list-selector__list-item-row--FontSize);
7480
- background-color: var(--pf-c-dual-list-selector__list-item-row--BackgroundColor);
7481
- }
7482
-
7483
- .pf-c-dual-list-selector__list-item-row:hover {
7484
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--hover--BackgroundColor);
7485
- }
7486
-
7487
- .pf-c-dual-list-selector__list-item-row.pf-m-selected {
7488
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
7489
- }
7490
-
7491
- .pf-c-dual-list-selector__list-item-row.pf-m-selected .pf-c-dual-list-selector__item-text {
7492
- --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--Color);
7493
- font-weight: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight);
7494
- }
7495
-
7496
- .pf-c-dual-list-selector__list-item-row.pf-m-check {
7497
- --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
7498
- }
7499
-
7500
- .pf-c-dual-list-selector__list-item-row.pf-m-ghost-row {
7501
- --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
7502
- opacity: var(--pf-c-dual-list-selector__list-item--m-ghost-row--Opacity);
7503
- }
7504
-
7505
- .pf-c-dual-list-selector__item,
7506
- .pf-c-dual-list-selector__main {
7507
- display: flex;
7508
- }
7509
-
7510
- .pf-c-dual-list-selector__item,
7511
- .pf-c-dual-list-selector__item-main {
7512
- flex-basis: 100%;
7513
- }
7514
-
7515
- .pf-c-dual-list-selector__draggable {
7516
- display: flex;
7517
- }
7518
-
7519
- .pf-c-dual-list-selector__draggable + .pf-c-dual-list-selector__item {
7520
- --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__draggable--item--PaddingLeft);
7521
- }
7522
-
7523
- .pf-c-dual-list-selector__draggable .pf-c-button {
7524
- --pf-c-button--FontSize: inherit;
7525
- cursor: grab;
7526
- }
7527
-
7528
- .pf-c-dual-list-selector__draggable .pf-c-button:active {
7529
- cursor: grabbing;
7530
- }
7531
-
7532
- .pf-c-dual-list-selector__item {
7533
- position: relative;
7534
- width: 100%;
7535
- padding: var(--pf-c-dual-list-selector__item--PaddingTop) var(--pf-c-dual-list-selector__item--PaddingRight) var(--pf-c-dual-list-selector__item--PaddingBottom) var(--pf-c-dual-list-selector__item--PaddingLeft);
7536
- cursor: pointer;
7537
- }
7538
-
7539
- .pf-c-dual-list-selector__item-count {
7540
- margin-left: var(--pf-c-dual-list-selector__item-count--Marginleft);
7541
- }
7542
-
7543
- .pf-c-dual-list-selector__item-count .pf-c-badge.pf-m-read {
7544
- --pf-c-badge--m-read--BackgroundColor: var(--pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor);
7545
- }
7546
-
7547
- .pf-c-dual-list-selector__item-text {
7548
- overflow: hidden;
7549
- text-overflow: ellipsis;
7550
- white-space: nowrap;
7551
- flex-grow: 1;
7552
- color: var(--pf-c-dual-list-selector__item-text--Color);
7553
- }
7554
-
7555
- .pf-c-dual-list-selector__controls {
7556
- grid-area: var(--pf-c-dual-list-selector__controls--GridArea);
7557
- align-self: center;
7558
- padding-right: var(--pf-c-dual-list-selector__controls--PaddingRight);
7559
- padding-left: var(--pf-c-dual-list-selector__controls--PaddingLeft);
7560
- }
7561
-
7562
- .pf-c-dual-list-selector__item-main {
7563
- display: flex;
7564
- min-width: 0;
7565
- }
7566
-
7567
- .pf-c-dual-list-selector__item-toggle {
7568
- padding: var(--pf-c-dual-list-selector__item-toggle--PaddingTop) var(--pf-c-dual-list-selector__item-toggle--PaddingRight) var(--pf-c-dual-list-selector__item-toggle--PaddingBottom) var(--pf-c-dual-list-selector__item-toggle--PaddingLeft);
7569
- margin-top: var(--pf-c-dual-list-selector__item-toggle--MarginTop);
7570
- margin-bottom: var(--pf-c-dual-list-selector__item-toggle--MarginBottom);
7571
- }
7572
-
7573
- .pf-c-dual-list-selector__item-check {
7574
- display: flex;
7575
- align-items: center;
7576
- margin-right: var(--pf-c-dual-list-selector__item-check--MarginRight);
7577
- }
7578
-
7579
- .pf-c-dual-list-selector__item-toggle-icon {
7580
- display: inline-block;
7581
- min-width: var(--pf-c-dual-list-selector__item-toggle-icon--MinWidth);
7582
- color: var(--pf-c-dual-list-selector__item-toggle-icon--Color, inherit);
7583
- text-align: center;
7584
- transition: var(--pf-c-dual-list-selector__item-toggle-icon--Transition);
7585
- transform: rotate(var(--pf-c-dual-list-selector__item-toggle-icon--Rotate));
7586
- }
7587
-
7588
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7589
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 1 + var(--pf-c-dual-list-selector__item--indent--base));
7590
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7591
- }
7592
-
7593
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7594
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 2 + var(--pf-c-dual-list-selector__item--indent--base));
7595
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7596
- }
7597
-
7598
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7599
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 3 + var(--pf-c-dual-list-selector__item--indent--base));
7600
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7601
- }
7602
-
7603
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7604
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 4 + var(--pf-c-dual-list-selector__item--indent--base));
7605
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7606
- }
7607
-
7608
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7609
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 5 + var(--pf-c-dual-list-selector__item--indent--base));
7610
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7611
- }
7612
-
7613
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7614
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 6 + var(--pf-c-dual-list-selector__item--indent--base));
7615
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7616
- }
7617
-
7618
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7619
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 7 + var(--pf-c-dual-list-selector__item--indent--base));
7620
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7621
- }
7622
-
7623
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7624
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 8 + var(--pf-c-dual-list-selector__item--indent--base));
7625
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7626
- }
7627
-
7628
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7629
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 9 + var(--pf-c-dual-list-selector__item--indent--base));
7630
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7631
- }
7632
-
7633
- .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
7634
- --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 10 + var(--pf-c-dual-list-selector__item--indent--base));
7635
- --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
7636
- }
7637
-
7638
7313
  .pf-c-dropdown {
7639
7314
  --pf-c-dropdown__toggle--PaddingTop: var(--pf-global--spacer--form-element);
7640
7315
  --pf-c-dropdown__toggle--PaddingRight: var(--pf-global--spacer--sm);
@@ -7929,458 +7604,783 @@ label.pf-c-check, .pf-c-check__label,
7929
7604
  transform: translateY(var(--pf-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY));
7930
7605
  }
7931
7606
 
7932
- .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-button {
7933
- color: var(--pf-c-dropdown__toggle-button--Color);
7934
- border: 0;
7607
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-button {
7608
+ color: var(--pf-c-dropdown__toggle-button--Color);
7609
+ border: 0;
7610
+ }
7611
+
7612
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-text {
7613
+ margin-left: var(--pf-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft);
7614
+ }
7615
+
7616
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) {
7617
+ --pf-c-dropdown__toggle--before--BorderWidth: 0;
7618
+ --pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth: 0;
7619
+ }
7620
+
7621
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > * {
7622
+ background-color: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor);
7623
+ border: 0;
7624
+ }
7625
+
7626
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
7627
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--hover--BackgroundColor);
7628
+ }
7629
+
7630
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
7631
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
7632
+ }
7633
+
7634
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *.pf-m-active {
7635
+ --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
7636
+ }
7637
+
7638
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :first-child {
7639
+ border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7640
+ border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7641
+ }
7642
+
7643
+ .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :last-child {
7644
+ border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7645
+ border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7646
+ }
7647
+
7648
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):hover::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:hover::before {
7649
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--hover--before--BorderBottomColor);
7650
+ }
7651
+
7652
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):focus::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:focus::before {
7653
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--focus--before--BorderBottomColor);
7654
+ border-bottom-width: var(--pf-c-dropdown__toggle--focus--before--BorderBottomWidth);
7655
+ }
7656
+
7657
+ .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):active::before, .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary).pf-m-active::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:active::before {
7658
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--active--before--BorderBottomColor);
7659
+ border-bottom-width: var(--pf-c-dropdown__toggle--active--before--BorderBottomWidth);
7660
+ }
7661
+
7662
+ .pf-m-expanded > .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary)::before, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
7663
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
7664
+ border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
7665
+ }
7666
+
7667
+ .pf-c-dropdown__toggle.pf-m-plain {
7668
+ --pf-c-dropdown__toggle-icon--Color: var(--pf-c-dropdown--m-plain__toggle-icon--Color);
7669
+ }
7670
+
7671
+ .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) {
7672
+ --pf-c-dropdown__toggle--PaddingRight: var(--pf-c-dropdown__toggle--m-plain--PaddingRight);
7673
+ --pf-c-dropdown__toggle--PaddingLeft: var(--pf-c-dropdown__toggle--m-plain--PaddingLeft);
7674
+ display: inline-block;
7675
+ color: var(--pf-c-dropdown__toggle--m-plain--Color);
7676
+ }
7677
+
7678
+ .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) > * {
7679
+ line-height: var(--pf-c-dropdown__toggle--m-plain--child--LineHeight);
7680
+ }
7681
+
7682
+ .pf-c-dropdown__toggle.pf-m-plain::before {
7683
+ border: 0;
7684
+ }
7685
+
7686
+ .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
7687
+ --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
7688
+ --pf-c-dropdown--m-plain__toggle-icon--Color: var(--pf-c-dropdown--m-plain--hover__toggle-icon--Color);
7689
+ }
7690
+
7691
+ .pf-c-dropdown__toggle.pf-m-plain.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-plain:disabled {
7692
+ --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--disabled--Color);
7693
+ }
7694
+
7695
+ .pf-c-dropdown__toggle.pf-m-primary {
7696
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
7697
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--BackgroundColor);
7698
+ --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
7699
+ border-radius: var(--pf-c-dropdown__toggle--m-primary--BorderRadius);
7700
+ }
7701
+
7702
+ .pf-c-dropdown__toggle.pf-m-primary::before,
7703
+ .pf-c-dropdown__toggle.pf-m-primary .pf-c-dropdown__toggle-button::before {
7704
+ border: 0;
7705
+ }
7706
+
7707
+ .pf-c-dropdown__toggle.pf-m-primary:hover {
7708
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--hover--BackgroundColor);
7709
+ }
7710
+
7711
+ .pf-c-dropdown__toggle.pf-m-primary:focus {
7712
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--focus--BackgroundColor);
7713
+ }
7714
+
7715
+ .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
7716
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
7717
+ }
7718
+
7719
+ .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-primary {
7720
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor);
7721
+ }
7722
+
7723
+ .pf-c-dropdown__toggle.pf-m-secondary {
7724
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
7725
+ }
7726
+
7727
+ .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled]) {
7728
+ --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-secondary--Color);
7729
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-secondary--BackgroundColor);
7730
+ }
7731
+
7732
+ .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled])::before {
7733
+ border: var(--pf-c-dropdown__toggle--m-secondary--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--before--BorderColor);
7734
+ border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
7735
+ }
7736
+
7737
+ .pf-c-dropdown__toggle.pf-m-secondary:hover {
7738
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth);
7739
+ }
7740
+
7741
+ .pf-c-dropdown__toggle.pf-m-secondary:focus {
7742
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth);
7743
+ }
7744
+
7745
+ .pf-c-dropdown__toggle.pf-m-secondary:active, .pf-c-dropdown__toggle.pf-m-secondary.pf-m-active {
7746
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth);
7747
+ }
7748
+
7749
+ .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-secondary {
7750
+ --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth);
7751
+ --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor);
7752
+ }
7753
+
7754
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) {
7755
+ --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--Color);
7756
+ }
7757
+
7758
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):hover {
7759
+ --pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--hover--before--BorderWidth);
7760
+ }
7761
+
7762
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):focus {
7763
+ --pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--focus--before--BorderWidth);
7764
+ }
7765
+
7766
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):active {
7767
+ --pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--active--before--BorderWidth);
7768
+ }
7769
+
7770
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *::before {
7771
+ border: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderColor);
7772
+ }
7773
+
7774
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
7775
+ --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--hover--BorderWidth);
7776
+ }
7777
+
7778
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
7779
+ --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--focus--BorderWidth);
7780
+ }
7781
+
7782
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:active {
7783
+ --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--active--BorderWidth);
7784
+ }
7785
+
7786
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:first-child::before {
7787
+ border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7788
+ border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7789
+ }
7790
+
7791
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:last-child::before {
7792
+ border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7793
+ border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
7794
+ }
7795
+
7796
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:first-child)::before {
7797
+ border-left: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth--base) solid var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderColor--base);
7798
+ }
7799
+
7800
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:last-child)::before {
7801
+ border-right: 0;
7802
+ }
7803
+
7804
+ .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled).pf-m-action::before {
7805
+ border: 0;
7806
+ }
7807
+
7808
+ .pf-c-dropdown__toggle > .pf-c-badge {
7809
+ --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft);
7810
+ --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginRight);
7811
+ }
7812
+
7813
+ .pf-c-dropdown__toggle .pf-c-dropdown__toggle-text {
7814
+ overflow: hidden;
7815
+ text-overflow: ellipsis;
7816
+ white-space: nowrap;
7817
+ }
7818
+
7819
+ .pf-c-dropdown__toggle-text {
7820
+ flex: 0 1 auto;
7821
+ }
7822
+
7823
+ .pf-c-dropdown__toggle-icon {
7824
+ margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
7825
+ margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
7826
+ line-height: var(--pf-c-dropdown__toggle-icon--LineHeight);
7827
+ color: var(--pf-c-dropdown__toggle-icon--Color, inherit);
7828
+ }
7829
+
7830
+ .pf-c-dropdown.pf-m-top.pf-m-expanded .pf-c-dropdown__toggle-icon {
7831
+ transform: rotate(var(--pf-c-dropdown--m-top--m-expanded__toggle-icon--Rotate));
7832
+ }
7833
+
7834
+ .pf-c-dropdown__toggle-image {
7835
+ display: inline-flex;
7836
+ flex-shrink: 0;
7837
+ align-self: center;
7838
+ margin-top: var(--pf-c-dropdown__toggle-image--MarginTop);
7839
+ margin-right: var(--pf-c-dropdown__toggle-image--MarginRight);
7840
+ margin-bottom: var(--pf-c-dropdown__toggle-image--MarginBottom);
7841
+ line-height: 1;
7842
+ }
7843
+
7844
+ .pf-c-dropdown__toggle-image:last-child {
7845
+ --pf-c-dropdown__toggle-image--MarginRight: 0;
7935
7846
  }
7936
7847
 
7937
- .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-text {
7938
- margin-left: var(--pf-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft);
7848
+ .pf-c-dropdown__menu {
7849
+ position: absolute;
7850
+ top: var(--pf-c-dropdown__menu--Top);
7851
+ z-index: var(--pf-c-dropdown__menu--ZIndex);
7852
+ padding-top: var(--pf-c-dropdown__menu--PaddingTop);
7853
+ padding-bottom: var(--pf-c-dropdown__menu--PaddingBottom);
7854
+ background: var(--pf-c-dropdown__menu--BackgroundColor);
7855
+ background-clip: padding-box;
7856
+ box-shadow: var(--pf-c-dropdown__menu--BoxShadow);
7939
7857
  }
7940
7858
 
7941
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) {
7942
- --pf-c-dropdown__toggle--before--BorderWidth: 0;
7943
- --pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth: 0;
7859
+ .pf-c-dropdown__menu.pf-m-static {
7860
+ --pf-c-dropdown--m-top__menu--TranslateY: 0;
7861
+ position: static;
7862
+ top: auto;
7863
+ right: auto;
7864
+ bottom: auto;
7865
+ left: auto;
7866
+ z-index: auto;
7867
+ min-width: min-content;
7944
7868
  }
7945
7869
 
7946
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > * {
7947
- background-color: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor);
7948
- border: 0;
7870
+ .pf-c-dropdown .pf-c-menu,
7871
+ .pf-c-dropdown__menu {
7872
+ min-width: 100%;
7949
7873
  }
7950
7874
 
7951
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
7952
- --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--hover--BackgroundColor);
7875
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right,
7876
+ .pf-c-dropdown__menu.pf-m-align-right {
7877
+ right: 0;
7953
7878
  }
7954
7879
 
7955
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
7956
- --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
7880
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left,
7881
+ .pf-c-dropdown__menu.pf-m-align-left {
7882
+ right: auto;
7957
7883
  }
7958
7884
 
7959
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > *.pf-m-active {
7960
- --pf-c-dropdown__toggle--m-split-button--m-primary--child--BackgroundColor: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--focus--BackgroundColor);
7961
- }
7885
+ @media (min-width: 576px) {
7886
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-sm,
7887
+ .pf-c-dropdown__menu.pf-m-align-right-on-sm {
7888
+ right: 0;
7889
+ }
7962
7890
 
7963
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :first-child {
7964
- border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7965
- border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7891
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-sm,
7892
+ .pf-c-dropdown__menu.pf-m-align-left-on-sm {
7893
+ right: auto;
7894
+ }
7966
7895
  }
7896
+ @media (min-width: 768px) {
7897
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-md,
7898
+ .pf-c-dropdown__menu.pf-m-align-right-on-md {
7899
+ right: 0;
7900
+ }
7967
7901
 
7968
- .pf-c-dropdown__toggle.pf-m-primary.pf-m-split-button:not(.pf-m-disabled) > :last-child {
7969
- border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7970
- border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius);
7902
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-md,
7903
+ .pf-c-dropdown__menu.pf-m-align-left-on-md {
7904
+ right: auto;
7905
+ }
7971
7906
  }
7907
+ @media (min-width: 992px) {
7908
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-lg,
7909
+ .pf-c-dropdown__menu.pf-m-align-right-on-lg {
7910
+ right: 0;
7911
+ }
7972
7912
 
7973
- .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):hover::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:hover::before {
7974
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--hover--before--BorderBottomColor);
7913
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-lg,
7914
+ .pf-c-dropdown__menu.pf-m-align-left-on-lg {
7915
+ right: auto;
7916
+ }
7975
7917
  }
7918
+ @media (min-width: 1200px) {
7919
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-xl,
7920
+ .pf-c-dropdown__menu.pf-m-align-right-on-xl {
7921
+ right: 0;
7922
+ }
7976
7923
 
7977
- .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):focus::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:focus::before {
7978
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--focus--before--BorderBottomColor);
7979
- border-bottom-width: var(--pf-c-dropdown__toggle--focus--before--BorderBottomWidth);
7924
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-xl,
7925
+ .pf-c-dropdown__menu.pf-m-align-left-on-xl {
7926
+ right: auto;
7927
+ }
7980
7928
  }
7929
+ @media (min-width: 1450px) {
7930
+ .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-2xl,
7931
+ .pf-c-dropdown__menu.pf-m-align-right-on-2xl {
7932
+ right: 0;
7933
+ }
7981
7934
 
7982
- .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary):active::before, .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary).pf-m-active::before, .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button:active::before {
7983
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown__toggle--active--before--BorderBottomColor);
7984
- border-bottom-width: var(--pf-c-dropdown__toggle--active--before--BorderBottomWidth);
7935
+ .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-2xl,
7936
+ .pf-c-dropdown__menu.pf-m-align-left-on-2xl {
7937
+ right: auto;
7938
+ }
7985
7939
  }
7986
-
7987
- .pf-m-expanded > .pf-c-dropdown__toggle:not(.pf-m-action):not(.pf-m-secondary)::before, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-action .pf-c-dropdown__toggle-button::before {
7988
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
7989
- border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
7940
+ .pf-c-dropdown.pf-m-top .pf-c-dropdown__menu {
7941
+ --pf-c-dropdown__menu--Top: var(--pf-c-dropdown--m-top__menu--Top);
7942
+ transform: translateY(var(--pf-c-dropdown--m-top__menu--TranslateY));
7990
7943
  }
7991
7944
 
7992
- .pf-c-dropdown__toggle.pf-m-plain {
7993
- --pf-c-dropdown__toggle-icon--Color: var(--pf-c-dropdown--m-plain__toggle-icon--Color);
7945
+ .pf-c-dropdown.pf-m-top > .pf-c-menu {
7946
+ --pf-c-dropdown--c-menu--Top: var(--pf-c-dropdown--m-top--c-menu--Top);
7947
+ transform: translateY(var(--pf-c-dropdown--m-top--c-menu--TranslateY));
7994
7948
  }
7995
7949
 
7996
- .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) {
7997
- --pf-c-dropdown__toggle--PaddingRight: var(--pf-c-dropdown__toggle--m-plain--PaddingRight);
7998
- --pf-c-dropdown__toggle--PaddingLeft: var(--pf-c-dropdown__toggle--m-plain--PaddingLeft);
7999
- display: inline-block;
8000
- color: var(--pf-c-dropdown__toggle--m-plain--Color);
7950
+ .pf-c-dropdown__menu-item {
7951
+ display: block;
7952
+ width: 100%;
7953
+ padding: var(--pf-c-dropdown__menu-item--PaddingTop) var(--pf-c-dropdown__menu-item--PaddingRight) var(--pf-c-dropdown__menu-item--PaddingBottom) var(--pf-c-dropdown__menu-item--PaddingLeft);
7954
+ font-size: var(--pf-c-dropdown__menu-item--FontSize);
7955
+ font-weight: var(--pf-c-dropdown__menu-item--FontWeight);
7956
+ line-height: var(--pf-c-dropdown__menu-item--LineHeight);
7957
+ color: var(--pf-c-dropdown__menu-item--Color);
7958
+ text-align: left;
7959
+ white-space: nowrap;
7960
+ background-color: var(--pf-c-dropdown__menu-item--BackgroundColor);
7961
+ border: none;
8001
7962
  }
8002
7963
 
8003
- .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) > * {
8004
- line-height: var(--pf-c-dropdown__toggle--m-plain--child--LineHeight);
7964
+ .pf-c-dropdown__menu-item:hover, .pf-c-dropdown__menu-item:focus {
7965
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--hover--Color);
7966
+ --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--hover--BackgroundColor);
7967
+ text-decoration: none;
8005
7968
  }
8006
7969
 
8007
- .pf-c-dropdown__toggle.pf-m-plain::before {
8008
- border: 0;
7970
+ .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled, .pf-c-dropdown__menu-item.pf-m-aria-disabled {
7971
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--disabled--Color);
7972
+ --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--disabled--BackgroundColor);
8009
7973
  }
8010
7974
 
8011
- .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
8012
- --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
8013
- --pf-c-dropdown--m-plain__toggle-icon--Color: var(--pf-c-dropdown--m-plain--hover__toggle-icon--Color);
7975
+ .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled {
7976
+ pointer-events: none;
8014
7977
  }
8015
7978
 
8016
- .pf-c-dropdown__toggle.pf-m-plain.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-plain:disabled {
8017
- --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--disabled--Color);
7979
+ .pf-c-dropdown__menu-item.pf-m-aria-disabled {
7980
+ cursor: default;
8018
7981
  }
8019
7982
 
8020
- .pf-c-dropdown__toggle.pf-m-primary {
8021
- --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
8022
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--BackgroundColor);
8023
- --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-primary--Color);
8024
- border-radius: var(--pf-c-dropdown__toggle--m-primary--BorderRadius);
7983
+ .pf-c-dropdown__menu-item.pf-m-icon {
7984
+ display: flex;
7985
+ align-items: center;
8025
7986
  }
8026
7987
 
8027
- .pf-c-dropdown__toggle.pf-m-primary::before,
8028
- .pf-c-dropdown__toggle.pf-m-primary .pf-c-dropdown__toggle-button::before {
8029
- border: 0;
7988
+ .pf-c-dropdown__menu-item.pf-m-icon.pf-m-description {
7989
+ flex-direction: column;
7990
+ align-items: start;
8030
7991
  }
8031
7992
 
8032
- .pf-c-dropdown__toggle.pf-m-primary:hover {
8033
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--hover--BackgroundColor);
7993
+ .pf-c-dropdown__menu-item.pf-m-icon .pf-c-dropdown__menu-item-main {
7994
+ display: flex;
7995
+ align-items: center;
8034
7996
  }
8035
7997
 
8036
- .pf-c-dropdown__toggle.pf-m-primary:focus {
8037
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--focus--BackgroundColor);
7998
+ .pf-c-dropdown__menu-item.pf-m-text {
7999
+ --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--m-text--Color);
8038
8000
  }
8039
8001
 
8040
- .pf-c-dropdown__toggle.pf-m-primary:active, .pf-c-dropdown__toggle.pf-m-primary.pf-m-active {
8041
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-primary--active--BackgroundColor);
8002
+ .pf-c-dropdown__menu-item.pf-m-text:hover, .pf-c-dropdown__menu-item.pf-m-text:focus {
8003
+ --pf-c-dropdown__menu-item--BackgroundColor: transparent;
8042
8004
  }
8043
8005
 
8044
- .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-primary {
8045
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown--m-expanded__toggle--m-primary--BackgroundColor);
8006
+ .pf-c-dropdown__menu-item-icon {
8007
+ display: inline-flex;
8008
+ align-items: center;
8009
+ justify-content: center;
8010
+ width: var(--pf-c-dropdown__menu-item-icon--Width);
8011
+ height: var(--pf-c-dropdown__menu-item-icon--Height);
8012
+ margin-right: var(--pf-c-dropdown__menu-item-icon--MarginRight);
8046
8013
  }
8047
8014
 
8048
- .pf-c-dropdown__toggle.pf-m-secondary {
8049
- border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
8015
+ .pf-c-dropdown__menu-item-icon > * {
8016
+ max-width: 100%;
8017
+ max-height: 100%;
8050
8018
  }
8051
8019
 
8052
- .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled]) {
8053
- --pf-c-dropdown__toggle--Color: var(--pf-c-dropdown__toggle--m-secondary--Color);
8054
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-c-dropdown__toggle--m-secondary--BackgroundColor);
8020
+ .pf-c-dropdown__menu-item-description {
8021
+ font-size: var(--pf-c-dropdown__menu-item-description--FontSize);
8022
+ color: var(--pf-c-dropdown__menu-item-description--Color);
8055
8023
  }
8056
8024
 
8057
- .pf-c-dropdown__toggle.pf-m-secondary:not(.pf-m-disabled):not([disabled])::before {
8058
- border: var(--pf-c-dropdown__toggle--m-secondary--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--before--BorderColor);
8059
- border-radius: var(--pf-c-dropdown__toggle--m-secondary--BorderRadius);
8025
+ .pf-c-dropdown__group + .pf-c-dropdown__group {
8026
+ padding-top: var(--pf-c-dropdown__group--group--PaddingTop);
8060
8027
  }
8061
8028
 
8062
- .pf-c-dropdown__toggle.pf-m-secondary:hover {
8063
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth);
8029
+ .pf-c-dropdown__group-title {
8030
+ padding-top: var(--pf-c-dropdown__group-title--PaddingTop);
8031
+ padding-right: var(--pf-c-dropdown__group-title--PaddingRight);
8032
+ padding-bottom: var(--pf-c-dropdown__group-title--PaddingBottom);
8033
+ padding-left: var(--pf-c-dropdown__group-title--PaddingLeft);
8034
+ font-size: var(--pf-c-dropdown__group-title--FontSize);
8035
+ font-weight: var(--pf-c-dropdown__group-title--FontWeight);
8036
+ color: var(--pf-c-dropdown__group-title--Color);
8064
8037
  }
8065
8038
 
8066
- .pf-c-dropdown__toggle.pf-m-secondary:focus {
8067
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth);
8039
+ :where(.pf-theme-dark) .pf-c-dropdown {
8040
+ --pf-c-dropdown__toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
8041
+ --pf-c-dropdown__toggle--before--BorderTopColor: transparent;
8042
+ --pf-c-dropdown__toggle--before--BorderRightColor: transparent;
8043
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--400);
8044
+ --pf-c-dropdown__toggle--before--BorderLeftColor: transparent;
8045
+ --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
8046
+ --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
8047
+ --pf-c-dropdown__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
8048
+ --pf-c-dropdown__menu--Top: 100%;
8049
+ --pf-c-dropdown--m-top__menu--TranslateY: -100%;
8050
+ --pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
8068
8051
  }
8069
8052
 
8070
- .pf-c-dropdown__toggle.pf-m-secondary:active, .pf-c-dropdown__toggle.pf-m-secondary.pf-m-active {
8071
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth);
8053
+ :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain):disabled, :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain).pf-m-disabled {
8054
+ color: var(--pf-global--palette--black-100);
8072
8055
  }
8073
8056
 
8074
- .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-secondary {
8075
- --pf-c-dropdown__toggle--m-secondary--before--BorderWidth: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth);
8076
- --pf-c-dropdown__toggle--m-secondary--before--BorderColor: var(--pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor);
8057
+ :where(.pf-theme-dark) .pf-c-dropdown__toggle.pf-m-plain {
8058
+ background: transparent;
8077
8059
  }
8078
8060
 
8079
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) {
8080
- --pf-c-dropdown__toggle-button--Color: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--Color);
8061
+ .pf-c-dual-list-selector {
8062
+ --pf-c-dual-list-selector__header--GridArea: pane-header;
8063
+ --pf-c-dual-list-selector__tools--GridArea: pane-tools;
8064
+ --pf-c-dual-list-selector__status--GridArea: pane-status;
8065
+ --pf-c-dual-list-selector__menu--GridArea: pane-menu;
8066
+ --pf-c-dual-list-selector__controls--GridArea: controls;
8067
+ --pf-c-dual-list-selector--m-chosen__header--GridArea: pane-header-c;
8068
+ --pf-c-dual-list-selector--m-chosen__tools--GridArea: pane-tools-c;
8069
+ --pf-c-dual-list-selector--m-chosen__status--GridArea: pane-status-c;
8070
+ --pf-c-dual-list-selector--m-chosen__menu--GridArea: pane-menu-c;
8071
+ --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min: 12.5rem;
8072
+ --pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max: 28.125rem;
8073
+ --pf-c-dual-list-selector__header--MarginBottom: var(--pf-global--spacer--sm);
8074
+ --pf-c-dual-list-selector__title-text--FontWeight: var(--pf-global--FontWeight--bold);
8075
+ --pf-c-dual-list-selector__tools--MarginBottom: var(--pf-global--spacer--md);
8076
+ --pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft: var(--pf-global--spacer--sm);
8077
+ --pf-c-dual-list-selector__menu--BorderWidth: var(--pf-global--BorderWidth--sm);
8078
+ --pf-c-dual-list-selector__menu--BorderColor: var(--pf-global--BorderColor--100);
8079
+ --pf-c-dual-list-selector__menu--MinHeight: 12.5rem;
8080
+ --pf-c-dual-list-selector__menu--MaxHeight: 20rem;
8081
+ --pf-c-dual-list-selector__list-item-row--FontSize: var(--pf-global--FontSize--sm);
8082
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: transparent;
8083
+ --pf-c-dual-list-selector__list-item-row--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8084
+ --pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8085
+ --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
8086
+ --pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor: var(--pf-global--BackgroundColor--100);
8087
+ --pf-c-dual-list-selector__list-item--m-ghost-row--Opacity: .4;
8088
+ --pf-c-dual-list-selector__item--PaddingTop: var(--pf-global--spacer--sm);
8089
+ --pf-c-dual-list-selector__item--PaddingRight: var(--pf-global--spacer--md);
8090
+ --pf-c-dual-list-selector__item--PaddingBottom: var(--pf-global--spacer--sm);
8091
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-global--spacer--md);
8092
+ --pf-c-dual-list-selector__item--m-expandable--PaddingLeft: 0;
8093
+ --pf-c-dual-list-selector__item--indent--base: calc(var(--pf-global--spacer--md) + var(--pf-global--spacer--sm) + var(--pf-c-dual-list-selector__list-item-row--FontSize));
8094
+ --pf-c-dual-list-selector__item--nested-indent--base: calc(var(--pf-c-dual-list-selector__item--indent--base) - var(--pf-global--spacer--md));
8095
+ --pf-c-dual-list-selector__draggable--item--PaddingLeft: var(--pf-global--spacer--xs);
8096
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-global--Color--100);
8097
+ --pf-c-dual-list-selector__list-item-row--m-selected__text--Color: var(--pf-global--active-color--100);
8098
+ --pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight: var(--pf-global--FontWeight--bold);
8099
+ --pf-c-dual-list-selector__list-item--m-disabled__item-text--Color: var(--pf-global--disabled-color--100);
8100
+ --pf-c-dual-list-selector__status--MarginBottom: var(--pf-global--spacer--sm);
8101
+ --pf-c-dual-list-selector__status-text--FontSize: var(--pf-global--FontSize--sm);
8102
+ --pf-c-dual-list-selector__status-text--Color: var(--pf-global--Color--200);
8103
+ --pf-c-dual-list-selector__controls--PaddingRight: var(--pf-global--spacer--md);
8104
+ --pf-c-dual-list-selector__controls--PaddingLeft: var(--pf-global--spacer--md);
8105
+ --pf-c-dual-list-selector__item-toggle--PaddingTop: var(--pf-global--spacer--sm);
8106
+ --pf-c-dual-list-selector__item-toggle--PaddingRight: var(--pf-global--spacer--sm);
8107
+ --pf-c-dual-list-selector__item-toggle--PaddingBottom: var(--pf-global--spacer--sm);
8108
+ --pf-c-dual-list-selector__item-toggle--PaddingLeft: var(--pf-global--spacer--md);
8109
+ --pf-c-dual-list-selector__item-toggle--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
8110
+ --pf-c-dual-list-selector__item-toggle--MarginBottom: calc(var(--pf-global--spacer--sm) * -1);
8111
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: 0;
8112
+ --pf-c-dual-list-selector__list__list__item-toggle--TranslateX: -100%;
8113
+ --pf-c-dual-list-selector__item-check--MarginRight: var(--pf-global--spacer--sm);
8114
+ --pf-c-dual-list-selector__item-count--Marginleft: var(--pf-global--spacer--sm);
8115
+ --pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-global--disabled-color--200);
8116
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
8117
+ --pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
8118
+ --pf-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-global--Transition);
8119
+ --pf-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-c-dual-list-selector__list-item-row--FontSize);
8120
+ --pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-global--disabled-color--200);
8121
+ display: grid;
8122
+ grid-template-areas: "pane-header . pane-header-c" "pane-tools . pane-tools-c" "pane-status . pane-status-c" "pane-menu controls pane-menu-c";
8123
+ grid-template-columns: minmax(var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min), var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max)) min-content minmax(var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--min), var(--pf-c-dual-list-selector--GridTemplateColumns--pane--MinMax--max));
8124
+ grid-template-rows: repeat(3, auto) auto;
8081
8125
  }
8082
8126
 
8083
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):hover {
8084
- --pf-c-dropdown__toggle--m-secondary--hover--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--hover--before--BorderWidth);
8127
+ .pf-c-dual-list-selector__pane {
8128
+ display: contents;
8085
8129
  }
8086
8130
 
8087
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):focus {
8088
- --pf-c-dropdown__toggle--m-secondary--focus--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--focus--before--BorderWidth);
8131
+ .pf-c-dual-list-selector__pane.pf-m-chosen {
8132
+ --pf-c-dual-list-selector__header--GridArea: var(--pf-c-dual-list-selector--m-chosen__header--GridArea);
8133
+ --pf-c-dual-list-selector__tools--GridArea: var(--pf-c-dual-list-selector--m-chosen__tools--GridArea);
8134
+ --pf-c-dual-list-selector__status--GridArea: var(--pf-c-dual-list-selector--m-chosen__status--GridArea);
8135
+ --pf-c-dual-list-selector__menu--GridArea: var(--pf-c-dual-list-selector--m-chosen__menu--GridArea);
8089
8136
  }
8090
8137
 
8091
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled):active {
8092
- --pf-c-dropdown__toggle--m-secondary--active--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--active--before--BorderWidth);
8138
+ .pf-c-dual-list-selector__header {
8139
+ grid-area: var(--pf-c-dual-list-selector__header--GridArea);
8140
+ margin-bottom: var(--pf-c-dual-list-selector__header--MarginBottom);
8093
8141
  }
8094
8142
 
8095
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *::before {
8096
- border: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth) solid var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderColor);
8143
+ .pf-c-dual-list-selector__title-text {
8144
+ font-weight: var(--pf-c-dual-list-selector__title-text--FontWeight);
8097
8145
  }
8098
8146
 
8099
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:hover {
8100
- --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--hover--BorderWidth);
8147
+ .pf-c-dual-list-selector__tools {
8148
+ display: flex;
8149
+ grid-area: var(--pf-c-dual-list-selector__tools--GridArea);
8150
+ margin-bottom: var(--pf-c-dual-list-selector__tools--MarginBottom);
8101
8151
  }
8102
8152
 
8103
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:focus {
8104
- --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--focus--BorderWidth);
8153
+ .pf-c-dual-list-selector__tools-filter {
8154
+ flex-grow: 1;
8105
8155
  }
8106
8156
 
8107
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:active {
8108
- --pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--active--BorderWidth);
8157
+ .pf-c-dual-list-selector__tools-actions {
8158
+ display: flex;
8109
8159
  }
8110
8160
 
8111
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:first-child::before {
8112
- border-top-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8113
- border-bottom-left-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8161
+ .pf-c-dual-list-selector__tools-filter ~ .pf-c-dual-list-selector__tools-actions {
8162
+ margin-left: var(--pf-c-dual-list-selector__tools-filter--tools-actions--MarginLeft);
8114
8163
  }
8115
8164
 
8116
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:last-child::before {
8117
- border-top-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8118
- border-bottom-right-radius: var(--pf-c-dropdown__toggle--m-split-button--child--BorderRadius);
8165
+ .pf-c-dual-list-selector__status {
8166
+ display: flex;
8167
+ grid-area: var(--pf-c-dual-list-selector__status--GridArea);
8168
+ margin-bottom: var(--pf-c-dual-list-selector__status--MarginBottom);
8119
8169
  }
8120
8170
 
8121
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:first-child)::before {
8122
- border-left: var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderWidth--base) solid var(--pf-c-dropdown__toggle--m-secondary--m-split-button--child--before--BorderColor--base);
8171
+ .pf-c-dual-list-selector__status-text {
8172
+ flex-grow: 1;
8173
+ font-size: var(--pf-c-dual-list-selector__status-text--FontSize);
8174
+ color: var(--pf-c-dual-list-selector__status-text--Color);
8123
8175
  }
8124
8176
 
8125
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled) > *:not(:last-child)::before {
8126
- border-right: 0;
8177
+ .pf-c-dual-list-selector__menu {
8178
+ grid-area: var(--pf-c-dual-list-selector__menu--GridArea);
8179
+ min-height: var(--pf-c-dual-list-selector__menu--MinHeight);
8180
+ max-height: var(--pf-c-dual-list-selector__menu--MaxHeight);
8181
+ overflow: auto;
8182
+ border: var(--pf-c-dual-list-selector__menu--BorderWidth) solid var(--pf-c-dual-list-selector__menu--BorderColor);
8127
8183
  }
8128
8184
 
8129
- .pf-c-dropdown__toggle.pf-m-secondary.pf-m-split-button:not(.pf-m-disabled).pf-m-action::before {
8130
- border: 0;
8185
+ .pf-c-dual-list-selector__list {
8186
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: 0;
8187
+ display: flex;
8188
+ flex-direction: column;
8131
8189
  }
8132
8190
 
8133
- .pf-c-dropdown__toggle > .pf-c-badge {
8134
- --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft);
8135
- --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-c-dropdown__toggle--c-badge__toggle-icon--MarginRight);
8191
+ .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list {
8192
+ --pf-c-dual-list-selector__item-toggle--MarginTop: 0;
8193
+ --pf-c-dual-list-selector__item-toggle--MarginBottom: 0;
8136
8194
  }
8137
8195
 
8138
- .pf-c-dropdown__toggle .pf-c-dropdown__toggle-text {
8139
- overflow: hidden;
8140
- text-overflow: ellipsis;
8141
- white-space: nowrap;
8196
+ .pf-c-dual-list-selector__list .pf-c-dual-list-selector__list .pf-c-dual-list-selector__item-toggle {
8197
+ position: absolute;
8198
+ top: 0;
8199
+ left: var(--pf-c-dual-list-selector__list__list__item-toggle--Left);
8200
+ transform: translateX(var(--pf-c-dual-list-selector__list__list__item-toggle--TranslateX));
8142
8201
  }
8143
8202
 
8144
- .pf-c-dropdown__toggle-text {
8145
- flex: 0 1 auto;
8203
+ .pf-c-dual-list-selector__list.pf-m-drag-over {
8204
+ overflow-anchor: none;
8146
8205
  }
8147
8206
 
8148
- .pf-c-dropdown__toggle-icon {
8149
- margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
8150
- margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
8151
- line-height: var(--pf-c-dropdown__toggle-icon--LineHeight);
8152
- color: var(--pf-c-dropdown__toggle-icon--Color, inherit);
8207
+ .pf-c-dual-list-selector__list-item:focus {
8208
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--focus-within--BackgroundColor);
8153
8209
  }
8154
8210
 
8155
- .pf-c-dropdown.pf-m-top.pf-m-expanded .pf-c-dropdown__toggle-icon {
8156
- transform: rotate(var(--pf-c-dropdown--m-top--m-expanded__toggle-icon--Rotate));
8211
+ .pf-c-dual-list-selector__list-item.pf-m-expandable {
8212
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__item--m-expandable--PaddingLeft);
8157
8213
  }
8158
8214
 
8159
- .pf-c-dropdown__toggle-image {
8160
- display: inline-flex;
8161
- flex-shrink: 0;
8162
- align-self: center;
8163
- margin-top: var(--pf-c-dropdown__toggle-image--MarginTop);
8164
- margin-right: var(--pf-c-dropdown__toggle-image--MarginRight);
8165
- margin-bottom: var(--pf-c-dropdown__toggle-image--MarginBottom);
8166
- line-height: 1;
8215
+ .pf-c-dual-list-selector__list-item.pf-m-expanded {
8216
+ --pf-c-dual-list-selector__item-toggle-icon--Rotate: var(--pf-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate);
8167
8217
  }
8168
8218
 
8169
- .pf-c-dropdown__toggle-image:last-child {
8170
- --pf-c-dropdown__toggle-image--MarginRight: 0;
8219
+ .pf-c-dual-list-selector__list-item.pf-m-disabled {
8220
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-text--Color);
8221
+ --pf-c-dual-list-selector__item-toggle-icon--Color: var(--pf-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color);
8222
+ pointer-events: none;
8171
8223
  }
8172
8224
 
8173
- .pf-c-dropdown__menu {
8174
- position: absolute;
8175
- top: var(--pf-c-dropdown__menu--Top);
8176
- z-index: var(--pf-c-dropdown__menu--ZIndex);
8177
- padding-top: var(--pf-c-dropdown__menu--PaddingTop);
8178
- padding-bottom: var(--pf-c-dropdown__menu--PaddingBottom);
8179
- background: var(--pf-c-dropdown__menu--BackgroundColor);
8180
- background-clip: padding-box;
8181
- box-shadow: var(--pf-c-dropdown__menu--BoxShadow);
8225
+ .pf-c-dual-list-selector__list-item-row {
8226
+ display: flex;
8227
+ font-size: var(--pf-c-dual-list-selector__list-item-row--FontSize);
8228
+ background-color: var(--pf-c-dual-list-selector__list-item-row--BackgroundColor);
8182
8229
  }
8183
8230
 
8184
- .pf-c-dropdown__menu.pf-m-static {
8185
- --pf-c-dropdown--m-top__menu--TranslateY: 0;
8186
- position: static;
8187
- top: auto;
8188
- right: auto;
8189
- bottom: auto;
8190
- left: auto;
8191
- z-index: auto;
8192
- min-width: min-content;
8231
+ .pf-c-dual-list-selector__list-item-row:hover {
8232
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--hover--BackgroundColor);
8193
8233
  }
8194
8234
 
8195
- .pf-c-dropdown .pf-c-menu,
8196
- .pf-c-dropdown__menu {
8197
- min-width: 100%;
8235
+ .pf-c-dual-list-selector__list-item-row.pf-m-selected {
8236
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor);
8198
8237
  }
8199
8238
 
8200
- .pf-c-dropdown .pf-c-menu.pf-m-align-right,
8201
- .pf-c-dropdown__menu.pf-m-align-right {
8202
- right: 0;
8239
+ .pf-c-dual-list-selector__list-item-row.pf-m-selected .pf-c-dual-list-selector__item-text {
8240
+ --pf-c-dual-list-selector__item-text--Color: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--Color);
8241
+ font-weight: var(--pf-c-dual-list-selector__list-item-row--m-selected__text--FontWeight);
8203
8242
  }
8204
8243
 
8205
- .pf-c-dropdown .pf-c-menu.pf-m-align-left,
8206
- .pf-c-dropdown__menu.pf-m-align-left {
8207
- right: auto;
8244
+ .pf-c-dual-list-selector__list-item-row.pf-m-check {
8245
+ --pf-c-dual-list-selector__list-item-row--m-selected--BackgroundColor: transparent;
8208
8246
  }
8209
8247
 
8210
- @media (min-width: 576px) {
8211
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-sm,
8212
- .pf-c-dropdown__menu.pf-m-align-right-on-sm {
8213
- right: 0;
8214
- }
8215
-
8216
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-sm,
8217
- .pf-c-dropdown__menu.pf-m-align-left-on-sm {
8218
- right: auto;
8219
- }
8248
+ .pf-c-dual-list-selector__list-item-row.pf-m-ghost-row {
8249
+ --pf-c-dual-list-selector__list-item-row--BackgroundColor: var(--pf-c-dual-list-selector__list-item--m-ghost-row--BackgroundColor);
8250
+ opacity: var(--pf-c-dual-list-selector__list-item--m-ghost-row--Opacity);
8220
8251
  }
8221
- @media (min-width: 768px) {
8222
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-md,
8223
- .pf-c-dropdown__menu.pf-m-align-right-on-md {
8224
- right: 0;
8225
- }
8226
8252
 
8227
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-md,
8228
- .pf-c-dropdown__menu.pf-m-align-left-on-md {
8229
- right: auto;
8230
- }
8253
+ .pf-c-dual-list-selector__item,
8254
+ .pf-c-dual-list-selector__main {
8255
+ display: flex;
8231
8256
  }
8232
- @media (min-width: 992px) {
8233
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-lg,
8234
- .pf-c-dropdown__menu.pf-m-align-right-on-lg {
8235
- right: 0;
8236
- }
8237
8257
 
8238
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-lg,
8239
- .pf-c-dropdown__menu.pf-m-align-left-on-lg {
8240
- right: auto;
8241
- }
8258
+ .pf-c-dual-list-selector__item,
8259
+ .pf-c-dual-list-selector__item-main {
8260
+ flex-basis: 100%;
8242
8261
  }
8243
- @media (min-width: 1200px) {
8244
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-xl,
8245
- .pf-c-dropdown__menu.pf-m-align-right-on-xl {
8246
- right: 0;
8247
- }
8248
8262
 
8249
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-xl,
8250
- .pf-c-dropdown__menu.pf-m-align-left-on-xl {
8251
- right: auto;
8252
- }
8253
- }
8254
- @media (min-width: 1450px) {
8255
- .pf-c-dropdown .pf-c-menu.pf-m-align-right-on-2xl,
8256
- .pf-c-dropdown__menu.pf-m-align-right-on-2xl {
8257
- right: 0;
8258
- }
8263
+ .pf-c-dual-list-selector__draggable {
8264
+ display: flex;
8265
+ }
8259
8266
 
8260
- .pf-c-dropdown .pf-c-menu.pf-m-align-left-on-2xl,
8261
- .pf-c-dropdown__menu.pf-m-align-left-on-2xl {
8262
- right: auto;
8263
- }
8267
+ .pf-c-dual-list-selector__draggable + .pf-c-dual-list-selector__item {
8268
+ --pf-c-dual-list-selector__item--PaddingLeft: var(--pf-c-dual-list-selector__draggable--item--PaddingLeft);
8264
8269
  }
8265
- .pf-c-dropdown.pf-m-top .pf-c-dropdown__menu {
8266
- --pf-c-dropdown__menu--Top: var(--pf-c-dropdown--m-top__menu--Top);
8267
- transform: translateY(var(--pf-c-dropdown--m-top__menu--TranslateY));
8270
+
8271
+ .pf-c-dual-list-selector__draggable .pf-c-button {
8272
+ --pf-c-button--FontSize: inherit;
8273
+ cursor: grab;
8268
8274
  }
8269
8275
 
8270
- .pf-c-dropdown.pf-m-top > .pf-c-menu {
8271
- --pf-c-dropdown--c-menu--Top: var(--pf-c-dropdown--m-top--c-menu--Top);
8272
- transform: translateY(var(--pf-c-dropdown--m-top--c-menu--TranslateY));
8276
+ .pf-c-dual-list-selector__draggable .pf-c-button:active {
8277
+ cursor: grabbing;
8273
8278
  }
8274
8279
 
8275
- .pf-c-dropdown__menu-item {
8276
- display: block;
8280
+ .pf-c-dual-list-selector__item {
8281
+ position: relative;
8277
8282
  width: 100%;
8278
- padding: var(--pf-c-dropdown__menu-item--PaddingTop) var(--pf-c-dropdown__menu-item--PaddingRight) var(--pf-c-dropdown__menu-item--PaddingBottom) var(--pf-c-dropdown__menu-item--PaddingLeft);
8279
- font-size: var(--pf-c-dropdown__menu-item--FontSize);
8280
- font-weight: var(--pf-c-dropdown__menu-item--FontWeight);
8281
- line-height: var(--pf-c-dropdown__menu-item--LineHeight);
8282
- color: var(--pf-c-dropdown__menu-item--Color);
8283
- text-align: left;
8284
- white-space: nowrap;
8285
- background-color: var(--pf-c-dropdown__menu-item--BackgroundColor);
8286
- border: none;
8283
+ padding: var(--pf-c-dual-list-selector__item--PaddingTop) var(--pf-c-dual-list-selector__item--PaddingRight) var(--pf-c-dual-list-selector__item--PaddingBottom) var(--pf-c-dual-list-selector__item--PaddingLeft);
8284
+ cursor: pointer;
8287
8285
  }
8288
8286
 
8289
- .pf-c-dropdown__menu-item:hover, .pf-c-dropdown__menu-item:focus {
8290
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--hover--Color);
8291
- --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--hover--BackgroundColor);
8292
- text-decoration: none;
8287
+ .pf-c-dual-list-selector__item-count {
8288
+ margin-left: var(--pf-c-dual-list-selector__item-count--Marginleft);
8293
8289
  }
8294
8290
 
8295
- .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled, .pf-c-dropdown__menu-item.pf-m-aria-disabled {
8296
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--disabled--Color);
8297
- --pf-c-dropdown__menu-item--BackgroundColor: var(--pf-c-dropdown__menu-item--disabled--BackgroundColor);
8291
+ .pf-c-dual-list-selector__item-count .pf-c-badge.pf-m-read {
8292
+ --pf-c-badge--m-read--BackgroundColor: var(--pf-c-dual-list-selector__item--c-badge--m-read--BackgroundColor);
8298
8293
  }
8299
8294
 
8300
- .pf-c-dropdown__menu-item:disabled, .pf-c-dropdown__menu-item.pf-m-disabled {
8301
- pointer-events: none;
8295
+ .pf-c-dual-list-selector__item-text {
8296
+ overflow: hidden;
8297
+ text-overflow: ellipsis;
8298
+ white-space: nowrap;
8299
+ flex-grow: 1;
8300
+ color: var(--pf-c-dual-list-selector__item-text--Color);
8302
8301
  }
8303
8302
 
8304
- .pf-c-dropdown__menu-item.pf-m-aria-disabled {
8305
- cursor: default;
8303
+ .pf-c-dual-list-selector__controls {
8304
+ grid-area: var(--pf-c-dual-list-selector__controls--GridArea);
8305
+ align-self: center;
8306
+ padding-right: var(--pf-c-dual-list-selector__controls--PaddingRight);
8307
+ padding-left: var(--pf-c-dual-list-selector__controls--PaddingLeft);
8306
8308
  }
8307
8309
 
8308
- .pf-c-dropdown__menu-item.pf-m-icon {
8310
+ .pf-c-dual-list-selector__item-main {
8309
8311
  display: flex;
8310
- align-items: center;
8312
+ min-width: 0;
8311
8313
  }
8312
8314
 
8313
- .pf-c-dropdown__menu-item.pf-m-icon.pf-m-description {
8314
- flex-direction: column;
8315
- align-items: start;
8315
+ .pf-c-dual-list-selector__item-toggle {
8316
+ padding: var(--pf-c-dual-list-selector__item-toggle--PaddingTop) var(--pf-c-dual-list-selector__item-toggle--PaddingRight) var(--pf-c-dual-list-selector__item-toggle--PaddingBottom) var(--pf-c-dual-list-selector__item-toggle--PaddingLeft);
8317
+ margin-top: var(--pf-c-dual-list-selector__item-toggle--MarginTop);
8318
+ margin-bottom: var(--pf-c-dual-list-selector__item-toggle--MarginBottom);
8316
8319
  }
8317
8320
 
8318
- .pf-c-dropdown__menu-item.pf-m-icon .pf-c-dropdown__menu-item-main {
8321
+ .pf-c-dual-list-selector__item-check {
8319
8322
  display: flex;
8320
8323
  align-items: center;
8324
+ margin-right: var(--pf-c-dual-list-selector__item-check--MarginRight);
8321
8325
  }
8322
8326
 
8323
- .pf-c-dropdown__menu-item.pf-m-text {
8324
- --pf-c-dropdown__menu-item--Color: var(--pf-c-dropdown__menu-item--m-text--Color);
8327
+ .pf-c-dual-list-selector__item-toggle-icon {
8328
+ display: inline-block;
8329
+ min-width: var(--pf-c-dual-list-selector__item-toggle-icon--MinWidth);
8330
+ color: var(--pf-c-dual-list-selector__item-toggle-icon--Color, inherit);
8331
+ text-align: center;
8332
+ transition: var(--pf-c-dual-list-selector__item-toggle-icon--Transition);
8333
+ transform: rotate(var(--pf-c-dual-list-selector__item-toggle-icon--Rotate));
8325
8334
  }
8326
8335
 
8327
- .pf-c-dropdown__menu-item.pf-m-text:hover, .pf-c-dropdown__menu-item.pf-m-text:focus {
8328
- --pf-c-dropdown__menu-item--BackgroundColor: transparent;
8336
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8337
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 1 + var(--pf-c-dual-list-selector__item--indent--base));
8338
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8329
8339
  }
8330
8340
 
8331
- .pf-c-dropdown__menu-item-icon {
8332
- display: inline-flex;
8333
- align-items: center;
8334
- justify-content: center;
8335
- width: var(--pf-c-dropdown__menu-item-icon--Width);
8336
- height: var(--pf-c-dropdown__menu-item-icon--Height);
8337
- margin-right: var(--pf-c-dropdown__menu-item-icon--MarginRight);
8341
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8342
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 2 + var(--pf-c-dual-list-selector__item--indent--base));
8343
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8338
8344
  }
8339
8345
 
8340
- .pf-c-dropdown__menu-item-icon > * {
8341
- max-width: 100%;
8342
- max-height: 100%;
8346
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8347
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 3 + var(--pf-c-dual-list-selector__item--indent--base));
8348
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8343
8349
  }
8344
8350
 
8345
- .pf-c-dropdown__menu-item-description {
8346
- font-size: var(--pf-c-dropdown__menu-item-description--FontSize);
8347
- color: var(--pf-c-dropdown__menu-item-description--Color);
8351
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8352
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 4 + var(--pf-c-dual-list-selector__item--indent--base));
8353
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8348
8354
  }
8349
8355
 
8350
- .pf-c-dropdown__group + .pf-c-dropdown__group {
8351
- padding-top: var(--pf-c-dropdown__group--group--PaddingTop);
8356
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8357
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 5 + var(--pf-c-dual-list-selector__item--indent--base));
8358
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8352
8359
  }
8353
8360
 
8354
- .pf-c-dropdown__group-title {
8355
- padding-top: var(--pf-c-dropdown__group-title--PaddingTop);
8356
- padding-right: var(--pf-c-dropdown__group-title--PaddingRight);
8357
- padding-bottom: var(--pf-c-dropdown__group-title--PaddingBottom);
8358
- padding-left: var(--pf-c-dropdown__group-title--PaddingLeft);
8359
- font-size: var(--pf-c-dropdown__group-title--FontSize);
8360
- font-weight: var(--pf-c-dropdown__group-title--FontWeight);
8361
- color: var(--pf-c-dropdown__group-title--Color);
8361
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8362
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 6 + var(--pf-c-dual-list-selector__item--indent--base));
8363
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8362
8364
  }
8363
8365
 
8364
- :where(.pf-theme-dark) .pf-c-dropdown {
8365
- --pf-c-dropdown__toggle--BackgroundColor: var(--pf-global--BackgroundColor--400);
8366
- --pf-c-dropdown__toggle--before--BorderTopColor: transparent;
8367
- --pf-c-dropdown__toggle--before--BorderRightColor: transparent;
8368
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-global--BorderColor--400);
8369
- --pf-c-dropdown__toggle--before--BorderLeftColor: transparent;
8370
- --pf-c-dropdown__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
8371
- --pf-c-dropdown__toggle--m-primary--BackgroundColor: var(--pf-global--primary-color--300);
8372
- --pf-c-dropdown__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
8373
- --pf-c-dropdown__menu--Top: 100%;
8374
- --pf-c-dropdown--m-top__menu--TranslateY: -100%;
8375
- --pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
8366
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8367
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 7 + var(--pf-c-dual-list-selector__item--indent--base));
8368
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8376
8369
  }
8377
8370
 
8378
- :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain):disabled, :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain).pf-m-disabled {
8379
- color: var(--pf-global--palette--black-100);
8371
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8372
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 8 + var(--pf-c-dual-list-selector__item--indent--base));
8373
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8380
8374
  }
8381
8375
 
8382
- :where(.pf-theme-dark) .pf-c-dropdown__toggle.pf-m-plain {
8383
- background: transparent;
8376
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8377
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 9 + var(--pf-c-dual-list-selector__item--indent--base));
8378
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8379
+ }
8380
+
8381
+ .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item .pf-c-dual-list-selector__list-item {
8382
+ --pf-c-dual-list-selector__item--PaddingLeft: calc(var(--pf-c-dual-list-selector__item--nested-indent--base) * 10 + var(--pf-c-dual-list-selector__item--indent--base));
8383
+ --pf-c-dual-list-selector__list__list__item-toggle--Left: var(--pf-c-dual-list-selector__item--PaddingLeft);
8384
8384
  }
8385
8385
 
8386
8386
  .pf-c-empty-state {
@@ -13695,16 +13695,6 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
13695
13695
  color: var(--pf-c-multiple-file-upload__status-item-progress-size--Color);
13696
13696
  }
13697
13697
 
13698
- .pf-l-bullseye {
13699
- --pf-l-bullseye--Padding: 0;
13700
- display: flex;
13701
- align-items: center;
13702
- justify-content: center;
13703
- height: 100%;
13704
- padding: var(--pf-l-bullseye--Padding);
13705
- margin: 0;
13706
- }
13707
-
13708
13698
  .pf-c-nav {
13709
13699
  --pf-c-nav--Transition: var(--pf-global--Transition);
13710
13700
  --pf-c-nav--m-light__item--before--BorderColor: var(--pf-global--BorderColor--300);
@@ -15164,6 +15154,16 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
15164
15154
  --pf-c-notification-drawer__group-toggle--BackgroundColor: var(--pf-global--BackgroundColor--300);
15165
15155
  }
15166
15156
 
15157
+ .pf-l-bullseye {
15158
+ --pf-l-bullseye--Padding: 0;
15159
+ display: flex;
15160
+ align-items: center;
15161
+ justify-content: center;
15162
+ height: 100%;
15163
+ padding: var(--pf-l-bullseye--Padding);
15164
+ margin: 0;
15165
+ }
15166
+
15167
15167
  .pf-c-options-menu {
15168
15168
  --pf-c-options-menu__toggle--BackgroundColor: transparent;
15169
15169
  --pf-c-options-menu__toggle--PaddingTop: var(--pf-global--spacer--form-element);
@@ -16667,6 +16667,11 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16667
16667
  }
16668
16668
 
16669
16669
  .pf-c-pagination {
16670
+ --pf-c-pagination--inset: 0;
16671
+ --pf-c-pagination--PaddingRight: var(--pf-c-pagination--inset);
16672
+ --pf-c-pagination--PaddingLeft: var(--pf-c-pagination--inset);
16673
+ --pf-c-pagination--m-page-insets--inset: var(--pf-global--spacer--md);
16674
+ --pf-c-pagination--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
16670
16675
  --pf-c-pagination--child--MarginRight: var(--pf-global--spacer--lg);
16671
16676
  --pf-c-pagination--m-bottom--child--MarginRight: 0;
16672
16677
  --pf-c-pagination--m-bottom--child--md--MarginRight: var(--pf-global--spacer--lg);
@@ -16731,6 +16736,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16731
16736
  flex-wrap: wrap;
16732
16737
  align-items: center;
16733
16738
  justify-content: flex-end;
16739
+ padding-right: var(--pf-c-pagination--PaddingRight);
16740
+ padding-left: var(--pf-c-pagination--PaddingLeft);
16734
16741
  }
16735
16742
 
16736
16743
  @media screen and (min-width: 768px) {
@@ -16754,6 +16761,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16754
16761
  .pf-c-pagination {
16755
16762
  --pf-c-pagination--m-bottom--md--PaddingRight: var(--pf-c-pagination--m-bottom--xl--PaddingRight);
16756
16763
  --pf-c-pagination--m-bottom--md--PaddingLeft: var(--pf-c-pagination--m-bottom--xl--PaddingLeft);
16764
+ --pf-c-pagination__scroll-button--Width: var(--pf-c-pagination__scroll-button--xl--Width);
16765
+ --pf-c-pagination--m-page-insets--inset: var(--pf-c-pagination--m-page-insets--xl--inset);
16757
16766
  }
16758
16767
  }
16759
16768
  .pf-c-pagination > *:not(:last-child):not(.pf-c-pagination__total-items) {
@@ -16863,6 +16872,10 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16863
16872
  --pf-c-pagination--child--MarginRight: var(--pf-c-pagination--m-compact--child--MarginRight);
16864
16873
  }
16865
16874
 
16875
+ .pf-c-pagination.pf-m-page-insets {
16876
+ --pf-c-pagination--inset: var(--pf-c-pagination--m-page-insets--inset);
16877
+ }
16878
+
16866
16879
  .pf-c-pagination__nav {
16867
16880
  display: var(--pf-c-pagination__nav--Display);
16868
16881
  justify-content: flex-end;
@@ -16922,6 +16935,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16922
16935
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16923
16936
  }
16924
16937
 
16938
+ .pf-c-pagination.pf-m-inset-none {
16939
+ --pf-c-pagination--inset: 0;
16940
+ }
16941
+
16942
+ .pf-c-pagination.pf-m-inset-sm {
16943
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
16944
+ }
16945
+
16946
+ .pf-c-pagination.pf-m-inset-md {
16947
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
16948
+ }
16949
+
16950
+ .pf-c-pagination.pf-m-inset-lg {
16951
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
16952
+ }
16953
+
16954
+ .pf-c-pagination.pf-m-inset-xl {
16955
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
16956
+ }
16957
+
16958
+ .pf-c-pagination.pf-m-inset-2xl {
16959
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
16960
+ }
16961
+
16925
16962
  @media (min-width: 576px) {
16926
16963
  .pf-c-pagination.pf-m-display-summary-on-sm {
16927
16964
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
@@ -16940,6 +16977,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16940
16977
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
16941
16978
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16942
16979
  }
16980
+
16981
+ .pf-c-pagination.pf-m-inset-none-on-sm {
16982
+ --pf-c-pagination--inset: 0;
16983
+ }
16984
+
16985
+ .pf-c-pagination.pf-m-inset-sm-on-sm {
16986
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
16987
+ }
16988
+
16989
+ .pf-c-pagination.pf-m-inset-md-on-sm {
16990
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
16991
+ }
16992
+
16993
+ .pf-c-pagination.pf-m-inset-lg-on-sm {
16994
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
16995
+ }
16996
+
16997
+ .pf-c-pagination.pf-m-inset-xl-on-sm {
16998
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
16999
+ }
17000
+
17001
+ .pf-c-pagination.pf-m-inset-2xl-on-sm {
17002
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17003
+ }
16943
17004
  }
16944
17005
  @media (min-width: 768px) {
16945
17006
  .pf-c-pagination.pf-m-display-summary-on-md {
@@ -16959,6 +17020,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16959
17020
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
16960
17021
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16961
17022
  }
17023
+
17024
+ .pf-c-pagination.pf-m-inset-none-on-md {
17025
+ --pf-c-pagination--inset: 0;
17026
+ }
17027
+
17028
+ .pf-c-pagination.pf-m-inset-sm-on-md {
17029
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
17030
+ }
17031
+
17032
+ .pf-c-pagination.pf-m-inset-md-on-md {
17033
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
17034
+ }
17035
+
17036
+ .pf-c-pagination.pf-m-inset-lg-on-md {
17037
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
17038
+ }
17039
+
17040
+ .pf-c-pagination.pf-m-inset-xl-on-md {
17041
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
17042
+ }
17043
+
17044
+ .pf-c-pagination.pf-m-inset-2xl-on-md {
17045
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17046
+ }
16962
17047
  }
16963
17048
  @media (min-width: 992px) {
16964
17049
  .pf-c-pagination.pf-m-display-summary-on-lg {
@@ -16978,6 +17063,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16978
17063
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
16979
17064
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16980
17065
  }
17066
+
17067
+ .pf-c-pagination.pf-m-inset-none-on-lg {
17068
+ --pf-c-pagination--inset: 0;
17069
+ }
17070
+
17071
+ .pf-c-pagination.pf-m-inset-sm-on-lg {
17072
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
17073
+ }
17074
+
17075
+ .pf-c-pagination.pf-m-inset-md-on-lg {
17076
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
17077
+ }
17078
+
17079
+ .pf-c-pagination.pf-m-inset-lg-on-lg {
17080
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
17081
+ }
17082
+
17083
+ .pf-c-pagination.pf-m-inset-xl-on-lg {
17084
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
17085
+ }
17086
+
17087
+ .pf-c-pagination.pf-m-inset-2xl-on-lg {
17088
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17089
+ }
16981
17090
  }
16982
17091
  @media (min-width: 1200px) {
16983
17092
  .pf-c-pagination.pf-m-display-summary-on-xl {
@@ -16997,6 +17106,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16997
17106
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
16998
17107
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
16999
17108
  }
17109
+
17110
+ .pf-c-pagination.pf-m-inset-none-on-xl {
17111
+ --pf-c-pagination--inset: 0;
17112
+ }
17113
+
17114
+ .pf-c-pagination.pf-m-inset-sm-on-xl {
17115
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
17116
+ }
17117
+
17118
+ .pf-c-pagination.pf-m-inset-md-on-xl {
17119
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
17120
+ }
17121
+
17122
+ .pf-c-pagination.pf-m-inset-lg-on-xl {
17123
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
17124
+ }
17125
+
17126
+ .pf-c-pagination.pf-m-inset-xl-on-xl {
17127
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
17128
+ }
17129
+
17130
+ .pf-c-pagination.pf-m-inset-2xl-on-xl {
17131
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17132
+ }
17000
17133
  }
17001
17134
  @media (min-width: 1450px) {
17002
17135
  .pf-c-pagination.pf-m-display-summary-on-2xl {
@@ -17016,6 +17149,30 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17016
17149
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
17017
17150
  --pf-c-pagination__total-items--Visibility: var(--pf-c-pagination--m-display-full__total-items--Visibility);
17018
17151
  }
17152
+
17153
+ .pf-c-pagination.pf-m-inset-none-on-2xl {
17154
+ --pf-c-pagination--inset: 0;
17155
+ }
17156
+
17157
+ .pf-c-pagination.pf-m-inset-sm-on-2xl {
17158
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
17159
+ }
17160
+
17161
+ .pf-c-pagination.pf-m-inset-md-on-2xl {
17162
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
17163
+ }
17164
+
17165
+ .pf-c-pagination.pf-m-inset-lg-on-2xl {
17166
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
17167
+ }
17168
+
17169
+ .pf-c-pagination.pf-m-inset-xl-on-2xl {
17170
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
17171
+ }
17172
+
17173
+ .pf-c-pagination.pf-m-inset-2xl-on-2xl {
17174
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
17175
+ }
17019
17176
  }
17020
17177
  :where(.pf-theme-dark) .pf-c-pagination {
17021
17178
  --pf-c-pagination--m-sticky--BackgroundColor: var(--pf-global--BackgroundColor--300);
@@ -19708,7 +19865,6 @@ svg.pf-c-spinner.pf-m-xl {
19708
19865
  --pf-c-tabs__list--Display: flex;
19709
19866
  --pf-c-tabs__list--Visibility: visible;
19710
19867
  --pf-c-tabs__item--m-action--before--ZIndex: var(--pf-global--ZIndex--xs);
19711
- --pf-c-tabs__item--m-action__link--PaddingRight: var(--pf-global--spacer--sm);
19712
19868
  --pf-c-tabs__link--Color: var(--pf-global--Color--200);
19713
19869
  --pf-c-tabs__link--FontSize: var(--pf-global--FontSize--md);
19714
19870
  --pf-c-tabs__link--BackgroundColor: transparent;
@@ -19725,8 +19881,9 @@ svg.pf-c-spinner.pf-m-xl {
19725
19881
  --pf-c-tabs--m-vertical__link--PaddingBottom: var(--pf-global--spacer--md);
19726
19882
  --pf-c-tabs--m-box__link--BackgroundColor: var(--pf-global--BackgroundColor--200);
19727
19883
  --pf-c-tabs--m-box__link--disabled--BackgroundColor: var(--pf-global--disabled-color--200);
19728
- --pf-c-tabs--m-box__item-close--c-button--disabled--BackgroundColor: var(--pf-global--palette--black-400);
19884
+ --pf-c-tabs--m-box__item-action--c-button--disabled--BackgroundColor: var(--pf-global--palette--black-400);
19729
19885
  --pf-c-tabs--m-secondary__link--FontSize: var(--pf-global--FontSize--sm);
19886
+ --pf-c-tabs__item--m-action__link--PaddingRight: var(--pf-global--spacer--xs);
19730
19887
  --pf-c-tabs__link--before--border-color--base: var(--pf-global--BorderColor--100);
19731
19888
  --pf-c-tabs__link--before--border-width--base: var(--pf-global--BorderWidth--sm);
19732
19889
  --pf-c-tabs__link--before--BorderTopColor: var(--pf-c-tabs__link--before--border-color--base);
@@ -19790,13 +19947,16 @@ svg.pf-c-spinner.pf-m-xl {
19790
19947
  --pf-c-tabs__toggle-button--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
19791
19948
  --pf-c-tabs--m-expanded__toggle-icon--Color: var(--pf-global--Color--100);
19792
19949
  --pf-c-tabs--m-expanded__toggle-icon--Rotate: 90deg;
19793
- --pf-c-tabs__item-close--c-button--FontSize: var(--pf-global--FontSize--xs);
19794
- --pf-c-tabs--m-secondary__item-close--c-button--FontSize: var(--pf-global--icon--FontSize--sm);
19795
- --pf-c-tabs__item-close--c-button--PaddingTop: var(--pf-global--spacer--sm);
19796
- --pf-c-tabs__item-close--c-button--PaddingBottom: var(--pf-global--spacer--sm);
19797
- --pf-c-tabs__item-close--c-button--PaddingLeft: var(--pf-global--spacer--sm);
19798
- --pf-c-tabs__item-close--c-button--OutlineOffset: -0.1875rem;
19799
- --pf-c-tabs__item-close-icon--MarginTop: 0.125rem;
19950
+ --pf-c-tabs__item-action--c-button--FontSize: var(--pf-global--FontSize--xs);
19951
+ --pf-c-tabs--m-secondary__item-action--c-button--FontSize: var(--pf-global--icon--FontSize--sm);
19952
+ --pf-c-tabs__item-action--c-button--PaddingTop: var(--pf-global--spacer--sm);
19953
+ --pf-c-tabs__item-action--c-button--PaddingRight: var(--pf-global--spacer--sm);
19954
+ --pf-c-tabs__item-action--c-button--PaddingBottom: var(--pf-global--spacer--sm);
19955
+ --pf-c-tabs__item-action--c-button--PaddingLeft: var(--pf-global--spacer--sm);
19956
+ --pf-c-tabs__item-action--last-child--c-button--PaddingRight: var(--pf-global--spacer--md);
19957
+ --pf-c-tabs__item-action--c-button--OutlineOffset: -0.1875rem;
19958
+ --pf-c-tabs__item-action-icon--MarginTop: 0.125rem;
19959
+ --pf-c-tabs__item-action--m-help--c-button--PaddingLeft: var(--pf-global--spacer--xs);
19800
19960
  --pf-c-tabs__add--before--BorderColor: var(--pf-c-tabs__link--before--border-color--base);
19801
19961
  --pf-c-tabs__add--before--BorderLeftWidth: var(--pf-c-tabs__link--before--border-width--base);
19802
19962
  --pf-c-tabs__add--c-button--FontSize: var(--pf-global--FontSize--sm);
@@ -19934,8 +20094,8 @@ svg.pf-c-spinner.pf-m-xl {
19934
20094
  --pf-c-tabs__link--disabled--BackgroundColor: var(--pf-c-tabs--m-color-scheme--light-300__link--disabled--BackgroundColor);
19935
20095
  }
19936
20096
 
19937
- .pf-c-tabs.pf-m-box .pf-c-tabs__item-close .pf-c-button {
19938
- --pf-c-button--m-plain--disabled--Color: var(--pf-c-tabs--m-box__item-close--c-button--disabled--BackgroundColor);
20097
+ .pf-c-tabs.pf-m-box .pf-c-tabs__item-action .pf-c-button {
20098
+ --pf-c-button--m-plain--disabled--Color: var(--pf-c-tabs--m-box__item-action--c-button--disabled--BackgroundColor);
19939
20099
  }
19940
20100
 
19941
20101
  .pf-c-tabs.pf-m-vertical {
@@ -20133,7 +20293,7 @@ svg.pf-c-spinner.pf-m-xl {
20133
20293
 
20134
20294
  .pf-c-tabs.pf-m-secondary {
20135
20295
  --pf-c-tabs__link--FontSize: var(--pf-c-tabs--m-secondary__link--FontSize);
20136
- --pf-c-tabs__item-close--c-button--FontSize: var(--pf-c-tabs--m-secondary__item-close--c-button--FontSize);
20296
+ --pf-c-tabs__item-action--c-button--FontSize: var(--pf-c-tabs--m-secondary__item-action--c-button--FontSize);
20137
20297
  --pf-c-tabs__add--c-button--FontSize: var(--pf-c-tabs--m-secondary__add--c-button--FontSize);
20138
20298
  }
20139
20299
 
@@ -20353,21 +20513,30 @@ svg.pf-c-spinner.pf-m-xl {
20353
20513
  transform: rotate(var(--pf-c-tabs__link-toggle-icon--Rotate));
20354
20514
  }
20355
20515
 
20356
- .pf-c-tabs__item-close {
20516
+ .pf-c-tabs__item-action {
20357
20517
  display: flex;
20358
20518
  }
20359
20519
 
20360
- .pf-c-tabs__item-close .pf-c-button {
20361
- --pf-c-button--FontSize: var(--pf-c-tabs__item-close--c-button--FontSize);
20362
- --pf-c-button--PaddingTop: var(--pf-c-tabs__item-close--c-button--PaddingTop);
20363
- --pf-c-button--PaddingBottom: var(--pf-c-tabs__item-close--c-button--PaddingBottom);
20364
- --pf-c-button--PaddingLeft: var(--pf-c-tabs__item-close--c-button--PaddingLeft);
20365
- outline-offset: var(--pf-c-tabs__item-close--c-button--OutlineOffset);
20520
+ .pf-c-tabs__item-action .pf-c-button {
20521
+ --pf-c-button--FontSize: var(--pf-c-tabs__item-action--c-button--FontSize);
20522
+ --pf-c-button--PaddingTop: var(--pf-c-tabs__item-action--c-button--PaddingTop);
20523
+ --pf-c-button--PaddingRight: var(--pf-c-tabs__item-action--c-button--PaddingRight);
20524
+ --pf-c-button--PaddingBottom: var(--pf-c-tabs__item-action--c-button--PaddingBottom);
20525
+ --pf-c-button--PaddingLeft: var(--pf-c-tabs__item-action--c-button--PaddingLeft);
20526
+ outline-offset: var(--pf-c-tabs__item-action--c-button--OutlineOffset);
20527
+ }
20528
+
20529
+ .pf-c-tabs__item-action.pf-m-help {
20530
+ --pf-c-tabs__item-action--c-button--PaddingLeft: var(--pf-c-tabs__item-action--m-help--c-button--PaddingLeft);
20531
+ }
20532
+
20533
+ .pf-c-tabs__item-action:last-child {
20534
+ --pf-c-tabs__item-action--c-button--PaddingRight: var(--pf-c-tabs__item-action--last-child--c-button--PaddingRight);
20366
20535
  }
20367
20536
 
20368
- .pf-c-tabs__item-close-icon {
20537
+ .pf-c-tabs__item-action-icon {
20369
20538
  display: inline-block;
20370
- margin-top: var(--pf-c-tabs__item-close-icon--MarginTop);
20539
+ margin-top: var(--pf-c-tabs__item-action-icon--MarginTop);
20371
20540
  }
20372
20541
 
20373
20542
  .pf-c-tabs__scroll-button {