@patternfly/react-templates 6.3.1-prerelease.5 → 6.3.1-prerelease.7

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.
@@ -558,775 +558,313 @@
558
558
  color: var(--pf-v6-c-menu-toggle__status-icon--Color, inherit);
559
559
  }
560
560
 
561
- .pf-v6-c-label {
562
- --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
563
- --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
564
- --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
565
- --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
566
- --pf-v6-c-label--MaxWidth: 100%;
567
- --pf-v6-c-label--MinWidth: calc((var(--pf-v6-c-label--FontSize) * var(--pf-t--global--font--line-height--body) + var(--pf-v6-c-label--PaddingBlockStart) + var(--pf-v6-c-label--PaddingBlockEnd)));
568
- --pf-v6-c-label--BorderWidth: 0;
569
- --pf-v6-c-label--BorderColor: transparent;
570
- --pf-v6-c-label--BorderRadius: var(--pf-t--global--border--radius--pill);
571
- --pf-v6-c-label--FontSize: var(--pf-t--global--font--size--body--sm);
572
- --pf-v6-c-label--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
573
- --pf-v6-c-label--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
574
- --pf-v6-c-label__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
575
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--hover);
576
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-gray--hover);
577
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--hover);
578
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--default);
579
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--hover);
580
- --pf-v6-c-label--m-blue--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--default);
581
- --pf-v6-c-label--m-blue--Color: var(--pf-t--global--text--color--nonstatus--on-blue--default);
582
- --pf-v6-c-label--m-blue__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--default);
583
- --pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--hover);
584
- --pf-v6-c-label--m-blue--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-blue--hover);
585
- --pf-v6-c-label--m-blue--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--hover);
586
- --pf-v6-c-label--m-blue--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--default);
587
- --pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--hover);
588
- --pf-v6-c-label--m-red--BackgroundColor: var(--pf-t--global--color--nonstatus--red--default);
589
- --pf-v6-c-label--m-red--Color: var(--pf-t--global--text--color--nonstatus--on-red--default);
590
- --pf-v6-c-label--m-red__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--default);
591
- --pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--red--hover);
592
- --pf-v6-c-label--m-red--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-red--hover);
593
- --pf-v6-c-label--m-red--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--hover);
594
- --pf-v6-c-label--m-red--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--red--default);
595
- --pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--red--hover);
596
- --pf-v6-c-label--m-orange--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--default);
597
- --pf-v6-c-label--m-orange--Color: var(--pf-t--global--text--color--nonstatus--on-orange--default);
598
- --pf-v6-c-label--m-orange__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--default);
599
- --pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--hover);
600
- --pf-v6-c-label--m-orange--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orange--hover);
601
- --pf-v6-c-label--m-orange--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--hover);
602
- --pf-v6-c-label--m-orange--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--default);
603
- --pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--hover);
604
- --pf-v6-c-label--m-orangered--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--default);
605
- --pf-v6-c-label--m-orangered--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--default);
606
- --pf-v6-c-label--m-orangered__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--default);
607
- --pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--hover);
608
- --pf-v6-c-label--m-orangered--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--hover);
609
- --pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--hover);
610
- --pf-v6-c-label--m-orangered--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--default);
611
- --pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--hover);
612
- --pf-v6-c-label--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
613
- --pf-v6-c-label--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
614
- --pf-v6-c-label--m-yellow__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--default);
615
- --pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--hover);
616
- --pf-v6-c-label--m-yellow--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--hover);
617
- --pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--hover);
618
- --pf-v6-c-label--m-yellow--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--default);
619
- --pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--hover);
620
- --pf-v6-c-label--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
621
- --pf-v6-c-label--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
622
- --pf-v6-c-label--m-green__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--default);
623
- --pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--green--hover);
624
- --pf-v6-c-label--m-green--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-green--hover);
625
- --pf-v6-c-label--m-green--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--hover);
626
- --pf-v6-c-label--m-green--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--green--default);
627
- --pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--green--hover);
628
- --pf-v6-c-label--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
629
- --pf-v6-c-label--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
630
- --pf-v6-c-label--m-teal__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--default);
631
- --pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--hover);
632
- --pf-v6-c-label--m-teal--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-teal--hover);
633
- --pf-v6-c-label--m-teal--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--hover);
634
- --pf-v6-c-label--m-teal--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--default);
635
- --pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--hover);
636
- --pf-v6-c-label--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
637
- --pf-v6-c-label--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
638
- --pf-v6-c-label--m-purple__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--default);
639
- --pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--hover);
640
- --pf-v6-c-label--m-purple--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-purple--hover);
641
- --pf-v6-c-label--m-purple--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--hover);
642
- --pf-v6-c-label--m-purple--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--default);
643
- --pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--hover);
644
- --pf-v6-c-label--m-success--BackgroundColor: var(--pf-t--global--color--status--success--default);
645
- --pf-v6-c-label--m-success--Color: var(--pf-t--global--text--color--status--on-success--default);
646
- --pf-v6-c-label--m-success__icon--Color: var(--pf-t--global--icon--color--status--on-success--default);
647
- --pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--success--hover);
648
- --pf-v6-c-label--m-success--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-success--hover);
649
- --pf-v6-c-label--m-success--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-success--hover);
650
- --pf-v6-c-label--m-success--m-outline__icon--Color: var(--pf-t--global--icon--color--status--success--default);
651
- --pf-v6-c-label--m-success--m-outline--BorderColor: var(--pf-t--global--border--color--status--success--default);
652
- --pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--success--hover);
653
- --pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--success--hover);
654
- --pf-v6-c-label--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
655
- --pf-v6-c-label--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
656
- --pf-v6-c-label--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
657
- --pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
658
- --pf-v6-c-label--m-warning--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
659
- --pf-v6-c-label--m-warning--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
660
- --pf-v6-c-label--m-warning--m-outline__icon--Color: var(--pf-t--global--icon--color--status--warning--default);
661
- --pf-v6-c-label--m-warning--m-outline--BorderColor: var(--pf-t--global--border--color--status--warning--default);
662
- --pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
663
- --pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--warning--hover);
664
- --pf-v6-c-label--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
665
- --pf-v6-c-label--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
666
- --pf-v6-c-label--m-danger__icon--Color: var(--pf-t--global--icon--color--status--on-danger--default);
667
- --pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
668
- --pf-v6-c-label--m-danger--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-danger--hover);
669
- --pf-v6-c-label--m-danger--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-danger--hover);
670
- --pf-v6-c-label--m-danger--m-outline__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
671
- --pf-v6-c-label--m-danger--m-outline--BorderColor: var(--pf-t--global--border--color--status--danger--default);
672
- --pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
673
- --pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
674
- --pf-v6-c-label--m-info--BackgroundColor: var(--pf-t--global--color--status--info--default);
675
- --pf-v6-c-label--m-info--Color: var(--pf-t--global--text--color--status--on-info--default);
676
- --pf-v6-c-label--m-info__icon--Color: var(--pf-t--global--icon--color--status--on-info--default);
677
- --pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--info--hover);
678
- --pf-v6-c-label--m-info--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-info--hover);
679
- --pf-v6-c-label--m-info--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-info--hover);
680
- --pf-v6-c-label--m-info--m-outline__icon--Color: var(--pf-t--global--icon--color--status--info--default);
681
- --pf-v6-c-label--m-info--m-outline--BorderColor: var(--pf-t--global--border--color--status--info--default);
682
- --pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--info--hover);
683
- --pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--info--hover);
684
- --pf-v6-c-label--m-custom--BackgroundColor: var(--pf-t--global--color--status--custom--default);
685
- --pf-v6-c-label--m-custom--Color: var(--pf-t--global--text--color--status--on-custom--default);
686
- --pf-v6-c-label--m-custom__icon--Color: var(--pf-t--global--icon--color--status--on-custom--default);
687
- --pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--custom--hover);
688
- --pf-v6-c-label--m-custom--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-custom--hover);
689
- --pf-v6-c-label--m-custom--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-custom--hover);
690
- --pf-v6-c-label--m-custom--m-outline__icon--Color: var(--pf-t--global--icon--color--status--custom--default);
691
- --pf-v6-c-label--m-custom--m-outline--BorderColor: var(--pf-t--global--border--color--status--custom--default);
692
- --pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--custom--hover);
693
- --pf-v6-c-label--m-custom--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--custom--hover);
694
- --pf-v6-c-label--m-clickable--hover--BorderWidth: 0;
695
- --pf-v6-c-label--m-clickable--hover--BorderColor: transparent;
696
- --pf-v6-c-label--m-clickable__content--Cursor: pointer;
697
- --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label__icon--Color);
698
- --pf-v6-c-label--m-outline--BorderWidth: var(--pf-t--global--border--width--action--default);
699
- --pf-v6-c-label--m-outline--BackgroundColor: transparent;
700
- --pf-v6-c-label--m-outline--Color: var(--pf-t--global--text--color--regular);
701
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-t--global--icon--color--regular);
702
- --pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor: transparent;
703
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
704
- --pf-v6-c-label--m-outline--m-clickable--hover--Color: var(--pf-t--global--text--color--regular);
705
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--regular);
706
- --pf-v6-c-label--m-overflow--Color: var(--pf-t--global--text--color--brand--default);
707
- --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
708
- --pf-v6-c-label--m-overflow--hover--Color: var(--pf-t--global--text--color--brand--hover);
709
- --pf-v6-c-label--m-overflow--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
710
- --pf-v6-c-label--m-add--Color: var(--pf-t--global--text--color--brand--default);
711
- --pf-v6-c-label--m-add--BackgroundColor: transparent;
712
- --pf-v6-c-label--m-add--BorderColor: var(--pf-t--global--border--color--default);
713
- --pf-v6-c-label--m-add--BorderWidth: var(--pf-t--global--border--width--action--default);
714
- --pf-v6-c-label--m-add--hover--Color: var(--pf-t--global--text--color--brand--hover);
715
- --pf-v6-c-label--m-add--hover--BackgroundColor: transparent;
716
- --pf-v6-c-label--m-add--hover--BorderColor: var(--pf-t--global--border--color--hover);
717
- --pf-v6-c-label--m-add--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
718
- --pf-v6-c-label--m-compact--PaddingBlockStart: 0;
719
- --pf-v6-c-label--m-compact--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
720
- --pf-v6-c-label--m-compact--PaddingBlockEnd: 0;
721
- --pf-v6-c-label--m-compact--PaddingInlineStart: var(--pf-t--global--spacer--sm);
722
- --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
723
- --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
724
- --pf-v6-c-label--m-compact--MinWidth: calc((var(--pf-v6-c-label--m-compact--FontSize) * var(--pf-t--global--font--line-height--body)) + (var(--pf-v6-c-label--m-compact--PaddingBlockStart) + var(--pf-v6-c-label--m-compact--PaddingBlockEnd)));
725
- --pf-v6-c-label__content--MaxWidth: 100%;
726
- --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
727
- --pf-v6-c-label__content--Cursor: initial;
728
- --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
729
- --pf-v6-c-label__text--MaxWidth: 100%;
730
- --pf-v6-c-label__actions--MarginInlineEnd: calc(var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd) * -1);
731
- --pf-v6-c-label__actions--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
732
- --pf-v6-c-label__actions--c-button--OutlineOffset: -0.1875rem;
733
- --pf-v6-c-label__actions--c-button--MarginBlockStart: calc(var(--pf-v6-c-label__actions--c-button--PaddingBlockStart) * -1);
734
- --pf-v6-c-label__actions--c-button--MarginBlockEnd: calc(var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd) * -1);
735
- --pf-v6-c-label__actions--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
736
- --pf-v6-c-label__actions--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
737
- --pf-v6-c-label__actions--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
738
- --pf-v6-c-label__actions--c-button--PaddingInlineStart: var(--pf-t--global--spacer--xs);
739
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--default);
740
- --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--default);
741
- --pf-v6-c-label--m-editable--hover--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--hover);
742
- --pf-v6-c-label--m-editable--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--hover);
743
- --pf-v6-c-label--m-editable--TextUnderlineOffset: 0.25rem;
744
- --pf-v6-c-label--m-editable__content--MaxWidth: 16ch;
745
- --pf-v6-c-label--m-editable__content--Cursor: pointer;
746
- --pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine: none;
747
- --pf-v6-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
748
- --pf-v6-c-label--m-editable--m-editable-active--Color: var(--pf-t--global--text--color--regular);
749
- --pf-v6-c-label--m-editable--m-editable-active__content--Cursor: initial;
750
- --pf-v6-c-label--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
751
- --pf-v6-c-label--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
752
- --pf-v6-c-label--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
753
- --pf-v6-c-label--m-disabled--c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
754
- }
755
-
756
- .pf-v6-c-label {
757
- position: relative;
758
- min-width: var(--pf-v6-c-label--MinWidth);
759
- max-width: var(--pf-v6-c-label--MaxWidth);
760
- padding-block-start: var(--pf-v6-c-label--PaddingBlockStart);
761
- padding-block-end: var(--pf-v6-c-label--PaddingBlockEnd);
762
- padding-inline-start: var(--pf-v6-c-label--PaddingInlineStart);
763
- padding-inline-end: var(--pf-v6-c-label--PaddingInlineEnd);
764
- font-size: var(--pf-v6-c-label--FontSize);
765
- white-space: nowrap;
766
- background: transparent;
767
- isolation: isolate;
768
- border: 0;
769
- border-radius: var(--pf-v6-c-label--BorderRadius);
770
- }
771
-
772
- .pf-v6-c-label.pf-m-blue {
773
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-blue--BackgroundColor);
774
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-blue--Color);
775
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-blue__icon--Color);
776
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor);
777
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover--Color);
778
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover__icon--Color);
779
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--BorderColor);
780
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor);
781
- }
782
-
783
- .pf-v6-c-label.pf-m-red {
784
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-red--BackgroundColor);
785
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-red--Color);
786
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-red__icon--Color);
787
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor);
788
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-red--m-clickable--hover--Color);
789
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-red--m-clickable--hover__icon--Color);
790
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-red--m-outline--BorderColor);
791
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor);
792
- }
793
-
794
- .pf-v6-c-label.pf-m-orange {
795
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orange--BackgroundColor);
796
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orange--Color);
797
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orange__icon--Color);
798
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor);
799
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover--Color);
800
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover__icon--Color);
801
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--BorderColor);
802
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor);
803
- }
804
-
805
- .pf-v6-c-label.pf-m-orangered {
806
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orangered--BackgroundColor);
807
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orangered--Color);
808
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orangered__icon--Color);
809
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor);
810
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover--Color);
811
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color);
812
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--BorderColor);
813
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor);
814
- }
815
-
816
- .pf-v6-c-label.pf-m-yellow {
817
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-yellow--BackgroundColor);
818
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-yellow--Color);
819
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-yellow__icon--Color);
820
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor);
821
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover--Color);
822
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color);
823
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--BorderColor);
824
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor);
825
- }
826
-
827
- .pf-v6-c-label.pf-m-green {
828
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-green--BackgroundColor);
829
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-green--Color);
830
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-green__icon--Color);
831
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor);
832
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-green--m-clickable--hover--Color);
833
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-green--m-clickable--hover__icon--Color);
834
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-green--m-outline--BorderColor);
835
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor);
836
- }
837
-
838
- .pf-v6-c-label.pf-m-teal {
839
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-teal--BackgroundColor);
840
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-teal--Color);
841
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-teal__icon--Color);
842
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor);
843
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover--Color);
844
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover__icon--Color);
845
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--BorderColor);
846
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor);
847
- }
848
-
849
- .pf-v6-c-label.pf-m-purple {
850
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-purple--BackgroundColor);
851
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-purple--Color);
852
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-purple__icon--Color);
853
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor);
854
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover--Color);
855
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover__icon--Color);
856
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--BorderColor);
857
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor);
858
- }
859
-
860
- .pf-v6-c-label.pf-m-success {
861
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-success--BackgroundColor);
862
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-success--Color);
863
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-success__icon--Color);
864
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor);
865
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-success--m-clickable--hover--Color);
866
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-clickable--hover__icon--Color);
867
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-success--m-outline__icon--Color);
868
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-success--m-outline--BorderColor);
869
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor);
870
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color);
871
- }
872
-
873
- .pf-v6-c-label.pf-m-warning {
874
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-warning--BackgroundColor);
875
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-warning--Color);
876
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-warning__icon--Color);
877
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor);
878
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover--Color);
879
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover__icon--Color);
880
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-warning--m-outline__icon--Color);
881
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--BorderColor);
882
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor);
883
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color);
884
- }
885
-
886
- .pf-v6-c-label.pf-m-danger {
887
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-danger--BackgroundColor);
888
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-danger--Color);
889
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-danger__icon--Color);
890
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor);
891
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover--Color);
892
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover__icon--Color);
893
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-danger--m-outline__icon--Color);
894
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--BorderColor);
895
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor);
896
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color);
897
- }
898
-
899
- .pf-v6-c-label.pf-m-info {
900
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-info--BackgroundColor);
901
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-info--Color);
902
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-info__icon--Color);
903
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor);
904
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-info--m-clickable--hover--Color);
905
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-clickable--hover__icon--Color);
906
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-info--m-outline__icon--Color);
907
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-info--m-outline--BorderColor);
908
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor);
909
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color);
910
- }
911
-
912
- .pf-v6-c-label.pf-m-custom {
913
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-custom--BackgroundColor);
914
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-custom--Color);
915
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-custom__icon--Color);
916
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor);
917
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover--Color);
918
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover__icon--Color);
919
- --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-custom--m-outline__icon--Color);
920
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--BorderColor);
921
- --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor);
922
- --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color);
923
- }
924
-
925
- .pf-v6-c-label.pf-m-compact {
926
- --pf-v6-c-label--PaddingBlockStart: var(--pf-v6-c-label--m-compact--PaddingBlockStart);
927
- --pf-v6-c-label--PaddingInlineEnd: var(--pf-v6-c-label--m-compact--PaddingInlineEnd);
928
- --pf-v6-c-label--PaddingBlockEnd: var(--pf-v6-c-label--m-compact--PaddingBlockEnd);
929
- --pf-v6-c-label--PaddingInlineStart: var(--pf-v6-c-label--m-compact--PaddingInlineStart);
930
- --pf-v6-c-label--FontSize: var(--pf-v6-c-label--m-compact--FontSize);
931
- --pf-v6-c-label--MinWidth: var(--pf-v6-c-label--m-compact--MinWidth);
932
- --pf-v6-c-label--m-editable--TextUnderlineOffset: var(--pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset);
933
- }
934
-
935
- .pf-v6-c-label.pf-m-filled .pf-v6-c-label__actions .pf-v6-c-button {
936
- --pf-v6-c-button__icon--Color: var(--pf-v6-c-label--m-filled__actions--c-button__icon--Color);
937
- }
938
-
939
- .pf-v6-c-label.pf-m-outline {
940
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-outline--Color);
941
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-outline--BorderWidth);
942
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-outline--BorderColor);
943
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-outline--BackgroundColor);
944
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-outline__icon--Color);
945
- --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor);
946
- --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
947
- --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
948
- --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover--Color);
949
- --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover__icon--Color);
950
- }
951
-
952
- .pf-v6-c-label.pf-m-editable {
953
- --pf-v6-c-label__content--MaxWidth: var(--pf-v6-c-label--m-editable__content--MaxWidth);
954
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable__content--Cursor);
955
- }
956
-
957
- .pf-v6-c-label.pf-m-editable .pf-v6-c-label__content:is(:hover, :focus) {
958
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--hover--TextDecorationLine);
959
- --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
960
- }
961
-
962
- .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
963
- text-decoration-line: var(--pf-v6-c-label--m-editable--TextDecorationLine);
964
- text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
965
- text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
966
- }
967
-
968
- .pf-v6-c-label.pf-m-editable-active {
969
- --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine);
970
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-editable--m-editable-active--BackgroundColor);
971
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-editable--m-editable-active--Color);
972
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable--m-editable-active__content--Cursor);
973
- }
974
-
975
- .pf-v6-c-label.pf-m-overflow {
976
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-overflow--Color);
977
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-overflow--BackgroundColor);
978
- }
979
-
980
- .pf-v6-c-label.pf-m-overflow:is(:hover, :focus) {
981
- --pf-v6-c-label--m-overflow--Color: var(--pf-v6-c-label--m-overflow--hover--Color);
982
- --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-v6-c-label--m-overflow--hover--BackgroundColor);
983
- }
984
-
985
- .pf-v6-c-label.pf-m-add {
986
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-add--Color);
987
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-add--BackgroundColor);
988
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-add--BorderColor);
989
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-add--BorderWidth);
990
- }
991
-
992
- .pf-v6-c-label.pf-m-add:is(:hover, :focus) {
993
- --pf-v6-c-label--m-add--Color: var(--pf-v6-c-label--m-add--hover--Color);
994
- --pf-v6-c-label--m-add--BackgroundColor: var(--pf-v6-c-label--m-add--hover--BackgroundColor);
995
- --pf-v6-c-label--m-add--BorderColor: var(--pf-v6-c-label--m-add--hover--BorderColor);
996
- --pf-v6-c-label--m-add--BorderWidth: var(--pf-v6-c-label--m-add--hover--BorderWidth);
997
- }
998
-
999
- .pf-v6-c-label.pf-m-clickable {
1000
- --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-clickable__content--Cursor);
1001
- }
1002
-
1003
- .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content, .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
1004
- text-decoration-line: none;
1005
- }
1006
-
1007
- .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
1008
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-clickable--hover--Color);
1009
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
1010
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-clickable--hover--BackgroundColor);
1011
- --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-clickable--hover--BorderWidth);
1012
- --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-clickable--hover--BorderColor);
1013
- --pf-v6-c-label--m-outline--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
1014
- --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
1015
- }
1016
-
1017
- .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) ~ .pf-v6-c-label__actions .pf-v6-c-button {
1018
- --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
1019
- }
1020
-
1021
- .pf-v6-c-label.pf-m-disabled {
1022
- --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-disabled--BackgroundColor);
1023
- --pf-v6-c-label--Color: var(--pf-v6-c-label--m-disabled--Color);
1024
- --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-disabled__icon--Color);
1025
- --pf-v6-c-label--BorderWidth: 0;
1026
- pointer-events: none;
1027
- }
1028
-
1029
- .pf-v6-c-label.pf-m-disabled .pf-v6-c-button {
1030
- --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled__icon--Color);
1031
- }
1032
-
1033
- .pf-v6-c-label,
1034
- .pf-v6-c-label__content {
1035
- display: inline-flex;
1036
- align-items: center;
1037
- justify-content: center;
1038
- }
1039
-
1040
- .pf-v6-c-label__text {
1041
- overflow: hidden;
1042
- text-overflow: ellipsis;
1043
- white-space: nowrap;
1044
- max-width: var(--pf-v6-c-label__text--MaxWidth);
561
+ .pf-v6-c-text-input-group {
562
+ --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
563
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
564
+ --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
565
+ --pf-v6-c-text-input-group--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
566
+ --pf-v6-c-text-input-group--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--default);
567
+ --pf-v6-c-text-input-group--BorderWidth: var(--pf-t--global--border--width--control--default);
568
+ --pf-v6-c-text-input-group__LineHeight: var(--pf-t--global--font--line-height--body);
569
+ --pf-v6-c-text-input-group__FontSize: var(--pf-t--global--font--size--body--default);
570
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-t--global--border--color--hover);
571
+ --pf-v6-c-text-input-group--m-hover--m-success--BorderColor: var(--pf-t--global--border--color--status--success--hover);
572
+ --pf-v6-c-text-input-group--m-hover--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
573
+ --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
574
+ --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
575
+ --pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
576
+ --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
577
+ --pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--sm) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
578
+ --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
579
+ --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
580
+ --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--small);
581
+ --pf-v6-c-text-input-group__text--BorderStartStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
582
+ --pf-v6-c-text-input-group__text--BorderStartEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
583
+ --pf-v6-c-text-input-group__text--BorderEndEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
584
+ --pf-v6-c-text-input-group__text--BorderEndStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
585
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
586
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
587
+ --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
588
+ --pf-v6-c-text-input-group__text-input--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
589
+ --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
590
+ --pf-v6-c-text-input-group__text-input--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
591
+ --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
592
+ --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
593
+ --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
594
+ --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
595
+ --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
596
+ --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
597
+ --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
598
+ --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
599
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
600
+ --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
601
+ --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
602
+ --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
603
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
604
+ --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
605
+ --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
606
+ --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
607
+ --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
608
+ --pf-v6-c-text-input-group__icon--TranslateY: -50%;
609
+ --pf-v6-c-text-input-group__utilities--child--MarginInlineStart: var(--pf-t--global--spacer--xs);
610
+ --pf-v6-c-text-input-group--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
611
+ --pf-v6-c-text-input-group--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1045
612
  }
