@itwin/itwinui-css 0.40.0 → 0.42.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (27) hide show
  1. package/css/all.css +386 -211
  2. package/css/breadcrumbs.css +11 -6
  3. package/css/button.css +195 -148
  4. package/css/header.css +16 -14
  5. package/css/inputs.css +12 -12
  6. package/css/table.css +31 -21
  7. package/css/tile.css +14 -9
  8. package/css/tree.css +107 -0
  9. package/css/user-icon.css +3 -1
  10. package/package.json +1 -1
  11. package/scss/button/borderless.scss +13 -6
  12. package/scss/button/button-group.scss +59 -46
  13. package/scss/button/cta.scss +15 -8
  14. package/scss/button/default.scss +16 -9
  15. package/scss/button/high-visibility.scss +15 -8
  16. package/scss/button/split-menu.scss +34 -20
  17. package/scss/classes.scss +1 -0
  18. package/scss/header/header.scss +16 -8
  19. package/scss/index.scss +1 -0
  20. package/scss/inputs/classes.scss +2 -2
  21. package/scss/inputs/labeled-inputs.scss +3 -3
  22. package/scss/table/paginator.scss +33 -21
  23. package/scss/table/table.scss +10 -6
  24. package/scss/tree/classes.scss +15 -0
  25. package/scss/tree/index.scss +3 -0
  26. package/scss/tree/tree.scss +137 -0
  27. package/scss/user-icon/user-icon.scss +3 -0