1046
613
 
1047
- .pf-v6-c-label__content {
1048
- gap: var(--pf-v6-c-label__content--Gap);
1049
- max-width: var(--pf-v6-c-label__content--MaxWidth);
1050
- padding: 0;
1051
- overflow: hidden;
1052
- color: var(--pf-v6-c-label--Color);
1053
- cursor: var(--pf-v6-c-label__content--Cursor, revert);
1054
- background: transparent;
1055
- border-width: 0;
614
+ .pf-v6-c-text-input-group {
615
+ position: relative;
616
+ display: flex;
617
+ width: 100%;
618
+ font-size: var(--pf-v6-c-text-input-group__FontSize);
619
+ line-height: var(--pf-v6-c-text-input-group__LineHeight);
620
+ color: var(--pf-v6-c-text-input-group--Color, inherit);
621
+ background-color: var(--pf-v6-c-text-input-group--BackgroundColor);
622
+ border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
623
+ border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
624
+ border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
625
+ border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
1056
626
  }
1057
627
 
1058
- .pf-v6-c-label__content::before {
628
+ .pf-v6-c-text-input-group::before {
1059
629
  position: absolute;
1060
630
  inset: 0;
1061
- z-index: -1;
1062
631
  pointer-events: none;
1063
632
  content: "";
1064
- background-color: var(--pf-v6-c-label--BackgroundColor);
1065
- border: var(--pf-v6-c-label--BorderWidth) solid var(--pf-v6-c-label--BorderColor);
1066
- border-radius: var(--pf-v6-c-label--BorderRadius);
1067
- }
1068
-
1069
- input.pf-v6-c-label__content {
1070
- overflow: hidden;
1071
- text-overflow: ellipsis;
1072
- white-space: nowrap;
633
+ border: var(--pf-v6-c-text-input-group--BorderWidth) solid var(--pf-v6-c-text-input-group--BorderColor);
634
+ border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
635
+ border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
636
+ border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
637
+ border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
1073
638
  }
1074
639
 
1075
- .pf-v6-c-label__icon {
1076
- color: var(--pf-v6-c-label__icon--Color);
640
+ .pf-v6-c-text-input-group.pf-m-disabled {
641
+ --pf-v6-c-text-input-group--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
642
+ --pf-v6-c-text-input-group__icon--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--Color);
643
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--m-status--Color);
644
+ --pf-v6-c-text-input-group--BackgroundColor: var(--pf-v6-c-text-input-group--m-disabled--BackgroundColor);
645
+ pointer-events: none;
1077
646
  }
1078
647
 
1079
- .pf-v6-c-label__actions {
1080
- margin-inline-end: var(--pf-v6-c-label__actions--MarginInlineEnd);
648
+ .pf-v6-c-text-input-group.pf-m-plain {
649
+ --pf-v6-c-text-input-group--BackgroundColor: transparent;
1081
650
  }
1082
651
 
1083
- .pf-v6-c-label__actions .pf-v6-c-button {
1084
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label__actions--c-button--FontSize);
1085
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label__actions--c-button--PaddingBlockStart);
1086
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd);
1087
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd);
1088
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label__actions--c-button--PaddingInlineStart);
1089
- margin-block-start: var(--pf-v6-c-label__actions--c-button--MarginBlockStart);
1090
- margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
1091
- outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
652
+ .pf-v6-c-text-input-group.pf-m-plain::before {
653
+ border: 0;
1092
654
  }
1093
655
 
1094
- .pf-v6-c-check {
1095
- --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
1096
- --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
1097
- --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
1098
- --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
1099
- --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
1100
- --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
1101
- --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
1102
- --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
1103
- --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
1104
- --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
1105
- --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
1106
- --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
1107
- --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
1108
- --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
656
+ .pf-v6-c-text-input-group.pf-m-success {
657
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-success--BorderColor);
658
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-success--BorderColor);
659
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-success__icon--m-status--Color);
1109
660
  }
1110
661
 
1111
- .pf-v6-c-check {
1112
- display: grid;
1113
- grid-template-columns: auto 1fr;
1114
- grid-gap: var(--pf-v6-c-check--GridGap);
1115
- accent-color: var(--pf-v6-c-check--AccentColor);
662
+ .pf-v6-c-text-input-group.pf-m-warning {
663
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-warning--BorderColor);
664
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-warning--BorderColor);
665
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color);
1116
666
  }
1117
667
 
1118
- .pf-v6-c-check.pf-m-standalone {
1119
- display: inline-grid;
1120
- grid-template-columns: auto;
1121
- min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
668
+ .pf-v6-c-text-input-group.pf-m-error {
669
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-error--BorderColor);
670
+ --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
671
+ --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
1122
672
  }
1123
673
 
1124
- .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
1125
- align-self: center;
1126
- transform: none;
674
+ @media (prefers-reduced-motion: no-preference) {
675
+ .pf-v6-c-text-input-group.pf-m-error {
676
+ translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
677
+ animation-name: pf-v6-global-danger-jiggle-motion;
678
+ animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
679
+ animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
680
+ animation-fill-mode: both;
681
+ }
1127
682
  }
1128
-
1129
- .pf-v6-c-check__input {
1130
- align-self: start;
1131
- font-size: var(--pf-v6-c-check__label--FontSize);
1132
- line-height: var(--pf-v6-c-check__label--LineHeight);
1133
- transform: translateY(var(--pf-v6-c-check__input--TranslateY));
683
+ .pf-v6-c-text-input-group.pf-m-error .pf-v6-c-text-input-group__icon.pf-m-status {
684
+ --pf-v6-c-text-input-group--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
685
+ --pf-v6-c-text-input-group--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
686
+ animation-name: pf-v6-global-fade-in;
687
+ animation-duration: var(--pf-v6-c-text-input-group--TransitionDuration--Opacity);
688
+ animation-timing-function: var(--pf-v6-c-text-input-group--TransitionTimingFunction--Opacity);
1134
689
  }
1135
690
 
1136
- .pf-v6-c-check__label {
1137
- font-size: var(--pf-v6-c-check__label--FontSize);
1138
- font-weight: var(--pf-v6-c-check__label--FontWeight);
1139
- line-height: var(--pf-v6-c-check__label--LineHeight);
1140
- color: var(--pf-v6-c-check__label--Color);
691
+ .pf-v6-c-text-input-group:hover {
692
+ --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
1141
693
  }
1142
694
 
1143
- .pf-v6-c-check__description {
1144
- grid-column: 2;
1145
- font-size: var(--pf-v6-c-check__description--FontSize);
1146
- color: var(--pf-v6-c-check__description--Color);
695
+ .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) {
696
+ --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd);
1147
697
  }
1148
698
 
1149
- .pf-v6-c-check__body {
1150
- grid-column: 2;
699
+ .pf-v6-c-text-input-group:has(> .pf-v6-c-text-input-group__utilities) {
700
+ --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd);
701
+ --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd);
1151
702
  }
1152
703
 
1153
- .pf-v6-c-check__label,
1154
- .pf-v6-c-check__input {
1155
- justify-self: start;
704
+ .pf-v6-c-text-input-group__main {
705
+ display: flex;
706
+ flex: 1;
707
+ flex-wrap: wrap;
708
+ gap: var(--pf-v6-c-text-input-group__main--RowGap) var(--pf-v6-c-text-input-group__main--ColumnGap);
709
+ min-width: 0;
1156
710
  }
1157
711
 
1158
- label.pf-v6-c-check, .pf-v6-c-check__label,
1159
- .pf-v6-c-check__input {
1160
- cursor: pointer;
712
+ .pf-v6-c-text-input-group__main.pf-m-icon {
713
+ --pf-v6-c-text-input-group__text--Position: relative;
714
+ --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart);
715
+ display: inline-flex;
716
+ align-items: center;
717
+ justify-content: center;
718
+ min-width: calc(var(--pf-v6-c-text-input-group__LineHeight) * var(--pf-v6-c-text-input-group__FontSize));
1161
719
  }
1162
720
 
1163
- .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
1164
- .pf-v6-c-check__input:disabled,
1165
- .pf-v6-c-check__input.pf-m-disabled {
1166
- --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
1167
- cursor: not-allowed;
721
+ .pf-v6-c-text-input-group__main > :first-child:not(.pf-v6-c-text-input-group__text) {
722
+ margin-inline-start: var(--pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart);
1168
723
  }
1169
724
 
1170
- .pf-v6-c-check__label-required {
1171
- margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
1172
- font-size: var(--pf-v6-c-check__label-required--FontSize);
1173
- color: var(--pf-v6-c-check__label-required--Color);
725
+ .pf-v6-c-text-input-group__main .pf-v6-c-label-group__main {
726
+ padding-block-start: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart);
727
+ padding-block-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd);
728
+ padding-inline-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd);
1174
729
  }
1175
730
 