package/css/all.css CHANGED
@@ -601,17 +601,22 @@ html.iui-theme-dark{
601
601
  .iui-breadcrumbs-item .iui-button > .iui-button-icon:only-child{
602
602
  margin-left:3px;
603
603
  margin-right:3px; }
604
- .iui-breadcrumbs-item .iui-button:hover, .iui-breadcrumbs-item .iui-button:focus{
604
+ .iui-breadcrumbs-item .iui-button:focus{
605
605
  background-color:rgba(0, 0, 0, 0.1);
606
606
  border-color:transparent;
607
607
  background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
608
608
  border-color:transparent; }
609
- .iui-breadcrumbs-item .iui-button:focus:not(:focus-visible){
609
+ .iui-breadcrumbs-item .iui-button:focus:where(:not(:focus-visible)){
610
+ border-color:transparent;
611
+ background-color:transparent; }
612
+ .iui-breadcrumbs-item .iui-button:focus:where(:not(:focus-visible)) > .iui-button-icon:only-child{
613
+ margin-left:3px;
614
+ margin-right:3px; }
615
+ .iui-breadcrumbs-item .iui-button:hover{
616
+ background-color:rgba(0, 0, 0, 0.1);
610
617
  border-color:transparent;
611
- background-color:transparent; }
612
- .iui-breadcrumbs-item .iui-button:focus:not(:focus-visible) > .iui-button-icon:only-child{
613
- margin-left:3px;
614
- margin-right:3px; }
618
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
619
+ border-color:transparent; }
615
620
  .iui-breadcrumbs-item .iui-button.iui-active{
616
621
  background-color:rgba(0, 139, 225, 0.1);
617
622
  color:#008BE1;
@@ -733,7 +738,27 @@ html.iui-theme-dark{
733
738
  background-color:var(--iui-color-background-1);
734
739
  border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
735
740
  color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
736
- .iui-button.iui-default:hover, .iui-button.iui-default:active, .iui-button.iui-default:focus{
741
+ .iui-button.iui-default:focus{
742
+ background-color:#f2f2f2;
743
+ border-color:black;
744
+ color:black;
745
+ background-color:var(--iui-color-background-1-overlay);
746
+ border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
747
+ color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1)); }
748
+ .iui-button.iui-default:focus .iui-notification-primary::before,
749
+ .iui-button.iui-default:focus .iui-notification-positive::before,
750
+ .iui-button.iui-default:focus .iui-notification-warning::before,
751
+ .iui-button.iui-default:focus .iui-notification-negative::before{
752
+ border-color:#f2f2f2;
753
+ border-color:var(--iui-color-background-1-overlay); }
754
+ .iui-button.iui-default:focus:where(:not(:focus-visible)){
755
+ background-color:#FFF;
756
+ border-color:rgba(0, 0, 0, 0.4);
757
+ color:rgba(0, 0, 0, 0.8);
758
+ background-color:var(--iui-color-background-1);
759
+ border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
760
+ color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
761
+ .iui-button.iui-default:hover, .iui-button.iui-default:active{
737
762
  background-color:#f2f2f2;
738
763
  border-color:black;
739
764
  color:black;
@@ -746,19 +771,9 @@ html.iui-theme-dark{
746
771
  .iui-button.iui-default:hover .iui-notification-negative::before, .iui-button.iui-default:active .iui-notification-primary::before,
747
772
  .iui-button.iui-default:active .iui-notification-positive::before,
748
773
  .iui-button.iui-default:active .iui-notification-warning::before,
749
- .iui-button.iui-default:active .iui-notification-negative::before, .iui-button.iui-default:focus .iui-notification-primary::before,
750
- .iui-button.iui-default:focus .iui-notification-positive::before,
751
- .iui-button.iui-default:focus .iui-notification-warning::before,
752
- .iui-button.iui-default:focus .iui-notification-negative::before{
774
+ .iui-button.iui-default:active .iui-notification-negative::before{
753
775
  border-color:#f2f2f2;
754
776
  border-color:var(--iui-color-background-1-overlay); }
755
- .iui-button.iui-default:focus:not(:focus-visible){
756
- background-color:#FFF;
757
- border-color:rgba(0, 0, 0, 0.4);
758
- color:rgba(0, 0, 0, 0.8);
759
- background-color:var(--iui-color-background-1);
760
- border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
761
- color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
762
777
  .iui-button.iui-default.iui-dropdown{
763
778
  padding-right:8px; }
764
779
  .iui-button.iui-default.iui-dropdown.iui-small{
@@ -785,19 +800,26 @@ html.iui-theme-dark{
785
800
  background-color:var(--iui-color-background-primary);
786
801
  border-color:var(--iui-color-background-primary);
787
802
  color:var(--iui-color-foreground-accessory); }
788
- .iui-button.iui-high-visibility:hover, .iui-button.iui-high-visibility:active, .iui-button.iui-high-visibility:focus{
803
+ .iui-button.iui-high-visibility:focus{
789
804
  background-color:#006bae;
790
805
  border-color:#006bae;
791
806
  color:#FFF;
792
807
  background-color:var(--iui-color-background-primary-overlay);
793
808
  border-color:var(--iui-color-background-primary-overlay);
794
809
  color:var(--iui-color-foreground-accessory); }
795
- .iui-button.iui-high-visibility:focus:not(:focus-visible){
796
- background-color:#008BE1;
797
- border-color:#008BE1;
810
+ .iui-button.iui-high-visibility:focus:where(:not(:focus-visible)){
811
+ background-color:#008BE1;
812
+ border-color:#008BE1;
813
+ color:#FFF;
814
+ background-color:var(--iui-color-background-primary);
815
+ border-color:var(--iui-color-background-primary);
816
+ color:var(--iui-color-foreground-accessory); }
817
+ .iui-button.iui-high-visibility:hover, .iui-button.iui-high-visibility:active{
818
+ background-color:#006bae;
819
+ border-color:#006bae;
798
820
  color:#FFF;
799
- background-color:var(--iui-color-background-primary);
800
- border-color:var(--iui-color-background-primary);
821
+ background-color:var(--iui-color-background-primary-overlay);
822
+ border-color:var(--iui-color-background-primary-overlay);
801
823
  color:var(--iui-color-foreground-accessory); }
802
824
  .iui-button.iui-high-visibility[disabled], .iui-button.iui-high-visibility:disabled{
803
825
  cursor:not-allowed;
@@ -814,19 +836,26 @@ html.iui-theme-dark{
814
836
  background-color:var(--iui-color-background-positive);
815
837
  border-color:var(--iui-color-background-positive);
816
838
  color:var(--iui-color-foreground-accessory); }
817
- .iui-button.iui-cta:hover, .iui-button.iui-cta:active, .iui-button.iui-cta:focus{
839
+ .iui-button.iui-cta:focus{
818
840
  background-color:#3c7613;
819
841
  border-color:#3c7613;
820
842
  color:#FFF;
821
843
  background-color:var(--iui-color-background-positive-overlay);
822
844
  border-color:var(--iui-color-background-positive-overlay);
823
845
  color:var(--iui-color-foreground-accessory); }
824
- .iui-button.iui-cta:focus:not(:focus-visible){
825
- background-color:#53A21A;
826
- border-color:#53A21A;
846
+ .iui-button.iui-cta:focus:where(:not(:focus-visible)){
847
+ background-color:#53A21A;
848
+ border-color:#53A21A;
849
+ color:#FFF;
850
+ background-color:var(--iui-color-background-positive);
851
+ border-color:var(--iui-color-background-positive);
852
+ color:var(--iui-color-foreground-accessory); }
853
+ .iui-button.iui-cta:hover, .iui-button.iui-cta:active{
854
+ background-color:#3c7613;
855
+ border-color:#3c7613;
827
856
  color:#FFF;
828
- background-color:var(--iui-color-background-positive);
829
- border-color:var(--iui-color-background-positive);
857
+ background-color:var(--iui-color-background-positive-overlay);
858
+ border-color:var(--iui-color-background-positive-overlay);
830
859
  color:var(--iui-color-foreground-accessory); }
831
860
  .iui-button.iui-cta[disabled], .iui-button.iui-cta:disabled{
832
861
  cursor:not-allowed;
@@ -848,19 +877,26 @@ html.iui-theme-dark{
848
877
  position:fixed;
849
878
  bottom:11px;
850
879
  right:16px; }
851
- .iui-button.iui-idea:hover, .iui-button.iui-idea:active, .iui-button.iui-idea:focus{
880
+ .iui-button.iui-idea:focus{
852
881
  background-color:#006bae;
853
882
  border-color:#006bae;
854
883
  color:#FFF;
855
884
  background-color:var(--iui-color-background-primary-overlay);
856
885
  border-color:var(--iui-color-background-primary-overlay);
857
886
  color:var(--iui-color-foreground-accessory); }
858
- .iui-button.iui-idea:focus:not(:focus-visible){
859
- background-color:#008BE1;
860
- border-color:#008BE1;
887
+ .iui-button.iui-idea:focus:where(:not(:focus-visible)){
888
+ background-color:#008BE1;
889
+ border-color:#008BE1;
890
+ color:#FFF;
891
+ background-color:var(--iui-color-background-primary);
892
+ border-color:var(--iui-color-background-primary);
893
+ color:var(--iui-color-foreground-accessory); }
894
+ .iui-button.iui-idea:hover, .iui-button.iui-idea:active{
895
+ background-color:#006bae;
896
+ border-color:#006bae;
861
897
  color:#FFF;
862
- background-color:var(--iui-color-background-primary);
863
- border-color:var(--iui-color-background-primary);
898
+ background-color:var(--iui-color-background-primary-overlay);
899
+ border-color:var(--iui-color-background-primary-overlay);
864
900
  color:var(--iui-color-foreground-accessory); }
865
901
  .iui-button.iui-idea[disabled], .iui-button.iui-idea:disabled{
866
902
  cursor:not-allowed;
@@ -879,17 +915,22 @@ html.iui-theme-dark{
879
915
  .iui-button.iui-borderless > .iui-button-icon:only-child{
880
916
  margin-left:3px;
881
917
  margin-right:3px; }
882
- .iui-button.iui-borderless:hover, .iui-button.iui-borderless:focus{
918
+ .iui-button.iui-borderless:focus{
883
919
  background-color:rgba(0, 0, 0, 0.1);
884
920
  border-color:transparent;
885
921
  background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
886
922
  border-color:transparent; }
887
- .iui-button.iui-borderless:focus:not(:focus-visible){
923
+ .iui-button.iui-borderless:focus:where(:not(:focus-visible)){
924
+ border-color:transparent;
925
+ background-color:transparent; }
926
+ .iui-button.iui-borderless:focus:where(:not(:focus-visible)) > .iui-button-icon:only-child{
927
+ margin-left:3px;
928
+ margin-right:3px; }
929
+ .iui-button.iui-borderless:hover{
930
+ background-color:rgba(0, 0, 0, 0.1);
888
931
  border-color:transparent;
889
- background-color:transparent; }
890
- .iui-button.iui-borderless:focus:not(:focus-visible) > .iui-button-icon:only-child{
891
- margin-left:3px;
892
- margin-right:3px; }
932
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
933
+ border-color:transparent; }
893
934
  .iui-button.iui-borderless.iui-active{
894
935
  background-color:rgba(0, 139, 225, 0.1);
895
936
  color:#008BE1;
@@ -932,130 +973,141 @@ html.iui-theme-dark{
932
973
 
933
974
  .iui-button-group{
934
975
  display:inline-flex;
935
- align-items:center; }
936
- .iui-button-group > .iui-button:not(.iui-borderless){
937
- border-radius:0; }
938
- .iui-button-group > .iui-button:first-of-type:not(.iui-borderless){
939
- border-top-left-radius:3px;
940
- border-bottom-left-radius:3px; }
941
- .iui-button-group > .iui-button:last-of-type:not(.iui-borderless){
942
- border-top-right-radius:3px;
943
- border-bottom-right-radius:3px; }
944
- .iui-button-group > .iui-button.iui-default:not(:last-of-type){
945
- border-right:none; }
946
- .iui-button-group > .iui-button.iui-default:not(:disabled) + :disabled{
947
- border-left-color:rgba(0, 0, 0, 0.4);
948
- border-left-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4)); }
949
- .iui-button-group > .iui-button.iui-default:not(:disabled):hover + .iui-button,
950
- .iui-button-group > .iui-button.iui-default:not(:disabled):active + .iui-button,
951
- .iui-button-group > .iui-button.iui-default:not(:disabled):focus-visible + .iui-button{
952
- border-left-color:black;
953
- border-left-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1)); }
954
- .iui-button-group > .iui-button.iui-default:disabled + .iui-button:disabled{
955
- border-left-color:#DCE0E3;
956
- border-left-color:var(--iui-color-background-4); }
957
- .iui-button-group > .iui-active::after{
958
- content:'';
959
- position:absolute;
960
- height:2px;
961
- opacity:1;
962
- top:2px;
963
- left:2px;
964
- width:calc(100% - 4px);
965
- background-color:#008BE1;
966
- background-color:var(--iui-color-foreground-primary); }
967
- .iui-button-group > .iui-active:disabled::after{
968
- background-color:rgba(0, 0, 0, 0.2);
969
- background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
976
+ align-items:center;
977
+ isolation:isolate; }
978
+ .iui-button-group > *{
979
+ display:flex; }
980
+ .iui-button-group > * input:hover, .iui-button-group > * button:hover{
981
+ z-index:1; }
982
+ .iui-button-group > * input:focus, .iui-button-group > * button:focus{
983
+ z-index:2; }
984
+ .iui-button-group > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-button-group > * button:focus:where(:not(:focus-visible):not(:hover)){
985
+ z-index:revert; }
986
+ .iui-button-group > * input:disabled, .iui-button-group > * button:disabled{
987
+ z-index:-1; }
988
+ .iui-button-group > * input.iui-active::after, .iui-button-group > * button.iui-active::after{
989
+ content:'';
990
+ position:absolute;
991
+ height:2px;
992
+ opacity:1;
993
+ top:2px;
994
+ left:2px;
995
+ width:calc(100% - 4px);
996
+ background-color:#008BE1;
997
+ background-color:var(--iui-color-foreground-primary); }
998
+ .iui-button-group > * input.iui-active:disabled::after, .iui-button-group > * button.iui-active:disabled::after{
999
+ background-color:rgba(0, 0, 0, 0.2);
1000
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1001
+ .iui-button-group > * input:not(.iui-borderless), .iui-button-group > * button:not(.iui-borderless){
1002
+ border-radius:0; }
1003
+ .iui-button-group > *:first-child input, .iui-button-group > *:first-child button:not(.iui-borderless){
1004
+ border-top-left-radius:3px;
1005
+ border-bottom-left-radius:3px; }
1006
+ .iui-button-group > *:last-child input, .iui-button-group > *:last-child button:not(.iui-borderless){
1007
+ border-top-right-radius:3px;
1008
+ border-bottom-right-radius:3px; }
1009
+ .iui-button-group > *:not(:last-child){
1010
+ margin-right:-1px; }
1011
+ .iui-button-group > *:not(:first-child) .iui-default:disabled{
1012
+ border-left-color:#DCE0E3;
1013
+ border-left-color:var(--iui-color-background-4); }
970
1014
 
971
1015
  .iui-button-split-menu{
972
1016
  display:inline-flex;
973
1017
  align-items:center;
1018
+ isolation:isolate;
974
1019
  display:inline-flex;
975
- align-items:center; }
976
- .iui-button-split-menu > .iui-button:not(.iui-borderless){
977
- border-radius:0; }
978
- .iui-button-split-menu > .iui-button:first-of-type:not(.iui-borderless){
979
- border-top-left-radius:3px;
980
- border-bottom-left-radius:3px; }
981
- .iui-button-split-menu > .iui-button:last-of-type:not(.iui-borderless){
982
- border-top-right-radius:3px;
983
- border-bottom-right-radius:3px; }
984
- .iui-button-split-menu > .iui-button.iui-default:not(:last-of-type){
985
- border-right:none; }
986
- .iui-button-split-menu > .iui-button.iui-default:not(:disabled) + :disabled{
987
- border-left-color:rgba(0, 0, 0, 0.4);
988
- border-left-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4)); }
989
- .iui-button-split-menu > .iui-button.iui-default:not(:disabled):hover + .iui-button,
990
- .iui-button-split-menu > .iui-button.iui-default:not(:disabled):active + .iui-button,
991
- .iui-button-split-menu > .iui-button.iui-default:not(:disabled):focus-visible + .iui-button{
992
- border-left-color:black;
993
- border-left-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1)); }
994
- .iui-button-split-menu > .iui-button.iui-default:disabled + .iui-button:disabled{
995
- border-left-color:#DCE0E3;
996
- border-left-color:var(--iui-color-background-4); }
997
- .iui-button-split-menu > .iui-active::after{
998
- content:'';
999
- position:absolute;
1000
- height:2px;
1001
- opacity:1;
1002
- top:2px;
1003
- left:2px;
1004
- width:calc(100% - 4px);
1005
- background-color:#008BE1;
1006
- background-color:var(--iui-color-foreground-primary); }
1007
- .iui-button-split-menu > .iui-active:disabled::after{
1008
- background-color:rgba(0, 0, 0, 0.2);
1009
- background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1010
- .iui-button-split-menu > .iui-button:not(.iui-borderless){
1011
- border-radius:0; }
1012
- .iui-button-split-menu > .iui-button:first-of-type:not(.iui-borderless){
1013
- border-top-left-radius:3px;
1014
- border-bottom-left-radius:3px; }
1015
- .iui-button-split-menu > .iui-button:last-of-type:not(.iui-borderless){
1016
- border-top-right-radius:3px;
1017
- border-bottom-right-radius:3px; }
1018
- .iui-button-split-menu > .iui-button.iui-default:not(:last-of-type){
1019
- border-right:none; }
1020
- .iui-button-split-menu > .iui-button.iui-default:not(:disabled) + :disabled{
1021
- border-left-color:rgba(0, 0, 0, 0.4);
1022
- border-left-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4)); }
1023
- .iui-button-split-menu > .iui-button.iui-default:not(:disabled):hover + .iui-button,
1024
- .iui-button-split-menu > .iui-button.iui-default:not(:disabled):active + .iui-button,
1025
- .iui-button-split-menu > .iui-button.iui-default:not(:disabled):focus-visible + .iui-button{
1026
- border-left-color:black;
1027
- border-left-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1)); }
1028
- .iui-button-split-menu > .iui-button.iui-default:disabled + .iui-button:disabled{
1029
- border-left-color:#DCE0E3;
1030
- border-left-color:var(--iui-color-background-4); }
1031
- .iui-button-split-menu > .iui-active::after{
1032
- content:'';
1033
- position:absolute;
1034
- height:2px;
1035
- opacity:1;
1036
- top:2px;
1037
- left:2px;
1038
- width:calc(100% - 4px);
1039
- background-color:#008BE1;
1040
- background-color:var(--iui-color-foreground-primary); }
1041
- .iui-button-split-menu > .iui-active:disabled::after{
1042
- background-color:rgba(0, 0, 0, 0.2);
1043
- background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1020
+ align-items:center;
1021
+ isolation:isolate; }
1022
+ .iui-button-split-menu > *{
1023
+ display:flex; }
1024
+ .iui-button-split-menu > * input:hover, .iui-button-split-menu > * button:hover{
1025
+ z-index:1; }
1026
+ .iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:focus{
1027
+ z-index:2; }
1028
+ .iui-button-split-menu > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-button-split-menu > * button:focus:where(:not(:focus-visible):not(:hover)){
1029
+ z-index:revert; }
1030
+ .iui-button-split-menu > * input:disabled, .iui-button-split-menu > * button:disabled{
1031
+ z-index:-1; }
1032
+ .iui-button-split-menu > * input.iui-active::after, .iui-button-split-menu > * button.iui-active::after{
1033
+ content:'';
1034
+ position:absolute;
1035
+ height:2px;
1036
+ opacity:1;
1037
+ top:2px;
1038
+ left:2px;
1039
+ width:calc(100% - 4px);
1040
+ background-color:#008BE1;
1041
+ background-color:var(--iui-color-foreground-primary); }
1042
+ .iui-button-split-menu > * input.iui-active:disabled::after, .iui-button-split-menu > * button.iui-active:disabled::after{
1043
+ background-color:rgba(0, 0, 0, 0.2);
1044
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1045
+ .iui-button-split-menu > * input:not(.iui-borderless), .iui-button-split-menu > * button:not(.iui-borderless){
1046
+ border-radius:0; }
1047
+ .iui-button-split-menu > *:first-child input, .iui-button-split-menu > *:first-child button:not(.iui-borderless){
1048
+ border-top-left-radius:3px;
1049
+ border-bottom-left-radius:3px; }
1050
+ .iui-button-split-menu > *:last-child input, .iui-button-split-menu > *:last-child button:not(.iui-borderless){
1051
+ border-top-right-radius:3px;
1052
+ border-bottom-right-radius:3px; }
1053
+ .iui-button-split-menu > *:not(:last-child){
1054
+ margin-right:-1px; }
1055
+ .iui-button-split-menu > *:not(:first-child) .iui-default:disabled{
1056
+ border-left-color:#DCE0E3;
1057
+ border-left-color:var(--iui-color-background-4); }
1058
+ .iui-button-split-menu > *{
1059
+ display:flex; }
1060
+ .iui-button-split-menu > * input:hover, .iui-button-split-menu > * button:hover{
1061
+ z-index:1; }
1062
+ .iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:focus{
1063
+ z-index:2; }
1064
+ .iui-button-split-menu > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-button-split-menu > * button:focus:where(:not(:focus-visible):not(:hover)){
1065
+ z-index:revert; }
1066
+ .iui-button-split-menu > * input:disabled, .iui-button-split-menu > * button:disabled{
1067
+ z-index:-1; }
1068
+ .iui-button-split-menu > * input.iui-active::after, .iui-button-split-menu > * button.iui-active::after{
1069
+ content:'';
1070
+ position:absolute;
1071
+ height:2px;
1072
+ opacity:1;
1073
+ top:2px;
1074
+ left:2px;
1075
+ width:calc(100% - 4px);
1076
+ background-color:#008BE1;
1077
+ background-color:var(--iui-color-foreground-primary); }
1078
+ .iui-button-split-menu > * input.iui-active:disabled::after, .iui-button-split-menu > * button.iui-active:disabled::after{
1079
+ background-color:rgba(0, 0, 0, 0.2);
1080
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
1081
+ .iui-button-split-menu > * input:not(.iui-borderless), .iui-button-split-menu > * button:not(.iui-borderless){
1082
+ border-radius:0; }
1083
+ .iui-button-split-menu > *:first-child input, .iui-button-split-menu > *:first-child button:not(.iui-borderless){
1084
+ border-top-left-radius:3px;
1085
+ border-bottom-left-radius:3px; }
1086
+ .iui-button-split-menu > *:last-child input, .iui-button-split-menu > *:last-child button:not(.iui-borderless){
1087
+ border-top-right-radius:3px;
1088
+ border-bottom-right-radius:3px; }
1089
+ .iui-button-split-menu > *:not(:last-child){
1090
+ margin-right:-1px; }
1091
+ .iui-button-split-menu > *:not(:first-child) .iui-default:disabled{
1092
+ border-left-color:#DCE0E3;
1093
+ border-left-color:var(--iui-color-background-4); }
1044
1094
  .iui-button-split-menu:hover{
1045
1095
  background-color:rgba(0, 0, 0, 0.1);
1046
1096
  background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
1047
- .iui-button-split-menu .iui-button:first-child.iui-borderless:hover{
1097
+ .iui-button-split-menu > *:first-child > .iui-borderless:hover{
1048
1098
  background-color:transparent; }
1049
- .iui-button-split-menu > .iui-button + .iui-button{
1099
+ .iui-button-split-menu > *:last-child > .iui-button{
1050
1100
  padding:4px; }
1051
- .iui-button-split-menu > .iui-small + .iui-small{
1101
+ .iui-button-split-menu > *:last-child > .iui-small{
1052
1102
  padding:2px; }
1053
- .iui-button-split-menu > .iui-large + .iui-large{
1103
+ .iui-button-split-menu > *:last-child > .iui-large{
1054
1104
  padding:8px; }
1055
- .iui-button-split-menu > .iui-high-visibility + .iui-high-visibility,
1056
- .iui-button-split-menu > .iui-high-visibility + .iui-high-visibility:hover,
1057
- .iui-button-split-menu > .iui-cta + .iui-cta,
1058
- .iui-button-split-menu > .iui-cta + .iui-cta:hover{
1105
+ .iui-button-split-menu > *:first-child > .iui-high-visibility,
1106
+ .iui-button-split-menu > *:first-child > .iui-cta{
1107
+ border-right-color:rgba(255, 255, 255, 0.4);
1108
+ border-right-color:rgba(var(--iui-color-foreground-accessory-rgb), var(--iui-opacity-4)); }
1109
+ .iui-button-split-menu > *:last-child > .iui-high-visibility,
1110
+ .iui-button-split-menu > *:last-child > .iui-cta{
1059
1111
  border-left-color:rgba(255, 255, 255, 0.4);
1060
1112
  border-left-color:rgba(var(--iui-color-foreground-accessory-rgb), var(--iui-opacity-4)); }
1061
1113
  .iui-button-split-menu.iui-disabled{
@@ -1908,11 +1960,11 @@ html.iui-theme-dark{
1908
1960
  box-shadow:0 2px 0 0 rgba(0, 0, 0, 0.4);
1909
1961
  background-color:rgba(var(--iui-color-foreground-body-rgb), 0.05);
1910
1962
  box-shadow:0 2px 0 0 rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4)); }
1911
- .iui-page-header .iui-header-button.iui-header-button.iui-active.iui-disabled .iui-label, .iui-page-header .iui-header-button.iui-header-button.iui-active:disabled .iui-label{
1963
+ .iui-page-header .iui-header-button.iui-header-button.iui-active.iui-disabled .iui-button-label, .iui-page-header .iui-header-button.iui-header-button.iui-active:disabled .iui-button-label{
1912
1964
  color:rgba(0, 0, 0, 0.2);
1913
1965
  color:var(--iui-icons-color-actionable-disabled); }
1914
- .iui-page-header .iui-header-button.iui-header-button.iui-active.iui-disabled .iui-icon,
1915
- .iui-page-header .iui-header-button.iui-header-button.iui-active.iui-disabled svg, .iui-page-header .iui-header-button.iui-header-button.iui-active:disabled .iui-icon,
1966
+ .iui-page-header .iui-header-button.iui-header-button.iui-active.iui-disabled .iui-button-icon,
1967
+ .iui-page-header .iui-header-button.iui-header-button.iui-active.iui-disabled svg, .iui-page-header .iui-header-button.iui-header-button.iui-active:disabled .iui-button-icon,
1916
1968
  .iui-page-header .iui-header-button.iui-header-button.iui-active:disabled svg{
1917
1969
  fill:rgba(0, 0, 0, 0.2);
1918
1970
  fill:var(--iui-icons-color-actionable-disabled); }
@@ -1932,10 +1984,12 @@ html.iui-theme-dark{
1932
1984
  margin:0;
1933
1985
  padding:0; }
1934
1986
  .iui-page-header .iui-header-split-button{
1935
- height:100%;
1936
- display:flex;
1937
- overflow:hidden;
1938
1987
  max-width:25vw; }
1988
+ .iui-page-header .iui-header-split-button,
1989
+ .iui-page-header .iui-header-split-button > *{
1990
+ height:100%;
1991
+ display:flex;
1992
+ overflow:hidden; }
1939
1993
  .iui-page-header .iui-header-split-button .iui-button{
1940
1994
  padding:0 12px;
1941
1995
  height:49px;
@@ -2012,11 +2066,11 @@ html.iui-theme-dark{
2012
2066
  box-shadow:0 2px 0 0 rgba(0, 0, 0, 0.4);
2013
2067
  background-color:rgba(var(--iui-color-foreground-body-rgb), 0.05);
2014
2068
  box-shadow:0 2px 0 0 rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4)); }
2015
- .iui-page-header .iui-header-split-button .iui-button.iui-active.iui-disabled .iui-label, .iui-page-header .iui-header-split-button .iui-button.iui-active:disabled .iui-label{
2069
+ .iui-page-header .iui-header-split-button .iui-button.iui-active.iui-disabled .iui-button-label, .iui-page-header .iui-header-split-button .iui-button.iui-active:disabled .iui-button-label{
2016
2070
  color:rgba(0, 0, 0, 0.2);
2017
2071
  color:var(--iui-icons-color-actionable-disabled); }
2018
- .iui-page-header .iui-header-split-button .iui-button.iui-active.iui-disabled .iui-icon,
2019
- .iui-page-header .iui-header-split-button .iui-button.iui-active.iui-disabled svg, .iui-page-header .iui-header-split-button .iui-button.iui-active:disabled .iui-icon,
2072
+ .iui-page-header .iui-header-split-button .iui-button.iui-active.iui-disabled .iui-button-icon,
2073
+ .iui-page-header .iui-header-split-button .iui-button.iui-active.iui-disabled svg, .iui-page-header .iui-header-split-button .iui-button.iui-active:disabled .iui-button-icon,
2020
2074
  .iui-page-header .iui-header-split-button .iui-button.iui-active:disabled svg{
2021
2075
  fill:rgba(0, 0, 0, 0.2);
2022
2076
  fill:var(--iui-icons-color-actionable-disabled); }
@@ -2035,7 +2089,7 @@ html.iui-theme-dark{
2035
2089
  width:0.1px;
2036
2090
  margin:0;
2037
2091
  padding:0; }
2038
- .iui-page-header .iui-header-split-button .iui-button:first-child{
2092
+ .iui-page-header .iui-header-split-button > *:first-child .iui-button{
2039
2093
  padding-left:12px; }
2040
2094
  .iui-page-header .iui-header-split-button.iui-active svg{
2041
2095
  fill:#008BE1;
@@ -2064,11 +2118,11 @@ html.iui-theme-dark{
2064
2118
  box-shadow:0 2px 0 0 rgba(0, 0, 0, 0.4);
2065
2119
  background-color:rgba(var(--iui-color-foreground-body-rgb), 0.05);
2066
2120
  box-shadow:0 2px 0 0 rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4)); }
2067
- .iui-page-header .iui-header-split-button.iui-active.iui-disabled .iui-label, .iui-page-header .iui-header-split-button.iui-active:disabled .iui-label{
2121
+ .iui-page-header .iui-header-split-button.iui-active.iui-disabled .iui-button-label, .iui-page-header .iui-header-split-button.iui-active:disabled .iui-button-label{
2068
2122
  color:rgba(0, 0, 0, 0.2);
2069
2123
  color:var(--iui-icons-color-actionable-disabled); }
2070
- .iui-page-header .iui-header-split-button.iui-active.iui-disabled .iui-icon,
2071
- .iui-page-header .iui-header-split-button.iui-active.iui-disabled svg, .iui-page-header .iui-header-split-button.iui-active:disabled .iui-icon,
2124
+ .iui-page-header .iui-header-split-button.iui-active.iui-disabled .iui-button-icon,
2125
+ .iui-page-header .iui-header-split-button.iui-active.iui-disabled svg, .iui-page-header .iui-header-split-button.iui-active:disabled .iui-button-icon,
2072
2126
  .iui-page-header .iui-header-split-button.iui-active:disabled svg{
2073
2127
  fill:rgba(0, 0, 0, 0.2);
2074
2128
  fill:var(--iui-icons-color-actionable-disabled); }
@@ -2079,7 +2133,7 @@ html.iui-theme-dark{
2079
2133
  background-color:transparent; }
2080
2134
  .iui-page-header .iui-header-split-button.iui-active .iui-button.iui-borderless::after{
2081
2135
  display:none; }
2082
- .iui-page-header .iui-header-split-button.iui-active .iui-button:last-child:hover{
2136
+ .iui-page-header .iui-header-split-button.iui-active > *:last-child > .iui-button:hover{
2083
2137
  background-color:rgba(0, 139, 225, 0.1);
2084
2138
  background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6)); }
2085
2139
  .iui-page-header .iui-header-split-button.iui-active.iui-disabled .iui-button:last-child:hover{
@@ -2485,7 +2539,7 @@ html.iui-theme-dark{
2485
2539
  -ms-grid-columns:auto 1fr;
2486
2540
  grid-template:'label label' 'inputs inputs' / auto 1fr;
2487
2541
  cursor:default; }
2488
- .iui-input-container.iui-inline-icon:not(.iui-inline-label) .iui-input-icon{
2542
+ .iui-input-container.iui-inline-icon:not(.iui-inline-label) > .iui-input-icon{
2489
2543
  -ms-grid-row:2;
2490
2544
  -ms-grid-column:2; }
2491
2545
  .iui-input-container.iui-inline-icon > .iui-input,
@@ -2498,7 +2552,7 @@ html.iui-theme-dark{
2498
2552
  -ms-grid-rows:auto auto auto;
2499
2553
  -ms-grid-columns:auto 1fr;
2500
2554
  grid-template:'label label' 'inputs inputs' 'icon message' / auto 1fr; }
2501
- .iui-input-container.iui-with-message:not(.iui-inline-icon) .iui-input-icon{
2555
+ .iui-input-container.iui-with-message:not(.iui-inline-icon) > .iui-input-icon{
2502
2556
  margin-top:3px; }
2503
2557
  .iui-input-container .iui-input,
2504
2558
  .iui-input-container .iui-textarea,
@@ -2539,7 +2593,7 @@ html.iui-theme-dark{
2539
2593
  -ms-grid-rows:auto auto;
2540
2594
  -ms-grid-columns:auto auto 1fr;
2541
2595
  grid-template:'label inputs inputs' '. icon message' / auto auto 1fr; }
2542
- .iui-input-container.iui-inline-label.iui-with-message:not(.iui-inline-icon) .iui-input-icon{
2596
+ .iui-input-container.iui-inline-label.iui-with-message:not(.iui-inline-icon) > .iui-input-icon{
2543
2597
  -ms-grid-row:2;
2544
2598
  -ms-grid-column:2; }
2545
2599
  .iui-input-container.iui-inline-label.iui-with-message .iui-message{
@@ -2573,7 +2627,7 @@ html.iui-theme-dark{
2573
2627
  margin-left:4px;
2574
2628
  color:#D30A0A;
2575
2629
  color:var(--iui-color-foreground-negative); }
2576
- .iui-input-container .iui-input-icon{
2630
+ .iui-input-container > .iui-input-icon{
2577
2631
  -ms-grid-row:3;
2578
2632
  -ms-grid-column:1;
2579
2633
  display:flex;
@@ -2584,7 +2638,7 @@ html.iui-theme-dark{
2584
2638
  align-self:center;
2585
2639
  fill:rgba(0, 0, 0, 0.4);
2586
2640
  fill:var(--iui-icons-color); }
2587
- .iui-input-container .iui-input-icon:not(:last-child){
2641
+ .iui-input-container > .iui-input-icon:not(:last-child){
2588
2642
  margin-right:4px; }
2589
2643
  .iui-input-container .iui-message{
2590
2644
  -ms-grid-row:3;
@@ -2604,7 +2658,7 @@ html.iui-theme-dark{
2604
2658
  -ms-grid-column-span:1; }
2605
2659
  .iui-input-container.iui-inline-label > .iui-label.iui-required{
2606
2660
  margin-right:6px; }
2607
- .iui-input-container.iui-inline-icon .iui-input-icon{
2661
+ .iui-input-container.iui-inline-icon > .iui-input-icon{
2608
2662
  -ms-grid-row:1;
2609
2663
  -ms-grid-column:3;
2610
2664
  grid-area:inputs;
@@ -2612,7 +2666,7 @@ html.iui-theme-dark{
2612
2666
  justify-self:end;
2613
2667
  margin:0 12px 0 0;
2614
2668
  position:relative; }
2615
- .iui-input-container.iui-inline-icon .iui-input-icon.iui-button{
2669
+ .iui-input-container.iui-inline-icon > .iui-input-icon.iui-button{
2616
2670
  height:100%;
2617
2671
  width:-webkit-fit-content;
2618
2672
  width:-moz-fit-content;
@@ -2620,7 +2674,7 @@ html.iui-theme-dark{
2620
2674
  margin-right:0;
2621
2675
  border-top-left-radius:0;
2622
2676
  border-bottom-left-radius:0; }
2623
- .iui-input-container.iui-inline-icon .iui-input-icon.iui-actionable{
2677
+ .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable{
2624
2678
  align-items:center;
2625
2679
  height:90%;
2626
2680
  margin-right:1px;
@@ -2628,19 +2682,19 @@ html.iui-theme-dark{
2628
2682
  cursor:pointer;
2629
2683
  background-position:center;
2630
2684
  transition:background 0.4s ease-out; }
2631
- .iui-input-container.iui-inline-icon .iui-input-icon.iui-actionable:hover{
2685
+ .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable:hover{
2632
2686
  background:var(--iui-color-background-1) radial-gradient(circle, transparent 1%, var(--iui-color-background-1) 1%) center/15000%; }
2633
- .iui-input-container.iui-inline-icon .iui-input-icon.iui-actionable:active{
2687
+ .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable:active{
2634
2688
  background-color:var(--iui-color-background-2);
2635
2689
  background-size:100%;
2636
2690
  transition:background 0s; }
2637
- .iui-input-container.iui-inline-icon .iui-input-icon.iui-actionable svg{
2691
+ .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable svg{
2638
2692
  width:16px;
2639
2693
  height:16px;
2640
2694
  fill:rgba(0, 0, 0, 0.4);
2641
2695
  fill:var(--iui-icons-color);
2642
2696
  transition:transform 0.2s ease-out; }
2643
- .iui-input-container.iui-inline-icon .iui-input-icon.iui-actionable.iui-open svg{
2697
+ .iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable.iui-open svg{
2644
2698
  transform:rotate(180deg); }
2645
2699
  .iui-input-container.iui-positive *::-moz-selection{
2646
2700
  background-color:rgba(83, 162, 26, 0.4);
@@ -4765,9 +4819,6 @@ html.iui-theme-dark{
4765
4819
  flex-direction:column; }
4766
4820
  .iui-table *{
4767
4821
  box-sizing:border-box; }
4768
- .iui-table.iui-zebra-striping > .iui-table-body > .iui-row:nth-child(even):not(.iui-selected){
4769
- background:rgba(0, 0, 0, 0.02);
4770
- background:rgba(var(--iui-color-foreground-body-rgb), 0.02); }
4771
4822
  .iui-table .iui-cell-end-icon,
4772
4823
  .iui-table .iui-cell-start-icon{
4773
4824
  flex-shrink:0;
@@ -4882,6 +4933,9 @@ html.iui-theme-dark{
4882
4933
  scroll-snap-type:y mandatory; }
4883
4934
  .iui-table-body.iui-scroll-snapping .iui-row{
4884
4935
  scroll-snap-align:start; }
4936
+ .iui-table-body.iui-zebra-striping > .iui-row:nth-child(even):not(.iui-selected){
4937
+ background-color:rgba(0, 0, 0, 0.02);
4938
+ background-color:rgba(var(--iui-color-foreground-body-rgb), 0.02); }
4885
4939
  .iui-table-body .iui-row{
4886
4940
  display:flex;
4887
4941
  border:solid 1px transparent;
@@ -5057,6 +5111,8 @@ html.iui-theme-dark{
5057
5111
  justify-content:center;
5058
5112
  align-items:center;
5059
5113
  flex-basis:48px; }
5114
+ .iui-cell:not(.iui-slot):last-child{
5115
+ padding-right:16px; }
5060
5116
  .iui-cell.iui-positive{
5061
5117
  background-color:rgba(83, 162, 26, 0.1);
5062
5118
  background-color:rgba(var(--iui-color-foreground-positive-rgb), var(--iui-opacity-6)); }
@@ -5099,7 +5155,7 @@ html.iui-theme-dark{
5099
5155
  border:none;
5100
5156
  vertical-align:baseline;
5101
5157
  display:flex;
5102
- justify-content:space-around;
5158
+ justify-content:space-between;
5103
5159
  align-items:center;
5104
5160
  min-height:55px;
5105
5161
  padding:0 16px;
@@ -5124,25 +5180,33 @@ html.iui-theme-dark{
5124
5180
  color:var(--iui-text-color); }
5125
5181
  .iui-paginator > .iui-center .iui-button-group{
5126
5182
  margin:0 8px; }
5127
- .iui-paginator > .iui-center .iui-button-group > .iui-button,
5128
- .iui-paginator > .iui-center .iui-button-group > .iui-ellipsis{
5129
- width:38px; }
5130
- .iui-paginator > .iui-center .iui-button-group > .iui-button.iui-small,
5131
- .iui-paginator > .iui-center .iui-button-group > .iui-ellipsis.iui-small{
5132
- width:27px; }
5133
- .iui-paginator > .iui-center .iui-button-group > .iui-button{
5134
- transition:none; }
5135
- .iui-paginator > .iui-center .iui-button-group > .iui-ellipsis{
5136
- display:flex;
5137
- justify-content:center;
5138
- align-items:center;
5139
- color:rgba(0, 0, 0, 0.4);
5140
- color:var(--iui-text-color-muted); }
5141
- .iui-paginator > .iui-center .iui-button-group > .iui-active::after{
5142
- top:auto;
5143
- bottom:2px; }
5183
+ .iui-paginator > .iui-center .iui-button-group > *{
5184
+ margin-right:0; }
5185
+ .iui-paginator > .iui-center .iui-button-group > * > .iui-button,
5186
+ .iui-paginator > .iui-center .iui-button-group > * > .iui-ellipsis{
5187
+ width:38px; }
5188
+ .iui-paginator > .iui-center .iui-button-group > * > .iui-button.iui-small,
5189
+ .iui-paginator > .iui-center .iui-button-group > * > .iui-ellipsis.iui-small{
5190
+ width:27px; }
5191
+ .iui-paginator > .iui-center .iui-button-group > * > .iui-button{
5192
+ transition:none; }
5193
+ .iui-paginator > .iui-center .iui-button-group > * > .iui-ellipsis{
5194
+ display:flex;
5195
+ justify-content:center;
5196
+ align-items:center;
5197
+ color:rgba(0, 0, 0, 0.4);
5198
+ color:var(--iui-text-color-muted); }
5199
+ .iui-paginator > .iui-center .iui-button-group > * > .iui-active::after{
5200
+ top:auto;
5201
+ bottom:2px; }
5144
5202
  .iui-paginator > .iui-right{
5145
5203
  justify-content:flex-end; }
5204
+ .iui-paginator-page-size-label{
5205
+ color:rgba(0, 0, 0, 0.4);
5206
+ color:var(--iui-text-color-muted);
5207
+ white-space:nowrap;
5208
+ overflow:hidden;
5209
+ text-overflow:ellipsis; }
5146
5210
 
5147
5211
  .iui-column-filter{
5148
5212
  margin:0;
@@ -5670,21 +5734,26 @@ a.iui-tag{
5670
5734
  .iui-tile .iui-thumbnail > .iui-quick-action > .iui-button-icon:only-child{
5671
5735
  margin-left:3px;
5672
5736
  margin-right:3px; }
5673
- .iui-tile .iui-thumbnail > .iui-type-indicator:hover, .iui-tile .iui-thumbnail > .iui-type-indicator:focus,
5674
- .iui-tile .iui-thumbnail > .iui-quick-action:hover,
5737
+ .iui-tile .iui-thumbnail > .iui-type-indicator:focus,
5675
5738
  .iui-tile .iui-thumbnail > .iui-quick-action:focus{
5676
5739
  background-color:rgba(0, 0, 0, 0.1);
5677
5740
  border-color:transparent;
5678
5741
  background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
5679
5742
  border-color:transparent; }
5680
- .iui-tile .iui-thumbnail > .iui-type-indicator:focus:not(:focus-visible),
5681
- .iui-tile .iui-thumbnail > .iui-quick-action:focus:not(:focus-visible){
5743
+ .iui-tile .iui-thumbnail > .iui-type-indicator:focus:where(:not(:focus-visible)),
5744
+ .iui-tile .iui-thumbnail > .iui-quick-action:focus:where(:not(:focus-visible)){
5745
+ border-color:transparent;
5746
+ background-color:transparent; }
5747
+ .iui-tile .iui-thumbnail > .iui-type-indicator:focus:where(:not(:focus-visible)) > .iui-button-icon:only-child,
5748
+ .iui-tile .iui-thumbnail > .iui-quick-action:focus:where(:not(:focus-visible)) > .iui-button-icon:only-child{
5749
+ margin-left:3px;
5750
+ margin-right:3px; }
5751
+ .iui-tile .iui-thumbnail > .iui-type-indicator:hover,
5752
+ .iui-tile .iui-thumbnail > .iui-quick-action:hover{
5753
+ background-color:rgba(0, 0, 0, 0.1);
5682
5754
  border-color:transparent;
5683
- background-color:transparent; }
5684
- .iui-tile .iui-thumbnail > .iui-type-indicator:focus:not(:focus-visible) > .iui-button-icon:only-child,
5685
- .iui-tile .iui-thumbnail > .iui-quick-action:focus:not(:focus-visible) > .iui-button-icon:only-child{
5686
- margin-left:3px;
5687
- margin-right:3px; }
5755
+ background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6));
5756
+ border-color:transparent; }
5688
5757
  .iui-tile .iui-thumbnail > .iui-type-indicator.iui-active,
5689
5758
  .iui-tile .iui-thumbnail > .iui-quick-action.iui-active{
5690
5759
  background-color:rgba(0, 139, 225, 0.1);
@@ -6486,6 +6555,110 @@ a.iui-tag{
6486
6555
  background-color:rgba(0, 0, 0, var(--iui-opacity-3));
6487
6556
  color:var(--iui-color-foreground-accessory); }
6488
6557
 
6558
+ .iui-tree{
6559
+ margin:0;
6560
+ padding:0;
6561
+ border:none;
6562
+ vertical-align:baseline;
6563
+ list-style:none; }
6564
+
6565
+ .iui-sub-tree{
6566
+ margin:0;
6567
+ padding:0;
6568
+ border:none;
6569
+ vertical-align:baseline;
6570
+ list-style:none; }
6571
+
6572
+ .iui-tree-node{
6573
+ display:flex;
6574
+ cursor:pointer;
6575
+ padding:0 8px; }
6576
+ .iui-tree-node-checkbox{
6577
+ margin-right:8px; }
6578
+ .iui-tree-node-content{
6579
+ display:flex;
6580
+ align-items:center;
6581
+ box-sizing:border-box;
6582
+ min-height:33px;
6583
+ margin-left:calc(28px * (var(--level, 0)));
6584
+ overflow:hidden;
6585
+ padding-left:2px; }
6586
+ .iui-tree-node-content-icon{
6587
+ fill:rgba(0, 0, 0, 0.4);
6588
+ fill:var(--iui-icons-color);
6589
+ display:inline-flex;
6590
+ width:16px;
6591
+ height:16px;
6592
+ padding:0 6px;
6593
+ flex-shrink:0; }
6594
+ .iui-tree-node-content-icon.iui-informational{
6595
+ fill:#008BE1;
6596
+ fill:var(--iui-icons-color-primary); }
6597
+ .iui-tree-node-content-icon.iui-positive{
6598
+ fill:#53A21A;
6599
+ fill:var(--iui-icons-color-positive); }
6600
+ .iui-tree-node-content-icon.iui-warning{
6601
+ fill:#F18B12;
6602
+ fill:var(--iui-icons-color-warning); }
6603
+ .iui-tree-node-content-icon.iui-negative{
6604
+ fill:#D30A0A;
6605
+ fill:var(--iui-icons-color-negative); }
6606
+ .iui-tree-node-content-icon:first-child{
6607
+ margin-left:28px; }
6608
+ @media (prefers-reduced-motion: no-preference){
6609
+ .iui-tree-node-content-expander-icon{
6610
+ transition:transform 0.2s ease-out; } }
6611
+ .iui-tree-node-content-expander-icon-expanded{
6612
+ transform:rotate(90deg); }
6613
+ .iui-tree-node-content-label{
6614
+ min-width:0;
6615
+ padding-left:6px; }
6616
+ .iui-tree-node-content-label:first-child{
6617
+ margin-left:28px; }
6618
+ .iui-tree-node-content-title, .iui-tree-node-content-caption{
6619
+ white-space:nowrap;
6620
+ overflow:hidden;
6621
+ text-overflow:ellipsis; }
6622
+ .iui-tree-node-content-title{
6623
+ font-size:14px; }
6624
+ .iui-tree-node-content-caption{
6625
+ font-size:12px;
6626
+ color:rgba(0, 0, 0, 0.4);
6627
+ color:var(--iui-text-color-muted); }
6628
+ .iui-tree-node:focus{
6629
+ outline:thin solid rgba(0, 139, 225, 0.4);
6630
+ outline-offset:-1px;
6631
+ outline:thin solid rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-4));
6632
+ outline-offset:-1px; }
6633
+ .iui-tree-node:focus:not(:focus-visible){
6634
+ outline-offset:-2px; }
6635
+ .iui-tree-node:hover{
6636
+ background-color:rgba(0, 139, 225, 0.1);
6637
+ background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6)); }
6638
+ .iui-tree-node:hover .iui-tree-node-content-caption{
6639
+ color:#000;
6640
+ color:var(--iui-color-foreground-body);
6641
+ transition:color 0.2s ease; }
6642
+ .iui-tree-node.iui-active{
6643
+ background-color:rgba(0, 139, 225, 0.2);
6644
+ outline:thin solid var(--iui-color-foreground-primary);
6645
+ outline-offset:-1px;
6646
+ background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
6647
+ outline:thin solid var(--iui-color-foreground-primary);
6648
+ outline-offset:-1px; }
6649
+ .iui-tree-node.iui-active:focus{
6650
+ outline-width:2px;
6651
+ outline-offset:-2px; }
6652
+ .iui-tree-node.iui-disabled{
6653
+ cursor:not-allowed;
6654
+ outline:none;
6655
+ background-color:transparent;
6656
+ color:rgba(0, 0, 0, 0.2);
6657
+ color:var(--iui-text-color-placeholder); }
6658
+ .iui-tree-node.iui-disabled .iui-tree-node-content-caption{
6659
+ color:rgba(0, 0, 0, 0.2);
6660
+ color:var(--iui-text-color-placeholder); }
6661
+
6489
6662
  .iui-user-icon{
6490
6663
  margin:0;
6491
6664
  padding:0;
@@ -6549,7 +6722,9 @@ a.iui-tag{
6549
6722
  width:100%;
6550
6723
  height:100%;
6551
6724
  border-width:0;
6552
- border-radius:50%; }
6725
+ border-radius:50%;
6726
+ background-color:#FFF;
6727
+ background-color:var(--iui-color-background-1); }
6553
6728
  .iui-user-icon > .iui-status{
6554
6729
  display:flex;
6555
6730
  align-items:center;