1176
- .pf-v6-c-label-group {
1177
- --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
1178
- --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
1179
- --pf-v6-c-label-group--MaxWidth: 100%;
1180
- --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
1181
- --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
1182
- --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
1183
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
1184
- --pf-v6-c-label-group__main--MaxWidth: 100%;
1185
- --pf-v6-c-label-group__main--MinWidth: 0;
1186
- --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
1187
- --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
1188
- --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
1189
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
1190
- --pf-v6-c-label-group__list--MaxWidth: 100%;
1191
- --pf-v6-c-label-group__list--MinWidth: 0;
1192
- --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
1193
- --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
1194
- --pf-v6-c-label-group__list-item--MaxWidth: 100%;
1195
- --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1196
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1197
- --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1198
- --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1199
- --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
1200
- --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
1201
- --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
1202
- --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1203
- --pf-v6-c-label-group__label--MaxWidth: 18ch;
1204
- --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1205
- --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1206
- --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1207
- --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1208
- --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1209
- --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
1210
- --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
1211
- --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1212
- --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
1213
- --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
731
+ .pf-v6-c-text-input-group__text {
732
+ position: var(--pf-v6-c-text-input-group__text--Position, revert);
733
+ display: inline-grid;
734
+ flex: 1;
735
+ grid-template-areas: "text-input";
736
+ grid-template-columns: 1fr;
1214
737
  }
1215
738
 
1216
- .pf-v6-c-label-group {
1217
- display: inline-flex;
1218
- row-gap: var(--pf-v6-c-label-group--RowGap);
1219
- column-gap: var(--pf-v6-c-label-group--ColumnGap);
1220
- align-items: center;
1221
- max-width: var(--pf-v6-c-label-group--MaxWidth);
739
+ .pf-v6-c-text-input-group__icon {
740
+ position: absolute;
741
+ inset-block-start: 50%;
742
+ inset-inline-start: var(--pf-v6-c-text-input-group__icon--InsetInlineStart);
743
+ font-size: var(--pf-v6-c-text-input-group__icon--FontSize);
744
+ color: var(--pf-v6-c-text-input-group__icon--Color);
745
+ transform: translateY(var(--pf-v6-c-text-input-group__icon--TranslateY));
1222
746
  }
1223
747
 
1224
- .pf-v6-c-label-group.pf-m-category {
1225
- padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
1226
- padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
1227
- padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
1228
- padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
1229
- background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
1230
- border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
1231
- border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
748
+ .pf-v6-c-text-input-group__icon.pf-m-status {
749
+ inset-inline-start: auto;
750
+ inset-inline-end: var(--pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd);
751
+ color: var(--pf-v6-c-text-input-group__icon--m-status--Color);
1232
752
  }
1233
753
 
1234
- .pf-v6-c-label-group.pf-m-vertical {
1235
- --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
1236
- --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
1237
- --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
1238
- --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
1239
- --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
1240
- --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
1241
- --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
754
+ .pf-v6-c-text-input-group__text-input {
755
+ overflow: hidden;
756
+ text-overflow: ellipsis;
757
+ white-space: nowrap;
758
+ position: relative;
759
+ width: 100%;
760
+ min-width: var(--pf-v6-c-text-input-group__text-input--MinWidth);
761
+ padding-block-start: var(--pf-v6-c-text-input-group__text-input--PaddingBlockStart);
762
+ padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
763
+ padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
764
+ padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
765
+ background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
766
+ border: 0;
767
+ outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
1242
768
  }
1243
769
 
1244
- .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
1245
- align-items: flex-start;
770
+ .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
771
+ grid-area: text-input;
1246
772
  }
1247
773
 
1248
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
1249
- flex-direction: column;
1250
- align-items: flex-start;
1251
- max-width: var(--pf-v6-c-label-group__list--MaxWidth);
774
+ .pf-v6-c-text-input-group__text-input.pf-m-hint {
775
+ color: var(--pf-v6-c-text-input-group__text-input--m-hint--Color);
1252
776
  }
1253
777
 
1254
- .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
1255
- flex-direction: column;
1256
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
778
+ .pf-v6-c-text-input-group__text-input::placeholder {
779
+ color: var(--pf-v6-c-text-input-group__text-input--placeholder--Color);
1257
780
  }
1258
781
 
1259
- .pf-v6-c-label-group.pf-m-editable,
1260
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1261
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
782
+ .pf-v6-c-text-input-group__utilities {
1262
783
  display: flex;
784
+ align-items: center;
785
+ margin-inline-start: var(--pf-v6-c-text-input-group__utilities--MarginInlineStart);
786
+ margin-inline-end: var(--pf-v6-c-text-input-group__utilities--MarginInlineEnd);
1263
787
  }
1264
788
 
1265
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1266
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
1267
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
1268
- .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
1269
- flex: 1;
789
+ .pf-v6-c-text-input-group__utilities > * + * {
790
+ margin-inline-start: var(--pf-v6-c-text-input-group__utilities--child--MarginInlineStart);
1270
791
  }
1271
792
 
1272
- .pf-v6-c-label-group__main {
793
+ .pf-v6-c-text-input-group__group {
1273
794
  display: flex;
1274
- flex: 1;
1275
- flex-wrap: wrap;
1276
- row-gap: var(--pf-v6-c-label-group__main--RowGap);
1277
- column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
1278
- align-items: baseline;
1279
- min-width: var(--pf-v6-c-label-group__main--MinWidth);
1280
795
  }
1281
796
 
1282
- .pf-v6-c-label-group__list {
1283
- display: inline-flex;
1284
- flex-wrap: wrap;
1285
- row-gap: var(--pf-v6-c-label-group__list--RowGap);
1286
- column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
1287
- min-width: var(--pf-v6-c-label-group__list--MinWidth);
797
+ .pf-v6-c-badge {
798
+ --pf-v6-c-badge--BorderColor: transparent;
799
+ --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
800
+ --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
801
+ --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
802
+ --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
803
+ --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
804
+ --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
805
+ --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
806
+ --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
807
+ --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
808
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
809
+ --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
810
+ --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
811
+ --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
812
+ --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
813
+ --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
814
+ --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
815
+ --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
816
+ --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
817
+ --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1288
818
  }
1289
819
 
1290
- .pf-v6-c-label-group__list-item {
1291
- display: inline-flex;
1292
- max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
820
+ .pf-v6-c-badge {
821
+ position: relative;
822
+ display: inline-block;
823
+ min-width: var(--pf-v6-c-badge--MinWidth);
824
+ padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
825
+ padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
826
+ font-size: var(--pf-v6-c-badge--FontSize);
827
+ font-weight: var(--pf-v6-c-badge--FontWeight);
828
+ color: var(--pf-v6-c-badge--Color);
829
+ text-align: center;
830
+ white-space: nowrap;
831
+ background-color: var(--pf-v6-c-badge--BackgroundColor);
832
+ border-radius: var(--pf-v6-c-badge--BorderRadius);
1293
833
  }
1294
834
 
1295
- .pf-v6-c-label-group__label {
1296
- overflow: hidden;
1297
- text-overflow: ellipsis;
1298
- white-space: nowrap;
1299
- max-width: var(--pf-v6-c-label-group__label--MaxWidth);
835
+ .pf-v6-c-badge::after {
836
+ position: absolute;
837
+ inset: 0;
838
+ pointer-events: none;
839
+ content: "";
840
+ border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
841
+ border-radius: inherit;
1300
842
  }
1301
843
 
1302
- .pf-v6-c-label-group__close {
1303
- display: flex;
1304
- align-self: flex-start;
844
+ .pf-v6-c-badge.pf-m-read {
845
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
846
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
847
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
848
+ }
849
+
850
+ .pf-v6-c-badge.pf-m-unread {
851
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
852
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
853
+ --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
1305
854
  }
1306
855
 
1307
- .pf-v6-c-label-group__close .pf-v6-c-button {
1308
- --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
1309
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
1310
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
1311
- --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
1312
- --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
856
+ .pf-v6-c-badge.pf-m-disabled {
857
+ --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
858
+ --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
1313
859
  }
1314
860
 
1315
- .pf-v6-c-label-group__textarea {
1316
- min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
1317
- padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
1318
- padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
1319
- padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
1320
- padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
1321
- white-space: nowrap;
1322
- resize: none;
1323
- border: 0;
1324
- -ms-overflow-style: none;
1325
- scrollbar-width: none;
861
+ .pf-v6-c-badge.pf-m-disabled::after {
862
+ border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
1326
863
  }
1327
864
 
1328
- .pf-v6-c-label-group__textarea::-webkit-scrollbar {
1329
- display: none;
865
+ .pf-v6-c-badge__toggle-icon {
866
+ margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
867
+ color: var(--pf-v6-c-badge__toggle-icon--Color);
1330
868
  }
1331
869
 
1332
870
  .pf-v6-c-divider {
@@ -1645,77 +1183,242 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
1645
1183
  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
1646
1184
  }
1647
1185
  }
1648
- .pf-v6-c-badge {
1649
- --pf-v6-c-badge--BorderColor: transparent;
1650
- --pf-v6-c-badge--BorderWidth: var(--pf-t--global--border--width--regular);
1651
- --pf-v6-c-badge--BorderRadius: var(--pf-t--global--border--radius--pill);
1652
- --pf-v6-c-badge--FontSize: var(--pf-t--global--font--size--body--sm);
1653
- --pf-v6-c-badge--FontWeight: var(--pf-t--global--font--weight--body--bold);
1654
- --pf-v6-c-badge--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1655
- --pf-v6-c-badge--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1656
- --pf-v6-c-badge--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1657
- --pf-v6-c-badge--MinWidth: var(--pf-t--global--spacer--xl);
1658
- --pf-v6-c-badge__toggle-icon--MarginInlineStart: var(--pf-t--global--spacer--xs);
1659
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1660
- --pf-v6-c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
1661
- --pf-v6-c-badge--m-read--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
1662
- --pf-v6-c-badge--m-read__toggle-icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
1663
- --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-t--global--color--brand--default);
1664
- --pf-v6-c-badge--m-unread--Color: var(--pf-t--global--text--color--on-brand--default);
1665
- --pf-v6-c-badge--m-unread__toggle-icon--Color: var(--pf-t--global--icon--color--on-brand--default);
1666
- --pf-v6-c-badge--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
1667
- --pf-v6-c-badge--m-disabled--BorderColor: var(--pf-t--global--border--color--disabled);
1668
- --pf-v6-c-badge--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
1186
+ .pf-v6-c-check {
1187
+ --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
1188
+ --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
1189
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
1190
+ --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
1191
+ --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
1192
+ --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
1193
+ --pf-v6-c-check__label--FontSize: var(--pf-t--global--font--size--body--default);
1194
+ --pf-v6-c-check__label--LineHeight: var(--pf-t--global--font--line-height--body);
1195
+ --pf-v6-c-check__description--FontSize: var(--pf-t--global--font--size--body--sm);
1196
+ --pf-v6-c-check__description--Color: var(--pf-t--global--text--color--subtle);
1197
+ --pf-v6-c-check__label-required--MarginInlineStart: var(--pf-t--global--spacer--xs);
1198
+ --pf-v6-c-check__label-required--FontSize: var(--pf-t--global--font--size--body--sm);
1199
+ --pf-v6-c-check__label-required--Color: var(--pf-t--global--color--status--danger--default);
1200
+ --pf-v6-c-check__input--TranslateY: calc((var(--pf-v6-c-check__label--LineHeight) * var(--pf-v6-c-check__label--FontSize) / 2 ) - 50%);
1669
1201
  }
1670
1202
 
1671
- .pf-v6-c-badge {
1672
- position: relative;
1673
- display: inline-block;
1674
- min-width: var(--pf-v6-c-badge--MinWidth);
1675
- padding-inline-start: var(--pf-v6-c-badge--PaddingInlineStart);
1676
- padding-inline-end: var(--pf-v6-c-badge--PaddingInlineEnd);
1677
- font-size: var(--pf-v6-c-badge--FontSize);
1678
- font-weight: var(--pf-v6-c-badge--FontWeight);
1679
- color: var(--pf-v6-c-badge--Color);
1680
- text-align: center;
1681
- white-space: nowrap;
1682
- background-color: var(--pf-v6-c-badge--BackgroundColor);
1683
- border-radius: var(--pf-v6-c-badge--BorderRadius);
1203
+ .pf-v6-c-check {
1204
+ display: grid;
1205
+ grid-template-columns: auto 1fr;
1206
+ grid-gap: var(--pf-v6-c-check--GridGap);
1207
+ accent-color: var(--pf-v6-c-check--AccentColor);
1208
+ }
1209
+
1210
+ .pf-v6-c-check.pf-m-standalone {
1211
+ display: inline-grid;
1212
+ grid-template-columns: auto;
1213
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
1214
+ }
1215
+
1216
+ .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
1217
+ align-self: center;
1218
+ transform: none;
1219
+ }
1220
+
1221
+ .pf-v6-c-check__input {
1222
+ align-self: start;
1223
+ font-size: var(--pf-v6-c-check__label--FontSize);
1224
+ line-height: var(--pf-v6-c-check__label--LineHeight);
1225
+ transform: translateY(var(--pf-v6-c-check__input--TranslateY));
1226
+ }
1227
+
1228
+ .pf-v6-c-check__label {
1229
+ font-size: var(--pf-v6-c-check__label--FontSize);
1230
+ font-weight: var(--pf-v6-c-check__label--FontWeight);
1231
+ line-height: var(--pf-v6-c-check__label--LineHeight);
1232
+ color: var(--pf-v6-c-check__label--Color);
1233
+ }
1234
+
1235
+ .pf-v6-c-check__description {
1236
+ grid-column: 2;
1237
+ font-size: var(--pf-v6-c-check__description--FontSize);
1238
+ color: var(--pf-v6-c-check__description--Color);
1239
+ }
1240
+
1241
+ .pf-v6-c-check__body {
1242
+ grid-column: 2;
1243
+ }
1244
+
1245
+ .pf-v6-c-check__label,
1246
+ .pf-v6-c-check__input {
1247
+ justify-self: start;
1248
+ }
1249
+
1250
+ label.pf-v6-c-check, .pf-v6-c-check__label,
1251
+ .pf-v6-c-check__input {
1252
+ cursor: pointer;
1253
+ }
1254
+
1255
+ .pf-v6-c-check__label:disabled, .pf-v6-c-check__label.pf-m-disabled,
1256
+ .pf-v6-c-check__input:disabled,
1257
+ .pf-v6-c-check__input.pf-m-disabled {
1258
+ --pf-v6-c-check__label--Color: var(--pf-v6-c-check__label--disabled--Color);
1259
+ cursor: not-allowed;
1260
+ }
1261
+
1262
+ .pf-v6-c-check__label-required {
1263
+ margin-inline-start: var(--pf-v6-c-check__label-required--MarginInlineStart);
1264
+ font-size: var(--pf-v6-c-check__label-required--FontSize);
1265
+ color: var(--pf-v6-c-check__label-required--Color);
1266
+ }
1267
+
1268
+ .pf-v6-c-label-group {
1269
+ --pf-v6-c-label-group--RowGap: var(--pf-t--global--spacer--sm);
1270
+ --pf-v6-c-label-group--ColumnGap: var(--pf-t--global--spacer--xs);
1271
+ --pf-v6-c-label-group--MaxWidth: 100%;
1272
+ --pf-v6-c-label-group--m-vertical--RowGap: var(--pf-t--global--spacer--sm);
1273
+ --pf-v6-c-label-group--m-vertical--ColumnGap: var(--pf-t--global--spacer--sm);
1274
+ --pf-v6-c-label-group__main--RowGap: var(--pf-t--global--spacer--xs);
1275
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-t--global--spacer--sm);
1276
+ --pf-v6-c-label-group__main--MaxWidth: 100%;
1277
+ --pf-v6-c-label-group__main--MinWidth: 0;
1278
+ --pf-v6-c-label-group--m-vertical__main--RowGap: var(--pf-t--global--spacer--sm);
1279
+ --pf-v6-c-label-group--m-vertical__main--ColumnGap: var(--pf-t--global--spacer--xs);
1280
+ --pf-v6-c-label-group__list--RowGap: var(--pf-t--global--spacer--xs);
1281
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-t--global--spacer--xs);
1282
+ --pf-v6-c-label-group__list--MaxWidth: 100%;
1283
+ --pf-v6-c-label-group__list--MinWidth: 0;
1284
+ --pf-v6-c-label-group--m-vertical__list--RowGap: var(--pf-t--global--spacer--xs);
1285
+ --pf-v6-c-label-group--m-vertical__list--ColumnGap: var(--pf-t--global--spacer--xs);
1286
+ --pf-v6-c-label-group__list-item--MaxWidth: 100%;
1287
+ --pf-v6-c-label-group--m-category--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1288
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1289
+ --pf-v6-c-label-group--m-category--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1290
+ --pf-v6-c-label-group--m-category--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1291
+ --pf-v6-c-label-group--m-category--BorderRadius: var(--pf-t--global--border--radius--small);
1292
+ --pf-v6-c-label-group--m-category--BorderWidth: var(--pf-t--global--border--width--regular);
1293
+ --pf-v6-c-label-group--m-category--BorderColor: var(--pf-t--global--border--color--default);
1294
+ --pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1295
+ --pf-v6-c-label-group__label--MaxWidth: 18ch;
1296
+ --pf-v6-c-label-group__close--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
1297
+ --pf-v6-c-label-group__close--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
1298
+ --pf-v6-c-label-group__close--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
1299
+ --pf-v6-c-label-group__close--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
1300
+ --pf-v6-c-label-group__close--c-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
1301
+ --pf-v6-c-label-group__textarea--MinWidth: 12.5rem;
1302
+ --pf-v6-c-label-group__textarea--PaddingBlockStart: 0.125rem;
1303
+ --pf-v6-c-label-group__textarea--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
1304
+ --pf-v6-c-label-group__textarea--PaddingBlockEnd: 0;
1305
+ --pf-v6-c-label-group__textarea--PaddingInlineStart: var(--pf-t--global--spacer--xs);
1306
+ }
1307
+
1308
+ .pf-v6-c-label-group {
1309
+ display: inline-flex;
1310
+ row-gap: var(--pf-v6-c-label-group--RowGap);
1311
+ column-gap: var(--pf-v6-c-label-group--ColumnGap);
1312
+ align-items: center;
1313
+ max-width: var(--pf-v6-c-label-group--MaxWidth);
1314
+ }
1315
+
1316
+ .pf-v6-c-label-group.pf-m-category {
1317
+ padding-block-start: var(--pf-v6-c-label-group--m-category--PaddingBlockStart);
1318
+ padding-block-end: var(--pf-v6-c-label-group--m-category--PaddingBlockEnd);
1319
+ padding-inline-start: var(--pf-v6-c-label-group--m-category--PaddingInlineStart);
1320
+ padding-inline-end: var(--pf-v6-c-label-group--m-category--PaddingInlineEnd);
1321
+ background-color: var(--pf-v6-c-label-group--m-category--BackgroundColor);
1322
+ border: var(--pf-v6-c-label-group--m-category--BorderWidth) solid var(--pf-v6-c-label-group--m-category--BorderColor);
1323
+ border-radius: var(--pf-v6-c-label-group--m-category--BorderRadius);
1324
+ }
1325
+
1326
+ .pf-v6-c-label-group.pf-m-vertical {
1327
+ --pf-v6-c-label-group--RowGap: var(--pf-v6-c-label-group--m-vertical--RowGap);
1328
+ --pf-v6-c-label-group--ColumnGap: var(--pf-v6-c-label-group--m-vertical--ColumnGap);
1329
+ --pf-v6-c-label-group__main--RowGap: var(--pf-v6-c-label-group--m-vertical__main--RowGap);
1330
+ --pf-v6-c-label-group__main--ColumnGap: var(--pf-v6-c-label-group--m-vertical__main--ColumnGap);
1331
+ --pf-v6-c-label-group__list--RowGap: var(--pf-v6-c-label-group--m-vertical__list--RowGap);
1332
+ --pf-v6-c-label-group__list--ColumnGap: var(--pf-v6-c-label-group--m-vertical__list--ColumnGap);
1333
+ --pf-v6-c-label-group--m-category--PaddingInlineEnd: var(--pf-v6-c-label-group--m-vertical--m-category--PaddingInlineEnd);
1334
+ }
1335
+
1336
+ .pf-v6-c-label-group.pf-m-vertical.pf-v6-c-label-group {
1337
+ align-items: flex-start;
1338
+ }
1339
+
1340
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__list {
1341
+ flex-direction: column;
1342
+ align-items: flex-start;
1343
+ max-width: var(--pf-v6-c-label-group__list--MaxWidth);
1344
+ }
1345
+
1346
+ .pf-v6-c-label-group.pf-m-vertical .pf-v6-c-label-group__main {
1347
+ flex-direction: column;
1348
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
1349
+ }
1350
+
1351
+ .pf-v6-c-label-group.pf-m-editable,
1352
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1353
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list {
1354
+ display: flex;
1355
+ }
1356
+
1357
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__main,
1358
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list,
1359
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__list-item.pf-m-textarea,
1360
+ .pf-v6-c-label-group.pf-m-editable .pf-v6-c-label-group__textarea {
1361
+ flex: 1;
1362
+ }
1363
+
1364
+ .pf-v6-c-label-group__main {
1365
+ display: flex;
1366
+ flex: 1;
1367
+ flex-wrap: wrap;
1368
+ row-gap: var(--pf-v6-c-label-group__main--RowGap);
1369
+ column-gap: var(--pf-v6-c-label-group__main--ColumnGap);
1370
+ align-items: baseline;
1371
+ min-width: var(--pf-v6-c-label-group__main--MinWidth);
1372
+ }
1373
+
1374
+ .pf-v6-c-label-group__list {
1375
+ display: inline-flex;
1376
+ flex-wrap: wrap;
1377
+ row-gap: var(--pf-v6-c-label-group__list--RowGap);
1378
+ column-gap: var(--pf-v6-c-label-group__list--ColumnGap);
1379
+ min-width: var(--pf-v6-c-label-group__list--MinWidth);
1684
1380
  }
1685
1381
 
1686
- .pf-v6-c-badge::after {
1687
- position: absolute;
1688
- inset: 0;
1689
- pointer-events: none;
1690
- content: "";
1691
- border: var(--pf-v6-c-badge--BorderWidth) solid var(--pf-v6-c-badge--BorderColor);
1692
- border-radius: inherit;
1382
+ .pf-v6-c-label-group__list-item {
1383
+ display: inline-flex;
1384
+ max-width: var(--pf-v6-c-label-group__list-item--MaxWidth);
1693
1385
  }
1694
1386
 
1695
- .pf-v6-c-badge.pf-m-read {
1696
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-read--Color);
1697
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-read--BackgroundColor);
1698
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-read__toggle-icon--Color);
1387
+ .pf-v6-c-label-group__label {
1388
+ overflow: hidden;
1389
+ text-overflow: ellipsis;
1390
+ white-space: nowrap;
1391
+ max-width: var(--pf-v6-c-label-group__label--MaxWidth);
1699
1392
  }
1700
1393
 
1701
- .pf-v6-c-badge.pf-m-unread {
1702
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-unread--Color);
1703
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-unread--BackgroundColor);
1704
- --pf-v6-c-badge__toggle-icon--Color: var(--pf-v6-c-badge--m-unread__toggle-icon--Color);
1394
+ .pf-v6-c-label-group__close {
1395
+ display: flex;
1396
+ align-self: flex-start;
1705
1397
  }
1706
1398
 
1707
- .pf-v6-c-badge.pf-m-disabled {
1708
- --pf-v6-c-badge--Color: var(--pf-v6-c-badge--m-disabled--Color);
1709
- --pf-v6-c-badge--BackgroundColor: var(--pf-v6-c-badge--m-disabled--BackgroundColor);
1399
+ .pf-v6-c-label-group__close .pf-v6-c-button {
1400
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label-group__close--c-button--FontSize);
1401
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label-group__close--c-button--PaddingBlockStart);
1402
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label-group__close--c-button--PaddingInlineEnd);
1403
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label-group__close--c-button--PaddingBlockEnd);
1404
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label-group__close--c-button--PaddingInlineStart);
1710
1405
  }
1711
1406
 
1712
- .pf-v6-c-badge.pf-m-disabled::after {
1713
- border-color: var(--pf-v6-c-badge--m-disabled--BorderColor);
1407
+ .pf-v6-c-label-group__textarea {
1408
+ min-width: var(--pf-v6-c-label-group__textarea--MinWidth);
1409
+ padding-block-start: var(--pf-v6-c-label-group__textarea--PaddingBlockStart);
1410
+ padding-block-end: var(--pf-v6-c-label-group__textarea--PaddingBlockEnd);
1411
+ padding-inline-start: var(--pf-v6-c-label-group__textarea--PaddingInlineStart);
1412
+ padding-inline-end: var(--pf-v6-c-label-group__textarea--PaddingInlineEnd);
1413
+ white-space: nowrap;
1414
+ resize: none;
1415
+ border: 0;
1416
+ -ms-overflow-style: none;
1417
+ scrollbar-width: none;
1714
1418
  }
1715
1419
 
1716
- .pf-v6-c-badge__toggle-icon {
1717
- margin-inline-start: var(--pf-v6-c-badge__toggle-icon--MarginInlineStart);
1718
- color: var(--pf-v6-c-badge__toggle-icon--Color);
1420
+ .pf-v6-c-label-group__textarea::-webkit-scrollbar {
1421
+ display: none;
1719
1422
  }
1720
1423
 
1721
1424
  .pf-v6-c-button {
@@ -2520,303 +2223,600 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2520
2223
  opacity: var(--pf-v6-c-button__icon--favorite--Opacity);
2521
2224
  }
2522
2225
 
2523
- .pf-v6-c-button__icon-favorited {
2524
- opacity: var(--pf-v6-c-button__icon--favorited--Opacity);
2226
+ .pf-v6-c-button__icon-favorited {
2227
+ opacity: var(--pf-v6-c-button__icon--favorited--Opacity);
2228
+ }
2229
+
2230
+ .pf-v6-c-button__progress {
2231
+ position: absolute;
2232
+ inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
2233
+ inset-inline-start: var(--pf-v6-c-button__progress--InsetInlineStart);
2234
+ line-height: 1;
2235
+ color: var(--pf-v6-c-button__progress--Color);
2236
+ transform: translate(var(--pf-v6-c-button__progress--TranslateX), var(--pf-v6-c-button__progress--TranslateY));
2237
+ }
2238
+
2239
+ .pf-v6-c-button__progress .pf-v6-c-spinner {
2240
+ --pf-v6-c-spinner--Color: currentcolor;
2241
+ }
2242
+
2243
+ .pf-v6-c-button__text {
2244
+ text-decoration: inherit;
2245
+ }
2246
+
2247
+ .pf-v6-c-button__count {
2248
+ display: inline-flex;
2249
+ align-items: center;
2250
+ }
2251
+
2252
+ .pf-v6-c-button--hamburger-icon path {
2253
+ fill: none;
2254
+ stroke: currentcolor;
2255
+ stroke-linecap: round;
2256
+ stroke-linejoin: round;
2257
+ transition: d var(--pf-v6-c-button--hamburger-icon--TransitionDuration) var(--pf-v6-c-button--hamburger-icon--TransitionTimingFunction);
2258
+ }
2259
+
2260
+ .pf-v6-c-button--hamburger-icon--top {
2261
+ d: var(--pf-v6-c-button--hamburger-icon--top--path);
2262
+ }
2263
+
2264
+ .pf-v6-c-button--hamburger-icon--middle {
2265
+ d: var(--pf-v6-c-button--hamburger-icon--middle--path);
2266
+ }
2267
+
2268
+ .pf-v6-c-button--hamburger-icon--arrow {
2269
+ d: var(--pf-v6-c-button--hamburger-icon--arrow--path);
2270
+ }
2271
+
2272
+ .pf-v6-c-button--hamburger-icon--bottom {
2273
+ d: var(--pf-v6-c-button--hamburger-icon--bottom--path);
2274
+ }
2275
+
2276
+ @keyframes pf-v6-c-button-icon-notify {
2277
+ 33% {
2278
+ transform: rotate(30deg);
2279
+ }
2280
+ 66% {
2281
+ transform: rotate(-60deg);
2282
+ }
2283
+ }
2284
+ @keyframes pf-v6-c-button-icon-favorited {
2285
+ 50% {
2286
+ scale: 1.5;
2287
+ }
2288
+ }
2289
+ .pf-v6-c-label {
2290
+ --pf-v6-c-label--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2291
+ --pf-v6-c-label--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2292
+ --pf-v6-c-label--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
2293
+ --pf-v6-c-label--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2294
+ --pf-v6-c-label--MaxWidth: 100%;
2295
+ --pf-v6-c-label--MinWidth: calc((var(--pf-v6-c-label--FontSize) * var(--pf-t--global--font--line-height--body) + var(--pf-v6-c-label--PaddingBlockStart) + var(--pf-v6-c-label--PaddingBlockEnd)));
2296
+ --pf-v6-c-label--BorderWidth: 0;
2297
+ --pf-v6-c-label--BorderColor: transparent;
2298
+ --pf-v6-c-label--BorderRadius: var(--pf-t--global--border--radius--pill);
2299
+ --pf-v6-c-label--FontSize: var(--pf-t--global--font--size--body--sm);
2300
+ --pf-v6-c-label--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
2301
+ --pf-v6-c-label--Color: var(--pf-t--global--text--color--nonstatus--on-gray--default);
2302
+ --pf-v6-c-label__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--default);
2303
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--hover);
2304
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-gray--hover);
2305
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-gray--hover);
2306
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--default);
2307
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--gray--hover);
2308
+ --pf-v6-c-label--m-blue--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--default);
2309
+ --pf-v6-c-label--m-blue--Color: var(--pf-t--global--text--color--nonstatus--on-blue--default);
2310
+ --pf-v6-c-label--m-blue__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--default);
2311
+ --pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--blue--hover);
2312
+ --pf-v6-c-label--m-blue--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-blue--hover);
2313
+ --pf-v6-c-label--m-blue--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-blue--hover);
2314
+ --pf-v6-c-label--m-blue--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--default);
2315
+ --pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--blue--hover);
2316
+ --pf-v6-c-label--m-red--BackgroundColor: var(--pf-t--global--color--nonstatus--red--default);
2317
+ --pf-v6-c-label--m-red--Color: var(--pf-t--global--text--color--nonstatus--on-red--default);
2318
+ --pf-v6-c-label--m-red__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--default);
2319
+ --pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--red--hover);
2320
+ --pf-v6-c-label--m-red--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-red--hover);
2321
+ --pf-v6-c-label--m-red--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-red--hover);
2322
+ --pf-v6-c-label--m-red--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--red--default);
2323
+ --pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--red--hover);
2324
+ --pf-v6-c-label--m-orange--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--default);
2325
+ --pf-v6-c-label--m-orange--Color: var(--pf-t--global--text--color--nonstatus--on-orange--default);
2326
+ --pf-v6-c-label--m-orange__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--default);
2327
+ --pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orange--hover);
2328
+ --pf-v6-c-label--m-orange--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orange--hover);
2329
+ --pf-v6-c-label--m-orange--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orange--hover);
2330
+ --pf-v6-c-label--m-orange--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--default);
2331
+ --pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orange--hover);
2332
+ --pf-v6-c-label--m-orangered--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--default);
2333
+ --pf-v6-c-label--m-orangered--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--default);
2334
+ --pf-v6-c-label--m-orangered__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--default);
2335
+ --pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--orangered--hover);
2336
+ --pf-v6-c-label--m-orangered--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-orangered--hover);
2337
+ --pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-orangered--hover);
2338
+ --pf-v6-c-label--m-orangered--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--default);
2339
+ --pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--orangered--hover);
2340
+ --pf-v6-c-label--m-yellow--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--default);
2341
+ --pf-v6-c-label--m-yellow--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--default);
2342
+ --pf-v6-c-label--m-yellow__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--default);
2343
+ --pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--yellow--hover);
2344
+ --pf-v6-c-label--m-yellow--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-yellow--hover);
2345
+ --pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-yellow--hover);
2346
+ --pf-v6-c-label--m-yellow--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--default);
2347
+ --pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--yellow--hover);
2348
+ --pf-v6-c-label--m-green--BackgroundColor: var(--pf-t--global--color--nonstatus--green--default);
2349
+ --pf-v6-c-label--m-green--Color: var(--pf-t--global--text--color--nonstatus--on-green--default);
2350
+ --pf-v6-c-label--m-green__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--default);
2351
+ --pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--green--hover);
2352
+ --pf-v6-c-label--m-green--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-green--hover);
2353
+ --pf-v6-c-label--m-green--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-green--hover);
2354
+ --pf-v6-c-label--m-green--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--green--default);
2355
+ --pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--green--hover);
2356
+ --pf-v6-c-label--m-teal--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--default);
2357
+ --pf-v6-c-label--m-teal--Color: var(--pf-t--global--text--color--nonstatus--on-teal--default);
2358
+ --pf-v6-c-label--m-teal__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--default);
2359
+ --pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--teal--hover);
2360
+ --pf-v6-c-label--m-teal--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-teal--hover);
2361
+ --pf-v6-c-label--m-teal--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-teal--hover);
2362
+ --pf-v6-c-label--m-teal--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--default);
2363
+ --pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--teal--hover);
2364
+ --pf-v6-c-label--m-purple--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--default);
2365
+ --pf-v6-c-label--m-purple--Color: var(--pf-t--global--text--color--nonstatus--on-purple--default);
2366
+ --pf-v6-c-label--m-purple__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--default);
2367
+ --pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--nonstatus--purple--hover);
2368
+ --pf-v6-c-label--m-purple--m-clickable--hover--Color: var(--pf-t--global--text--color--nonstatus--on-purple--hover);
2369
+ --pf-v6-c-label--m-purple--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--nonstatus--on-purple--hover);
2370
+ --pf-v6-c-label--m-purple--m-outline--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--default);
2371
+ --pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--nonstatus--purple--hover);
2372
+ --pf-v6-c-label--m-success--BackgroundColor: var(--pf-t--global--color--status--success--default);
2373
+ --pf-v6-c-label--m-success--Color: var(--pf-t--global--text--color--status--on-success--default);
2374
+ --pf-v6-c-label--m-success__icon--Color: var(--pf-t--global--icon--color--status--on-success--default);
2375
+ --pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--success--hover);
2376
+ --pf-v6-c-label--m-success--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-success--hover);
2377
+ --pf-v6-c-label--m-success--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-success--hover);
2378
+ --pf-v6-c-label--m-success--m-outline__icon--Color: var(--pf-t--global--icon--color--status--success--default);
2379
+ --pf-v6-c-label--m-success--m-outline--BorderColor: var(--pf-t--global--border--color--status--success--default);
2380
+ --pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--success--hover);
2381
+ --pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--success--hover);
2382
+ --pf-v6-c-label--m-warning--BackgroundColor: var(--pf-t--global--color--status--warning--default);
2383
+ --pf-v6-c-label--m-warning--Color: var(--pf-t--global--text--color--status--on-warning--default);
2384
+ --pf-v6-c-label--m-warning__icon--Color: var(--pf-t--global--icon--color--status--on-warning--default);
2385
+ --pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--warning--hover);
2386
+ --pf-v6-c-label--m-warning--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-warning--hover);
2387
+ --pf-v6-c-label--m-warning--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-warning--hover);
2388
+ --pf-v6-c-label--m-warning--m-outline__icon--Color: var(--pf-t--global--icon--color--status--warning--default);
2389
+ --pf-v6-c-label--m-warning--m-outline--BorderColor: var(--pf-t--global--border--color--status--warning--default);
2390
+ --pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
2391
+ --pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--warning--hover);
2392
+ --pf-v6-c-label--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
2393
+ --pf-v6-c-label--m-danger--Color: var(--pf-t--global--text--color--status--on-danger--default);
2394
+ --pf-v6-c-label--m-danger__icon--Color: var(--pf-t--global--icon--color--status--on-danger--default);
2395
+ --pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--danger--hover);
2396
+ --pf-v6-c-label--m-danger--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-danger--hover);
2397
+ --pf-v6-c-label--m-danger--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-danger--hover);
2398
+ --pf-v6-c-label--m-danger--m-outline__icon--Color: var(--pf-t--global--icon--color--status--danger--default);
2399
+ --pf-v6-c-label--m-danger--m-outline--BorderColor: var(--pf-t--global--border--color--status--danger--default);
2400
+ --pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
2401
+ --pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--danger--hover);
2402
+ --pf-v6-c-label--m-info--BackgroundColor: var(--pf-t--global--color--status--info--default);
2403
+ --pf-v6-c-label--m-info--Color: var(--pf-t--global--text--color--status--on-info--default);
2404
+ --pf-v6-c-label--m-info__icon--Color: var(--pf-t--global--icon--color--status--on-info--default);
2405
+ --pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--info--hover);
2406
+ --pf-v6-c-label--m-info--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-info--hover);
2407
+ --pf-v6-c-label--m-info--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-info--hover);
2408
+ --pf-v6-c-label--m-info--m-outline__icon--Color: var(--pf-t--global--icon--color--status--info--default);
2409
+ --pf-v6-c-label--m-info--m-outline--BorderColor: var(--pf-t--global--border--color--status--info--default);
2410
+ --pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--info--hover);
2411
+ --pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--info--hover);
2412
+ --pf-v6-c-label--m-custom--BackgroundColor: var(--pf-t--global--color--status--custom--default);
2413
+ --pf-v6-c-label--m-custom--Color: var(--pf-t--global--text--color--status--on-custom--default);
2414
+ --pf-v6-c-label--m-custom__icon--Color: var(--pf-t--global--icon--color--status--on-custom--default);
2415
+ --pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor: var(--pf-t--global--color--status--custom--hover);
2416
+ --pf-v6-c-label--m-custom--m-clickable--hover--Color: var(--pf-t--global--text--color--status--on-custom--hover);
2417
+ --pf-v6-c-label--m-custom--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--on-custom--hover);
2418
+ --pf-v6-c-label--m-custom--m-outline__icon--Color: var(--pf-t--global--icon--color--status--custom--default);
2419
+ --pf-v6-c-label--m-custom--m-outline--BorderColor: var(--pf-t--global--border--color--status--custom--default);
2420
+ --pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor: var(--pf-t--global--border--color--status--custom--hover);
2421
+ --pf-v6-c-label--m-custom--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--status--custom--hover);
2422
+ --pf-v6-c-label--m-clickable--hover--BorderWidth: 0;
2423
+ --pf-v6-c-label--m-clickable--hover--BorderColor: transparent;
2424
+ --pf-v6-c-label--m-clickable__content--Cursor: pointer;
2425
+ --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label__icon--Color);
2426
+ --pf-v6-c-label--m-outline--BorderWidth: var(--pf-t--global--border--width--action--default);
2427
+ --pf-v6-c-label--m-outline--BackgroundColor: transparent;
2428
+ --pf-v6-c-label--m-outline--Color: var(--pf-t--global--text--color--regular);
2429
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-t--global--icon--color--regular);
2430
+ --pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor: transparent;
2431
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
2432
+ --pf-v6-c-label--m-outline--m-clickable--hover--Color: var(--pf-t--global--text--color--regular);
2433
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-t--global--icon--color--regular);
2434
+ --pf-v6-c-label--m-overflow--Color: var(--pf-t--global--text--color--brand--default);
2435
+ --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
2436
+ --pf-v6-c-label--m-overflow--hover--Color: var(--pf-t--global--text--color--brand--hover);
2437
+ --pf-v6-c-label--m-overflow--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
2438
+ --pf-v6-c-label--m-add--Color: var(--pf-t--global--text--color--brand--default);
2439
+ --pf-v6-c-label--m-add--BackgroundColor: transparent;
2440
+ --pf-v6-c-label--m-add--BorderColor: var(--pf-t--global--border--color--default);
2441
+ --pf-v6-c-label--m-add--BorderWidth: var(--pf-t--global--border--width--action--default);
2442
+ --pf-v6-c-label--m-add--hover--Color: var(--pf-t--global--text--color--brand--hover);
2443
+ --pf-v6-c-label--m-add--hover--BackgroundColor: transparent;
2444
+ --pf-v6-c-label--m-add--hover--BorderColor: var(--pf-t--global--border--color--hover);
2445
+ --pf-v6-c-label--m-add--hover--BorderWidth: var(--pf-t--global--border--width--action--hover);
2446
+ --pf-v6-c-label--m-compact--PaddingBlockStart: 0;
2447
+ --pf-v6-c-label--m-compact--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
2448
+ --pf-v6-c-label--m-compact--PaddingBlockEnd: 0;
2449
+ --pf-v6-c-label--m-compact--PaddingInlineStart: var(--pf-t--global--spacer--sm);
2450
+ --pf-v6-c-label--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
2451
+ --pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset: 0.0625rem;
2452
+ --pf-v6-c-label--m-compact--MinWidth: calc((var(--pf-v6-c-label--m-compact--FontSize) * var(--pf-t--global--font--line-height--body)) + (var(--pf-v6-c-label--m-compact--PaddingBlockStart) + var(--pf-v6-c-label--m-compact--PaddingBlockEnd)));
2453
+ --pf-v6-c-label__content--MaxWidth: 100%;
2454
+ --pf-v6-c-label__content--Gap: var(--pf-t--global--spacer--gap--text-to-element--compact);
2455
+ --pf-v6-c-label__content--Cursor: initial;
2456
+ --pf-v6-c-label__icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
2457
+ --pf-v6-c-label__text--MaxWidth: 100%;
2458
+ --pf-v6-c-label__actions--MarginInlineEnd: calc(var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd) * -1);
2459
+ --pf-v6-c-label__actions--c-button--FontSize: var(--pf-t--global--icon--size--font--body--sm);
2460
+ --pf-v6-c-label__actions--c-button--OutlineOffset: -0.1875rem;
2461
+ --pf-v6-c-label__actions--c-button--MarginBlockStart: calc(var(--pf-v6-c-label__actions--c-button--PaddingBlockStart) * -1);
2462
+ --pf-v6-c-label__actions--c-button--MarginBlockEnd: calc(var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd) * -1);
2463
+ --pf-v6-c-label__actions--c-button--PaddingBlockStart: var(--pf-t--global--spacer--xs);
2464
+ --pf-v6-c-label__actions--c-button--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
2465
+ --pf-v6-c-label__actions--c-button--PaddingBlockEnd: var(--pf-t--global--spacer--xs);
2466
+ --pf-v6-c-label__actions--c-button--PaddingInlineStart: var(--pf-t--global--spacer--xs);
2467
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--default);
2468
+ --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--default);
2469
+ --pf-v6-c-label--m-editable--hover--TextDecorationLine: var(--pf-t--global--text-decoration--editable-text--line--hover);
2470
+ --pf-v6-c-label--m-editable--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--editable-text--style--hover);
2471
+ --pf-v6-c-label--m-editable--TextUnderlineOffset: 0.25rem;
2472
+ --pf-v6-c-label--m-editable__content--MaxWidth: 16ch;
2473
+ --pf-v6-c-label--m-editable__content--Cursor: pointer;
2474
+ --pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine: none;
2475
+ --pf-v6-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
2476
+ --pf-v6-c-label--m-editable--m-editable-active--Color: var(--pf-t--global--text--color--regular);
2477
+ --pf-v6-c-label--m-editable--m-editable-active__content--Cursor: initial;
2478
+ --pf-v6-c-label--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
2479
+ --pf-v6-c-label--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
2480
+ --pf-v6-c-label--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
2481
+ --pf-v6-c-label--m-disabled--c-button--disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
2482
+ }
2483
+
2484
+ .pf-v6-c-label {
2485
+ position: relative;
2486
+ min-width: var(--pf-v6-c-label--MinWidth);
2487
+ max-width: var(--pf-v6-c-label--MaxWidth);
2488
+ padding-block-start: var(--pf-v6-c-label--PaddingBlockStart);
2489
+ padding-block-end: var(--pf-v6-c-label--PaddingBlockEnd);
2490
+ padding-inline-start: var(--pf-v6-c-label--PaddingInlineStart);
2491
+ padding-inline-end: var(--pf-v6-c-label--PaddingInlineEnd);
2492
+ font-size: var(--pf-v6-c-label--FontSize);
2493
+ white-space: nowrap;
2494
+ background: transparent;
2495
+ isolation: isolate;
2496
+ border: 0;
2497
+ border-radius: var(--pf-v6-c-label--BorderRadius);
2525
2498
  }
2526
2499
 
2527
- .pf-v6-c-button__progress {
2528
- position: absolute;
2529
- inset-block-start: var(--pf-v6-c-button__progress--InsetBlockStart);
2530
- inset-inline-start: var(--pf-v6-c-button__progress--InsetInlineStart);
2531
- line-height: 1;
2532
- color: var(--pf-v6-c-button__progress--Color);
2533
- transform: translate(var(--pf-v6-c-button__progress--TranslateX), var(--pf-v6-c-button__progress--TranslateY));
2500
+ .pf-v6-c-label.pf-m-blue {
2501
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-blue--BackgroundColor);
2502
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-blue--Color);
2503
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-blue__icon--Color);
2504
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-blue--m-clickable--hover--BackgroundColor);
2505
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover--Color);
2506
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-blue--m-clickable--hover__icon--Color);
2507
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--BorderColor);
2508
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-blue--m-outline--m-clickable--hover--BorderColor);
2534
2509
  }
2535
2510
 
2536
- .pf-v6-c-button__progress .pf-v6-c-spinner {
2537
- --pf-v6-c-spinner--Color: currentcolor;
2511
+ .pf-v6-c-label.pf-m-red {
2512
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-red--BackgroundColor);
2513
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-red--Color);
2514
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-red__icon--Color);
2515
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-red--m-clickable--hover--BackgroundColor);
2516
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-red--m-clickable--hover--Color);
2517
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-red--m-clickable--hover__icon--Color);
2518
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-red--m-outline--BorderColor);
2519
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-red--m-outline--m-clickable--hover--BorderColor);
2538
2520
  }
2539
2521
 
2540
- .pf-v6-c-button__text {
2541
- text-decoration: inherit;
2522
+ .pf-v6-c-label.pf-m-orange {
2523
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orange--BackgroundColor);
2524
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orange--Color);
2525
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orange__icon--Color);
2526
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orange--m-clickable--hover--BackgroundColor);
2527
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover--Color);
2528
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orange--m-clickable--hover__icon--Color);
2529
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--BorderColor);
2530
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orange--m-outline--m-clickable--hover--BorderColor);
2542
2531
  }
2543
2532
 
2544
- .pf-v6-c-button__count {
2545
- display: inline-flex;
2546
- align-items: center;
2533
+ .pf-v6-c-label.pf-m-orangered {
2534
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-orangered--BackgroundColor);
2535
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-orangered--Color);
2536
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-orangered__icon--Color);
2537
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-orangered--m-clickable--hover--BackgroundColor);
2538
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover--Color);
2539
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-orangered--m-clickable--hover__icon--Color);
2540
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--BorderColor);
2541
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-orangered--m-outline--m-clickable--hover--BorderColor);
2547
2542
  }
2548
2543
 
2549
- .pf-v6-c-button--hamburger-icon path {
2550
- fill: none;
2551
- stroke: currentcolor;
2552
- stroke-linecap: round;
2553
- stroke-linejoin: round;
2554
- transition: d var(--pf-v6-c-button--hamburger-icon--TransitionDuration) var(--pf-v6-c-button--hamburger-icon--TransitionTimingFunction);
2544
+ .pf-v6-c-label.pf-m-yellow {
2545
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-yellow--BackgroundColor);
2546
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-yellow--Color);
2547
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-yellow__icon--Color);
2548
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-yellow--m-clickable--hover--BackgroundColor);
2549
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover--Color);
2550
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-yellow--m-clickable--hover__icon--Color);
2551
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--BorderColor);
2552
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-yellow--m-outline--m-clickable--hover--BorderColor);
2555
2553
  }
2556
2554
 
2557
- .pf-v6-c-button--hamburger-icon--top {
2558
- d: var(--pf-v6-c-button--hamburger-icon--top--path);
2555
+ .pf-v6-c-label.pf-m-green {
2556
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-green--BackgroundColor);
2557
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-green--Color);
2558
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-green__icon--Color);
2559
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-green--m-clickable--hover--BackgroundColor);
2560
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-green--m-clickable--hover--Color);
2561
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-green--m-clickable--hover__icon--Color);
2562
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-green--m-outline--BorderColor);
2563
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-green--m-outline--m-clickable--hover--BorderColor);
2559
2564
  }
2560
2565
 
2561
- .pf-v6-c-button--hamburger-icon--middle {
2562
- d: var(--pf-v6-c-button--hamburger-icon--middle--path);
2566
+ .pf-v6-c-label.pf-m-teal {
2567
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-teal--BackgroundColor);
2568
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-teal--Color);
2569
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-teal__icon--Color);
2570
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-teal--m-clickable--hover--BackgroundColor);
2571
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover--Color);
2572
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-teal--m-clickable--hover__icon--Color);
2573
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--BorderColor);
2574
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-teal--m-outline--m-clickable--hover--BorderColor);
2563
2575
  }
2564
2576
 
2565
- .pf-v6-c-button--hamburger-icon--arrow {
2566
- d: var(--pf-v6-c-button--hamburger-icon--arrow--path);
2577
+ .pf-v6-c-label.pf-m-purple {
2578
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-purple--BackgroundColor);
2579
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-purple--Color);
2580
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-purple__icon--Color);
2581
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-purple--m-clickable--hover--BackgroundColor);
2582
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover--Color);
2583
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-purple--m-clickable--hover__icon--Color);
2584
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--BorderColor);
2585
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-purple--m-outline--m-clickable--hover--BorderColor);
2567
2586
  }
2568
2587
 
2569
- .pf-v6-c-button--hamburger-icon--bottom {
2570
- d: var(--pf-v6-c-button--hamburger-icon--bottom--path);
2588
+ .pf-v6-c-label.pf-m-success {
2589
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-success--BackgroundColor);
2590
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-success--Color);
2591
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-success__icon--Color);
2592
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-success--m-clickable--hover--BackgroundColor);
2593
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-success--m-clickable--hover--Color);
2594
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-clickable--hover__icon--Color);
2595
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-success--m-outline__icon--Color);
2596
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-success--m-outline--BorderColor);
2597
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover--BorderColor);
2598
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color);
2571
2599
  }
2572
2600
 
2573
- @keyframes pf-v6-c-button-icon-notify {
2574
- 33% {
2575
- transform: rotate(30deg);
2576
- }
2577
- 66% {
2578
- transform: rotate(-60deg);
2579
- }
2580
- }
2581
- @keyframes pf-v6-c-button-icon-favorited {
2582
- 50% {
2583
- scale: 1.5;
2584
- }
2585
- }
2586
- .pf-v6-c-text-input-group {
2587
- --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
2588
- --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
2589
- --pf-v6-c-text-input-group--m-success--BorderColor: var(--pf-t--global--border--color--status--success--default);
2590
- --pf-v6-c-text-input-group--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--default);
2591
- --pf-v6-c-text-input-group--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--default);
2592
- --pf-v6-c-text-input-group--BorderWidth: var(--pf-t--global--border--width--control--default);
2593
- --pf-v6-c-text-input-group__LineHeight: var(--pf-t--global--font--line-height--body);
2594
- --pf-v6-c-text-input-group__FontSize: var(--pf-t--global--font--size--body--default);
2595
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-t--global--border--color--hover);
2596
- --pf-v6-c-text-input-group--m-hover--m-success--BorderColor: var(--pf-t--global--border--color--status--success--hover);
2597
- --pf-v6-c-text-input-group--m-hover--m-warning--BorderColor: var(--pf-t--global--border--color--status--warning--hover);
2598
- --pf-v6-c-text-input-group--m-hover--m-error--BorderColor: var(--pf-t--global--border--color--status--danger--hover);
2599
- --pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
2600
- --pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
2601
- --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
2602
- --pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd: calc(var(--pf-t--global--spacer--sm) + var(--pf-v6-c-text-input-group__icon--FontSize) + var(--pf-t--global--spacer--gap--text-to-element--default));
2603
- --pf-v6-c-text-input-group__main--RowGap: var(--pf-t--global--spacer--xs);
2604
- --pf-v6-c-text-input-group__main--ColumnGap: var(--pf-t--global--spacer--xs);
2605
- --pf-v6-c-text-input-group__text--BorderRadius--base: var(--pf-t--global--border--radius--small);
2606
- --pf-v6-c-text-input-group__text--BorderStartStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
2607
- --pf-v6-c-text-input-group__text--BorderStartEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
2608
- --pf-v6-c-text-input-group__text--BorderEndEndRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
2609
- --pf-v6-c-text-input-group__text--BorderEndStartRadius: var(--pf-v6-c-text-input-group__text--BorderRadius--base);
2610
- --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
2611
- --pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd: calc(var(--pf-t--global--spacer--control--horizontal--plain) / 2);
2612
- --pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) / 2);
2613
- --pf-v6-c-text-input-group__text-input--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--default);
2614
- --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
2615
- --pf-v6-c-text-input-group__text-input--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--default);
2616
- --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
2617
- --pf-v6-c-text-input-group__text-input--MinWidth: 12ch;
2618
- --pf-v6-c-text-input-group__text-input--m-hint--Color: var(--pf-t--global--text--color--placeholder);
2619
- --pf-v6-c-text-input-group__text-input--placeholder--Color: var(--pf-t--global--text--color--placeholder);
2620
- --pf-v6-c-text-input-group__text-input--BackgroundColor: transparent;
2621
- --pf-v6-c-text-input-group__text-input--OutlineOffset: -6px;
2622
- --pf-v6-c-text-input-group__icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
2623
- --pf-v6-c-text-input-group__icon--InsetInlineStart: var(--pf-t--global--spacer--control--horizontal--default);
2624
- --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
2625
- --pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd: var(--pf-t--global--spacer--sm);
2626
- --pf-v6-c-text-input-group__icon--Color: var(--pf-t--global--icon--color--regular);
2627
- --pf-v6-c-text-input-group--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
2628
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-t--global--icon--color--regular);
2629
- --pf-v6-c-text-input-group--m-disabled__icon--m-status--Color: var(--pf-t--global--icon--color--on-disabled);
2630
- --pf-v6-c-text-input-group__main--m-success__icon--m-status--Color: var(--pf-t--global--icon--color--status--success--default);
2631
- --pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color: var(--pf-t--global--icon--color--status--warning--default);
2632
- --pf-v6-c-text-input-group__main--m-error__icon--m-status--Color: var(--pf-t--global--icon--color--status--danger--default);
2633
- --pf-v6-c-text-input-group__icon--TranslateY: -50%;
2634
- --pf-v6-c-text-input-group__utilities--child--MarginInlineStart: var(--pf-t--global--spacer--xs);
2635
- --pf-v6-c-text-input-group--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
2636
- --pf-v6-c-text-input-group--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
2601
+ .pf-v6-c-label.pf-m-warning {
2602
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-warning--BackgroundColor);
2603
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-warning--Color);
2604
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-warning__icon--Color);
2605
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-warning--m-clickable--hover--BackgroundColor);
2606
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover--Color);
2607
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-clickable--hover__icon--Color);
2608
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-warning--m-outline__icon--Color);
2609
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--BorderColor);
2610
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover--BorderColor);
2611
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-warning--m-outline--m-clickable--hover__icon--Color);
2637
2612
  }
2638
2613
 
2639
- .pf-v6-c-text-input-group {
2640
- position: relative;
2641
- display: flex;
2642
- width: 100%;
2643
- font-size: var(--pf-v6-c-text-input-group__FontSize);
2644
- line-height: var(--pf-v6-c-text-input-group__LineHeight);
2645
- color: var(--pf-v6-c-text-input-group--Color, inherit);
2646
- background-color: var(--pf-v6-c-text-input-group--BackgroundColor);
2647
- border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
2648
- border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
2649
- border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
2650
- border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
2614
+ .pf-v6-c-label.pf-m-danger {
2615
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-danger--BackgroundColor);
2616
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-danger--Color);
2617
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-danger__icon--Color);
2618
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-danger--m-clickable--hover--BackgroundColor);
2619
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover--Color);
2620
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-clickable--hover__icon--Color);
2621
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-danger--m-outline__icon--Color);
2622
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--BorderColor);
2623
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover--BorderColor);
2624
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-danger--m-outline--m-clickable--hover__icon--Color);
2651
2625
  }
2652
2626
 
2653
- .pf-v6-c-text-input-group::before {
2654
- position: absolute;
2655
- inset: 0;
2656
- pointer-events: none;
2657
- content: "";
2658
- border: var(--pf-v6-c-text-input-group--BorderWidth) solid var(--pf-v6-c-text-input-group--BorderColor);
2659
- border-start-start-radius: var(--pf-v6-c-text-input-group__text--BorderStartStartRadius);
2660
- border-start-end-radius: var(--pf-v6-c-text-input-group__text--BorderStartEndRadius);
2661
- border-end-start-radius: var(--pf-v6-c-text-input-group__text--BorderEndStartRadius);
2662
- border-end-end-radius: var(--pf-v6-c-text-input-group__text--BorderEndEndRadius);
2627
+ .pf-v6-c-label.pf-m-info {
2628
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-info--BackgroundColor);
2629
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-info--Color);
2630
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-info__icon--Color);
2631
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-info--m-clickable--hover--BackgroundColor);
2632
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-info--m-clickable--hover--Color);
2633
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-clickable--hover__icon--Color);
2634
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-info--m-outline__icon--Color);
2635
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-info--m-outline--BorderColor);
2636
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover--BorderColor);
2637
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-info--m-outline--m-clickable--hover__icon--Color);
2663
2638
  }
2664
2639
 
2665
- .pf-v6-c-text-input-group.pf-m-disabled {
2666
- --pf-v6-c-text-input-group--Color: var(--pf-v6-c-text-input-group--m-disabled--Color);
2667
- --pf-v6-c-text-input-group__icon--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--Color);
2668
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group--m-disabled__icon--m-status--Color);
2669
- --pf-v6-c-text-input-group--BackgroundColor: var(--pf-v6-c-text-input-group--m-disabled--BackgroundColor);
2670
- pointer-events: none;
2640
+ .pf-v6-c-label.pf-m-custom {
2641
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-custom--BackgroundColor);
2642
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-custom--Color);
2643
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-custom__icon--Color);
2644
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-custom--m-clickable--hover--BackgroundColor);
2645
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover--Color);
2646
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-custom--m-clickable--hover__icon--Color);
2647
+ --pf-v6-c-label--m-outline__icon--Color: var(--pf-v6-c-label--m-custom--m-outline__icon--Color);
2648
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--BorderColor);
2649
+ --pf-v6-c-label--m-outline--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-custom--m-outline--m-clickable--hover--BorderColor);
2650
+ --pf-v6-c-label--m-outline--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-success--m-outline--m-clickable--hover__icon--Color);
2671
2651
  }
2672
2652
 
2673
- .pf-v6-c-text-input-group.pf-m-plain {
2674
- --pf-v6-c-text-input-group--BackgroundColor: transparent;
2653
+ .pf-v6-c-label.pf-m-compact {
2654
+ --pf-v6-c-label--PaddingBlockStart: var(--pf-v6-c-label--m-compact--PaddingBlockStart);
2655
+ --pf-v6-c-label--PaddingInlineEnd: var(--pf-v6-c-label--m-compact--PaddingInlineEnd);
2656
+ --pf-v6-c-label--PaddingBlockEnd: var(--pf-v6-c-label--m-compact--PaddingBlockEnd);
2657
+ --pf-v6-c-label--PaddingInlineStart: var(--pf-v6-c-label--m-compact--PaddingInlineStart);
2658
+ --pf-v6-c-label--FontSize: var(--pf-v6-c-label--m-compact--FontSize);
2659
+ --pf-v6-c-label--MinWidth: var(--pf-v6-c-label--m-compact--MinWidth);
2660
+ --pf-v6-c-label--m-editable--TextUnderlineOffset: var(--pf-v6-c-label--m-compact--m-editable--TextUnderlineOffset);
2675
2661
  }
2676
2662
 
2677
- .pf-v6-c-text-input-group.pf-m-plain::before {
2678
- border: 0;
2663
+ .pf-v6-c-label.pf-m-filled .pf-v6-c-label__actions .pf-v6-c-button {
2664
+ --pf-v6-c-button__icon--Color: var(--pf-v6-c-label--m-filled__actions--c-button__icon--Color);
2679
2665
  }
2680
2666
 
2681
- .pf-v6-c-text-input-group.pf-m-success {
2682
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-success--BorderColor);
2683
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-success--BorderColor);
2684
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-success__icon--m-status--Color);
2667
+ .pf-v6-c-label.pf-m-outline {
2668
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-outline--Color);
2669
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-outline--BorderWidth);
2670
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-outline--BorderColor);
2671
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-outline--BackgroundColor);
2672
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-outline__icon--Color);
2673
+ --pf-v6-c-label--m-clickable--hover--BackgroundColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BackgroundColor);
2674
+ --pf-v6-c-label--m-clickable--hover--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
2675
+ --pf-v6-c-label--m-clickable--hover--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
2676
+ --pf-v6-c-label--m-clickable--hover--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover--Color);
2677
+ --pf-v6-c-label--m-clickable--hover__icon--Color: var(--pf-v6-c-label--m-outline--m-clickable--hover__icon--Color);
2685
2678
  }
2686
2679
 
2687
- .pf-v6-c-text-input-group.pf-m-warning {
2688
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-warning--BorderColor);
2689
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-warning--BorderColor);
2690
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-warning__icon--m-status--Color);
2680
+ .pf-v6-c-label.pf-m-editable {
2681
+ --pf-v6-c-label__content--MaxWidth: var(--pf-v6-c-label--m-editable__content--MaxWidth);
2682
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable__content--Cursor);
2691
2683
  }
2692
2684
 
2693
- .pf-v6-c-text-input-group.pf-m-error {
2694
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-error--BorderColor);
2695
- --pf-v6-c-text-input-group--m-hover--BorderColor: var(--pf-v6-c-text-input-group--m-hover--m-error--BorderColor);
2696
- --pf-v6-c-text-input-group__icon--m-status--Color: var(--pf-v6-c-text-input-group__main--m-error__icon--m-status--Color);
2685
+ .pf-v6-c-label.pf-m-editable .pf-v6-c-label__content:is(:hover, :focus) {
2686
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--hover--TextDecorationLine);
2687
+ --pf-v6-c-label--m-editable--TextDecorationStyle: var(--pf-v6-c-label--m-editable--hover--TextDecorationStyle);
2697
2688
  }
2698
2689
 
2699
- @media (prefers-reduced-motion: no-preference) {
2700
- .pf-v6-c-text-input-group.pf-m-error {
2701
- translate: var(--pf-v6-global--danger-jiggle--TranslateX, 0);
2702
- animation-name: pf-v6-global-danger-jiggle-motion;
2703
- animation-duration: var(--pf-v6-global--danger-jiggle--AnimationDuration--Transform);
2704
- animation-timing-function: var(--pf-v6-global--danger-jiggle--AnimationTimingFunction--Transform);
2705
- animation-fill-mode: both;
2706
- }
2690
+ .pf-v6-c-label.pf-m-editable .pf-v6-c-label__text {
2691
+ text-decoration-line: var(--pf-v6-c-label--m-editable--TextDecorationLine);
2692
+ text-decoration-style: var(--pf-v6-c-label--m-editable--TextDecorationStyle);
2693
+ text-underline-offset: var(--pf-v6-c-label--m-editable--TextUnderlineOffset);
2707
2694
  }
2708
- .pf-v6-c-text-input-group.pf-m-error .pf-v6-c-text-input-group__icon.pf-m-status {
2709
- --pf-v6-c-text-input-group--TransitionDuration--Opacity: var(--pf-t--global--motion--duration--fade--default);
2710
- --pf-v6-c-text-input-group--TransitionTimingFunction--Opacity: var(--pf-t--global--motion--timing-function--default);
2711
- animation-name: pf-v6-global-fade-in;
2712
- animation-duration: var(--pf-v6-c-text-input-group--TransitionDuration--Opacity);
2713
- animation-timing-function: var(--pf-v6-c-text-input-group--TransitionTimingFunction--Opacity);
2695
+
2696
+ .pf-v6-c-label.pf-m-editable-active {
2697
+ --pf-v6-c-label--m-editable--TextDecorationLine: var(--pf-v6-c-label--m-editable--m-editable-active--TextDecorationLine);
2698
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-editable--m-editable-active--BackgroundColor);
2699
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-editable--m-editable-active--Color);
2700
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-editable--m-editable-active__content--Cursor);
2714
2701
  }
2715
2702
 
2716
- .pf-v6-c-text-input-group:hover {
2717
- --pf-v6-c-text-input-group--BorderColor: var(--pf-v6-c-text-input-group--m-hover--BorderColor);
2703
+ .pf-v6-c-label.pf-m-overflow {
2704
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-overflow--Color);
2705
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-overflow--BackgroundColor);
2718
2706
  }
2719
2707
 
2720
- .pf-v6-c-text-input-group:where(.pf-m-success, .pf-m-warning, .pf-m-error) {
2721
- --pf-v6-c-text-input-group__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd);
2708
+ .pf-v6-c-label.pf-m-overflow:is(:hover, :focus) {
2709
+ --pf-v6-c-label--m-overflow--Color: var(--pf-v6-c-label--m-overflow--hover--Color);
2710
+ --pf-v6-c-label--m-overflow--BackgroundColor: var(--pf-v6-c-label--m-overflow--hover--BackgroundColor);
2722
2711
  }
2723
2712
 
2724
- .pf-v6-c-text-input-group:has(> .pf-v6-c-text-input-group__utilities) {
2725
- --pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd: var(--pf-v6-c-text-input-group--utilities--icon--m-status--InsetInlineEnd);
2726
- --pf-v6-c-text-input-group--status__text-input--PaddingInlineEnd: var(--pf-v6-c-text-input-group--utilities--status__text-input--PaddingInlineEnd);
2713
+ .pf-v6-c-label.pf-m-add {
2714
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-add--Color);
2715
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-add--BackgroundColor);
2716
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-add--BorderColor);
2717
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-add--BorderWidth);
2727
2718
  }
2728
2719
 
2729
- .pf-v6-c-text-input-group__main {
2730
- display: flex;
2731
- flex: 1;
2732
- flex-wrap: wrap;
2733
- gap: var(--pf-v6-c-text-input-group__main--RowGap) var(--pf-v6-c-text-input-group__main--ColumnGap);
2734
- min-width: 0;
2720
+ .pf-v6-c-label.pf-m-add:is(:hover, :focus) {
2721
+ --pf-v6-c-label--m-add--Color: var(--pf-v6-c-label--m-add--hover--Color);
2722
+ --pf-v6-c-label--m-add--BackgroundColor: var(--pf-v6-c-label--m-add--hover--BackgroundColor);
2723
+ --pf-v6-c-label--m-add--BorderColor: var(--pf-v6-c-label--m-add--hover--BorderColor);
2724
+ --pf-v6-c-label--m-add--BorderWidth: var(--pf-v6-c-label--m-add--hover--BorderWidth);
2735
2725
  }
2736
2726
 
2737
- .pf-v6-c-text-input-group__main.pf-m-icon {
2738
- --pf-v6-c-text-input-group__text--Position: relative;
2739
- --pf-v6-c-text-input-group__text-input--PaddingInlineStart: var(--pf-v6-c-text-input-group__main--m-icon__text-input--PaddingInlineStart);
2740
- display: inline-flex;
2741
- align-items: center;
2742
- justify-content: center;
2743
- min-width: calc(var(--pf-v6-c-text-input-group__LineHeight) * var(--pf-v6-c-text-input-group__FontSize));
2727
+ .pf-v6-c-label.pf-m-clickable {
2728
+ --pf-v6-c-label__content--Cursor: var(--pf-v6-c-label--m-clickable__content--Cursor);
2744
2729
  }
2745
2730
 
2746
- .pf-v6-c-text-input-group__main > :first-child:not(.pf-v6-c-text-input-group__text) {
2747
- margin-inline-start: var(--pf-v6-c-text-input-group__main--first-child--not--text-input--MarginInlineStart);
2731
+ .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content, .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
2732
+ text-decoration-line: none;
2748
2733
  }
2749
2734
 
2750
- .pf-v6-c-text-input-group__main .pf-v6-c-label-group__main {
2751
- padding-block-start: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockStart);
2752
- padding-block-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingBlockEnd);
2753
- padding-inline-end: var(--pf-v6-c-text-input-group--c-label-group__main--PaddingInlineEnd);
2735
+ .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) {
2736
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-clickable--hover--Color);
2737
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
2738
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-clickable--hover--BackgroundColor);
2739
+ --pf-v6-c-label--BorderWidth: var(--pf-v6-c-label--m-clickable--hover--BorderWidth);
2740
+ --pf-v6-c-label--BorderColor: var(--pf-v6-c-label--m-clickable--hover--BorderColor);
2741
+ --pf-v6-c-label--m-outline--BorderWidth: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderWidth);
2742
+ --pf-v6-c-label--m-outline--BorderColor: var(--pf-v6-c-label--m-outline--m-clickable--hover--BorderColor);
2754
2743
  }
2755
2744
 
2756
- .pf-v6-c-text-input-group__text {
2757
- position: var(--pf-v6-c-text-input-group__text--Position, revert);
2758
- display: inline-grid;
2759
- flex: 1;
2760
- grid-template-areas: "text-input";
2761
- grid-template-columns: 1fr;
2745
+ .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) ~ .pf-v6-c-label__actions .pf-v6-c-button {
2746
+ --pf-v6-c-label--m-filled__actions--c-button__icon--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
2762
2747
  }
2763
2748
 
2764
- .pf-v6-c-text-input-group__icon {
2765
- position: absolute;
2766
- inset-block-start: 50%;
2767
- inset-inline-start: var(--pf-v6-c-text-input-group__icon--InsetInlineStart);
2768
- font-size: var(--pf-v6-c-text-input-group__icon--FontSize);
2769
- color: var(--pf-v6-c-text-input-group__icon--Color);
2770
- transform: translateY(var(--pf-v6-c-text-input-group__icon--TranslateY));
2749
+ .pf-v6-c-label.pf-m-disabled {
2750
+ --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-disabled--BackgroundColor);
2751
+ --pf-v6-c-label--Color: var(--pf-v6-c-label--m-disabled--Color);
2752
+ --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-disabled__icon--Color);
2753
+ --pf-v6-c-label--BorderWidth: 0;
2754
+ pointer-events: none;
2771
2755
  }
2772
2756
 
2773
- .pf-v6-c-text-input-group__icon.pf-m-status {
2774
- inset-inline-start: auto;
2775
- inset-inline-end: var(--pf-v6-c-text-input-group__icon--m-status--InsetInlineEnd);
2776
- color: var(--pf-v6-c-text-input-group__icon--m-status--Color);
2757
+ .pf-v6-c-label.pf-m-disabled .pf-v6-c-button {
2758
+ --pf-v6-c-button--m-plain--disabled__icon--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled__icon--Color);
2777
2759
  }
2778
2760
 
2779
- .pf-v6-c-text-input-group__text-input {
2761
+ .pf-v6-c-label,
2762
+ .pf-v6-c-label__content {
2763
+ display: inline-flex;
2764
+ align-items: center;
2765
+ justify-content: center;
2766
+ }
2767
+
2768
+ .pf-v6-c-label__text {
2780
2769
  overflow: hidden;
2781
2770
  text-overflow: ellipsis;
2782
2771
  white-space: nowrap;
2783
- position: relative;
2784
- width: 100%;
2785
- min-width: var(--pf-v6-c-text-input-group__text-input--MinWidth);
2786
- padding-block-start: var(--pf-v6-c-text-input-group__text-input--PaddingBlockStart);
2787
- padding-block-end: var(--pf-v6-c-text-input-group__text-input--PaddingBlockEnd);
2788
- padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
2789
- padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
2790
- background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
2791
- border: 0;
2792
- outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
2772
+ max-width: var(--pf-v6-c-label__text--MaxWidth);
2793
2773
  }
2794
2774
 
2795
- .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
2796
- grid-area: text-input;
2775
+ .pf-v6-c-label__content {
2776
+ gap: var(--pf-v6-c-label__content--Gap);
2777
+ max-width: var(--pf-v6-c-label__content--MaxWidth);
2778
+ padding: 0;
2779
+ overflow: hidden;
2780
+ color: var(--pf-v6-c-label--Color);
2781
+ cursor: var(--pf-v6-c-label__content--Cursor, revert);
2782
+ background: transparent;
2783
+ border-width: 0;
2797
2784
  }
2798
2785
 
2799
- .pf-v6-c-text-input-group__text-input.pf-m-hint {
2800
- color: var(--pf-v6-c-text-input-group__text-input--m-hint--Color);
2786
+ .pf-v6-c-label__content::before {
2787
+ position: absolute;
2788
+ inset: 0;
2789
+ z-index: -1;
2790
+ pointer-events: none;
2791
+ content: "";
2792
+ background-color: var(--pf-v6-c-label--BackgroundColor);
2793
+ border: var(--pf-v6-c-label--BorderWidth) solid var(--pf-v6-c-label--BorderColor);
2794
+ border-radius: var(--pf-v6-c-label--BorderRadius);
2801
2795
  }
2802
2796
 
2803
- .pf-v6-c-text-input-group__text-input::placeholder {
2804
- color: var(--pf-v6-c-text-input-group__text-input--placeholder--Color);
2797
+ input.pf-v6-c-label__content {
2798
+ overflow: hidden;
2799
+ text-overflow: ellipsis;
2800
+ white-space: nowrap;
2805
2801
  }
2806
2802
 
2807
- .pf-v6-c-text-input-group__utilities {
2808
- display: flex;
2809
- align-items: center;
2810
- margin-inline-start: var(--pf-v6-c-text-input-group__utilities--MarginInlineStart);
2811
- margin-inline-end: var(--pf-v6-c-text-input-group__utilities--MarginInlineEnd);
2803
+ .pf-v6-c-label__icon {
2804
+ color: var(--pf-v6-c-label__icon--Color);
2812
2805
  }
2813
2806
 
2814
- .pf-v6-c-text-input-group__utilities > * + * {
2815
- margin-inline-start: var(--pf-v6-c-text-input-group__utilities--child--MarginInlineStart);
2807
+ .pf-v6-c-label__actions {
2808
+ margin-inline-end: var(--pf-v6-c-label__actions--MarginInlineEnd);
2816
2809
  }
2817
2810
 
2818
- .pf-v6-c-text-input-group__group {
2819
- display: flex;
2811
+ .pf-v6-c-label__actions .pf-v6-c-button {
2812
+ --pf-v6-c-button--FontSize: var(--pf-v6-c-label__actions--c-button--FontSize);
2813
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockStart: var(--pf-v6-c-label__actions--c-button--PaddingBlockStart);
2814
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineEnd: var(--pf-v6-c-label__actions--c-button--PaddingInlineEnd);
2815
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingBlockEnd: var(--pf-v6-c-label__actions--c-button--PaddingBlockEnd);
2816
+ --pf-v6-c-button--m-plain--m-no-padding--PaddingInlineStart: var(--pf-v6-c-label__actions--c-button--PaddingInlineStart);
2817
+ margin-block-start: var(--pf-v6-c-label__actions--c-button--MarginBlockStart);
2818
+ margin-block-end: var(--pf-v6-c-label__actions--c-button--MarginBlockEnd);
2819
+ outline-offset: var(--pf-v6-c-label__actions--c-button--OutlineOffset);
2820
2820
  }
2821
2821
 
2822
2822
  .pf-v6-c-menu {
@@ -3485,6 +3485,122 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3485
3485
  outline-offset: var(--pf-v6-c-menu--OutlineOffset);
3486
3486
  }
3487
3487
 
3488
+ .pf-v6-c-breadcrumb {
3489
+ --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3490
+ --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
3491
+ --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3492
+ --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
3493
+ --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3494
+ --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
3495
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3496
+ --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3497
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
3498
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
3499
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
3500
+ --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
3501
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
3502
+ --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
3503
+ --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
3504
+ --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
3505
+ --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
3506
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3507
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
3508
+ --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3509
+ --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
3510
+ }
3511
+
3512
+ .pf-v6-c-breadcrumb {
3513
+ display: inline-flex;
3514
+ }
3515
+
3516
+ .pf-v6-c-breadcrumb__list {
3517
+ display: flex;
3518
+ flex-wrap: wrap;
3519
+ align-items: center;
3520
+ }
3521
+
3522
+ .pf-v6-c-breadcrumb__item {
3523
+ display: flex;
3524
+ align-items: baseline;
3525
+ font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
3526
+ font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
3527
+ line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
3528
+ white-space: nowrap;
3529
+ list-style: none;
3530
+ }
3531
+
3532
+ .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
3533
+ --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
3534
+ }
3535
+
3536
+ .pf-v6-c-breadcrumb__item:not(:last-child) {
3537
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
3538
+ }
3539
+
3540
+ .pf-v6-c-breadcrumb__item-divider {
3541
+ margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
3542
+ font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
3543
+ line-height: 1;
3544
+ color: var(--pf-v6-c-breadcrumb__item-divider--Color);
3545
+ }
3546
+
3547
+ :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
3548
+ scale: -1 1;
3549
+ }
3550
+
3551
+ .pf-v6-c-breadcrumb__link {
3552
+ padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
3553
+ padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
3554
+ font-size: inherit;
3555
+ font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
3556
+ line-height: inherit;
3557
+ color: var(--pf-v6-c-breadcrumb__link--Color);
3558
+ text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
3559
+ text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
3560
+ word-break: break-word;
3561
+ background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
3562
+ }
3563
+
3564
+ .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
3565
+ --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
3566
+ --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
3567
+ --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
3568
+ }
3569
+
3570
+ .pf-v6-c-breadcrumb__link.pf-m-current {
3571
+ cursor: default;
3572
+ }
3573
+
3574
+ .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
3575
+ color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
3576
+ text-decoration-line: none;
3577
+ }
3578
+
3579
+ button.pf-v6-c-breadcrumb__link {
3580
+ border: none;
3581
+ }
3582
+
3583
+ .pf-v6-c-breadcrumb__dropdown {
3584
+ margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
3585
+ margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
3586
+ margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
3587
+ margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
3588
+ }
3589
+
3590
+ .pf-v6-c-breadcrumb__heading {
3591
+ display: inline;
3592
+ font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
3593
+ }
3594
+
3595
+ .pf-v6-c-breadcrumb__link,
3596
+ .pf-v6-c-breadcrumb__heading {
3597
+ white-space: normal;
3598
+ }
3599
+
3600
+ .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
3601
+ display: none;
3602
+ }
3603
+
3488
3604
  .pf-v6-c-tooltip {
3489
3605
  --pf-v6-c-tooltip--MaxWidth: 18.75rem;
3490
3606
  --pf-v6-c-tooltip--BoxShadow: var(--pf-t--global--box-shadow--md);
@@ -3702,119 +3818,4 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
3702
3818
  stroke-dashoffset: 280;
3703
3819
  transform: rotate(720deg);
3704
3820
  }
3705
- }
3706
- .pf-v6-c-breadcrumb {
3707
- --pf-v6-c-breadcrumb__item--FontSize: var(--pf-t--global--font--size--body--sm);
3708
- --pf-v6-c-breadcrumb__item--LineHeight: var(--pf-t--global--font--line-height--body);
3709
- --pf-v6-c-breadcrumb__item--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3710
- --pf-v6-c-breadcrumb__item-divider--Color: var(--pf-t--global--icon--color--regular);
3711
- --pf-v6-c-breadcrumb__item-divider--MarginInlineEnd: var(--pf-t--global--spacer--sm);
3712
- --pf-v6-c-breadcrumb__item-divider--FontSize: var( --pf-t--global--font--size--body--sm);
3713
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: var(--pf-t--global--spacer--sm);
3714
- --pf-v6-c-breadcrumb__link--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
3715
- --pf-v6-c-breadcrumb__link--Color: var(--pf-t--global--text--color--link--default);
3716
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--default);
3717
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--default);
3718
- --pf-v6-c-breadcrumb__link--hover--Color: var(--pf-t--global--text--color--link--hover);
3719
- --pf-v6-c-breadcrumb__link--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
3720
- --pf-v6-c-breadcrumb__link--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
3721
- --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
3722
- --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
3723
- --pf-v6-c-breadcrumb__heading--FontSize: var( --pf-t--global--font--size--body--sm);
3724
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3725
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
3726
- --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
3727
- --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
3728
- }
3729
-
3730
- .pf-v6-c-breadcrumb {
3731
- display: inline-flex;
3732
- }
3733
-
3734
- .pf-v6-c-breadcrumb__list {
3735
- display: flex;
3736
- flex-wrap: wrap;
3737
- align-items: center;
3738
- }
3739
-
3740
- .pf-v6-c-breadcrumb__item {
3741
- display: flex;
3742
- align-items: baseline;
3743
- font-size: var(--pf-v6-c-breadcrumb__item--FontSize);
3744
- font-weight: var(--pf-v6-c-breadcrumb__item--FontWeight);
3745
- line-height: var(--pf-v6-c-breadcrumb__item--LineHeight);
3746
- white-space: nowrap;
3747
- list-style: none;
3748
- }
3749
-
3750
- .pf-v6-c-breadcrumb__item:first-child:has(.pf-v6-c-breadcrumb__link) {
3751
- --pf-v6-c-breadcrumb__link--PaddingInlineStart: 0;
3752
- }
3753
-
3754
- .pf-v6-c-breadcrumb__item:not(:last-child) {
3755
- margin-inline-end: var(--pf-v6-c-breadcrumb__item--MarginInlineEnd);
3756
- }
3757
-
3758
- .pf-v6-c-breadcrumb__item-divider {
3759
- margin-inline-end: var(--pf-v6-c-breadcrumb__item-divider--MarginInlineEnd);
3760
- font-size: var(--pf-v6-c-breadcrumb__item-divider--FontSize);
3761
- line-height: 1;
3762
- color: var(--pf-v6-c-breadcrumb__item-divider--Color);
3763
- }
3764
-
3765
- :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-breadcrumb__item-divider {
3766
- scale: -1 1;
3767
- }
3768
-
3769
- .pf-v6-c-breadcrumb__link {
3770
- padding-inline-start: var(--pf-v6-c-breadcrumb__link--PaddingInlineStart);
3771
- padding-inline-end: var(--pf-v6-c-breadcrumb__link--PaddingInlineEnd);
3772
- font-size: inherit;
3773
- font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
3774
- line-height: inherit;
3775
- color: var(--pf-v6-c-breadcrumb__link--Color);
3776
- text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
3777
- text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
3778
- word-break: break-word;
3779
- background-color: var(--pf-v6-c-breadcrumb__link--BackgroundColor);
3780
- }
3781
-
3782
- .pf-v6-c-breadcrumb__link:is(:hover, :focus) {
3783
- --pf-v6-c-breadcrumb__link--Color: var(--pf-v6-c-breadcrumb__link--hover--Color);
3784
- --pf-v6-c-breadcrumb__link--TextDecorationLine: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationLine);
3785
- --pf-v6-c-breadcrumb__link--TextDecorationStyle: var(--pf-v6-c-breadcrumb__link--hover--TextDecorationStyle);
3786
- }
3787
-
3788
- .pf-v6-c-breadcrumb__link.pf-m-current {
3789
- cursor: default;
3790
- }
3791
-
3792
- .pf-v6-c-breadcrumb__link.pf-m-current, .pf-v6-c-breadcrumb__link.pf-m-current:is(:hover, :focus) {
3793
- color: var(--pf-v6-c-breadcrumb__link--m-current--Color);
3794
- text-decoration-line: none;
3795
- }
3796
-
3797
- button.pf-v6-c-breadcrumb__link {
3798
- border: none;
3799
- }
3800
-
3801
- .pf-v6-c-breadcrumb__dropdown {
3802
- margin-block-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart);
3803
- margin-block-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd);
3804
- margin-inline-start: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart);
3805
- margin-inline-end: var(--pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd);
3806
- }
3807
-
3808
- .pf-v6-c-breadcrumb__heading {
3809
- display: inline;
3810
- font-size: var(--pf-v6-c-breadcrumb__heading--FontSize);
3811
- }
3812
-
3813
- .pf-v6-c-breadcrumb__link,
3814
- .pf-v6-c-breadcrumb__heading {
3815
- white-space: normal;
3816
- }
3817
-
3818
- .pf-v6-c-breadcrumb__list > :first-child .pf-v6-c-breadcrumb__item-divider {
3819
- display: none;
3820
3821
  }