@i-cell/ids-styles 0.0.41 → 0.0.43

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 (13) hide show
  1. package/dist/breadcrumb/breadcrumb.css +288 -0
  2. package/dist/breadcrumb/breadcrumb.min.css +1 -0
  3. package/dist/breadcrumb/breadcrumb.plugin.js +272 -0
  4. package/dist/button/button.css +62 -62
  5. package/dist/button/button.min.css +1 -1
  6. package/dist/button/button.plugin.js +62 -62
  7. package/dist/components.css +371 -82
  8. package/dist/components.min.css +1 -1
  9. package/dist/components.plugin.js +345 -82
  10. package/dist/icon-button/icon-button.css +20 -20
  11. package/dist/icon-button/icon-button.min.css +1 -1
  12. package/dist/icon-button/icon-button.plugin.js +20 -20
  13. package/package.json +1 -1
package/dist/components.plugin.js CHANGED
@@ -730,6 +730,269 @@ module.exports = function ComponentsPlugin() {
730
730
  minWidth: 'var(--ids-comp-badge-noelement-size-width-dense)',
731
731
  height: 'var(--ids-comp-badge-noelement-size-height-dense)',
732
732
  },
733
+ '*:has(ids-breadcrumb.ids-breadcrumb)': { width: '100%' },
734
+ '.ids-breadcrumb': {
735
+ boxSizing: 'border-box',
736
+ borderWidth: '0',
737
+ borderStyle: 'none',
738
+ borderColor: 'rgba(0,0,0,0)',
739
+ lineHeight: 1.5,
740
+ display: 'block',
741
+ },
742
+ '.ids-breadcrumb::before,.ids-breadcrumb::after,.ids-breadcrumb *,.ids-breadcrumb ::before,.ids-breadcrumb ::after': {
743
+ boxSizing: 'border-box',
744
+ borderWidth: '0',
745
+ borderStyle: 'none',
746
+ borderColor: 'rgba(0,0,0,0)',
747
+ },
748
+ '.ids-breadcrumb-divider': { display: 'flex', alignItems: 'center' },
749
+ '.ids-breadcrumb-link': { display: 'block', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' },
750
+ '.ids-breadcrumb-link:link,.ids-breadcrumb-link:visited': { textDecoration: 'none' },
751
+ '.ids-breadcrumb-link:focus,.ids-breadcrumb-link:focus-visible': { outlineOffset: '2px', outlineStyle: 'solid' },
752
+ '.ids-breadcrumb-link:active': { outlineStyle: 'none' },
753
+ '.ids-breadcrumb-link:not([disabled])': { cursor: 'pointer' },
754
+ '.ids-breadcrumb-link:is([disabled])': { cursor: 'not-allowed' },
755
+ '.ids-breadcrumb-page': { display: 'block', cursor: 'default' },
756
+ '.ids-breadcrumb.ids-breadcrumb-compact .ids-breadcrumb-list': {
757
+ display: 'inline-flex',
758
+ alignItems: 'center',
759
+ gap: 'var(--ids-comp-breadcrumb-size-gap-compact)',
760
+ },
761
+ '.ids-breadcrumb.ids-breadcrumb-compact .ids-breadcrumb-list.ids-overlay-panel': { alignItems: 'start' },
762
+ '.ids-breadcrumb.ids-breadcrumb-compact .ids-breadcrumb-link': {
763
+ fontFamily: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-family-compact)',
764
+ fontSize: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-size-compact)',
765
+ fontWeight: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-weight-compact)',
766
+ letterSpacing: 'var(--ids-comp-breadcrumb-navigation-link-typography-letter-spacing-compact)',
767
+ lineHeight: 'var(--ids-comp-breadcrumb-navigation-link-typography-line-height-compact)',
768
+ padding:
769
+ 'var(--ids-comp-breadcrumb-navigation-link-size-padding-y-compact) var(--ids-comp-breadcrumb-navigation-link-size-padding-x-compact)',
770
+ maxWidth: 'var(--ids-comp-breadcrumb-navigation-link-size-max-width-compact)',
771
+ borderRadius: 'var(--ids-comp-breadcrumb-navigation-link-size-border-radius-compact)',
772
+ },
773
+ '.ids-breadcrumb.ids-breadcrumb-compact .ids-breadcrumb-link:focus,.ids-breadcrumb.ids-breadcrumb-compact .ids-breadcrumb-link:focus-visible':
774
+ { outlineWidth: 'var(--ids-comp-breadcrumb-focused-outline-size-outline-compact)' },
775
+ '.ids-breadcrumb.ids-breadcrumb-compact .ids-breadcrumb-page': {
776
+ fontFamily: 'var(--ids-comp-breadcrumb-current-page-typography-font-family-compact)',
777
+ fontSize: 'var(--ids-comp-breadcrumb-current-page-typography-font-size-compact)',
778
+ fontWeight: 'var(--ids-comp-breadcrumb-current-page-typography-font-weight-compact)',
779
+ letterSpacing: 'var(--ids-comp-breadcrumb-current-page-typography-letter-spacing-compact)',
780
+ lineHeight: 'var(--ids-comp-breadcrumb-current-page-typography-line-height-compact)',
781
+ padding:
782
+ 'var(--ids-comp-breadcrumb-current-page-size-padding-y-compact) var(--ids-comp-breadcrumb-current-page-size-padding-x-compact)',
783
+ maxWidth: 'var(--ids-comp-breadcrumb-current-page-size-max-width-compact)',
784
+ },
785
+ '.ids-breadcrumb.ids-breadcrumb-compact .ids-breadcrumb-divider-foreslash': {
786
+ fontFamily: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-family-compact)',
787
+ fontSize: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-size-compact)',
788
+ fontWeight: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-weight-compact)',
789
+ letterSpacing: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-letter-spacing-compact)',
790
+ lineHeight: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-line-height-compact)',
791
+ padding:
792
+ 'var(--ids-comp-breadcrumb-divider-foreslash-size-padding-y-compact) var(--ids-comp-breadcrumb-divider-foreslash-size-padding-x-compact)',
793
+ borderRadius: 'var(--ids-comp-breadcrumb-divider-foreslash-size-border-radius-compact)',
794
+ },
795
+ '.ids-breadcrumb.ids-breadcrumb-comfortable .ids-breadcrumb-list': {
796
+ display: 'inline-flex',
797
+ alignItems: 'center',
798
+ gap: 'var(--ids-comp-breadcrumb-size-gap-comfortable)',
799
+ },
800
+ '.ids-breadcrumb.ids-breadcrumb-comfortable .ids-breadcrumb-list.ids-overlay-panel': { alignItems: 'start' },
801
+ '.ids-breadcrumb.ids-breadcrumb-comfortable .ids-breadcrumb-link': {
802
+ fontFamily: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-family-comfortable)',
803
+ fontSize: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-size-comfortable)',
804
+ fontWeight: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-weight-comfortable)',
805
+ letterSpacing: 'var(--ids-comp-breadcrumb-navigation-link-typography-letter-spacing-comfortable)',
806
+ lineHeight: 'var(--ids-comp-breadcrumb-navigation-link-typography-line-height-comfortable)',
807
+ padding:
808
+ 'var(--ids-comp-breadcrumb-navigation-link-size-padding-y-comfortable) var(--ids-comp-breadcrumb-navigation-link-size-padding-x-comfortable)',
809
+ maxWidth: 'var(--ids-comp-breadcrumb-navigation-link-size-max-width-comfortable)',
810
+ borderRadius: 'var(--ids-comp-breadcrumb-navigation-link-size-border-radius-comfortable)',
811
+ },
812
+ '.ids-breadcrumb.ids-breadcrumb-comfortable .ids-breadcrumb-link:focus,.ids-breadcrumb.ids-breadcrumb-comfortable .ids-breadcrumb-link:focus-visible':
813
+ { outlineWidth: 'var(--ids-comp-breadcrumb-focused-outline-size-outline-comfortable)' },
814
+ '.ids-breadcrumb.ids-breadcrumb-comfortable .ids-breadcrumb-page': {
815
+ fontFamily: 'var(--ids-comp-breadcrumb-current-page-typography-font-family-comfortable)',
816
+ fontSize: 'var(--ids-comp-breadcrumb-current-page-typography-font-size-comfortable)',
817
+ fontWeight: 'var(--ids-comp-breadcrumb-current-page-typography-font-weight-comfortable)',
818
+ letterSpacing: 'var(--ids-comp-breadcrumb-current-page-typography-letter-spacing-comfortable)',
819
+ lineHeight: 'var(--ids-comp-breadcrumb-current-page-typography-line-height-comfortable)',
820
+ padding:
821
+ 'var(--ids-comp-breadcrumb-current-page-size-padding-y-comfortable) var(--ids-comp-breadcrumb-current-page-size-padding-x-comfortable)',
822
+ maxWidth: 'var(--ids-comp-breadcrumb-current-page-size-max-width-comfortable)',
823
+ },
824
+ '.ids-breadcrumb.ids-breadcrumb-comfortable .ids-breadcrumb-divider-foreslash': {
825
+ fontFamily: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-family-comfortable)',
826
+ fontSize: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-size-comfortable)',
827
+ fontWeight: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-weight-comfortable)',
828
+ letterSpacing: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-letter-spacing-comfortable)',
829
+ lineHeight: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-line-height-comfortable)',
830
+ padding:
831
+ 'var(--ids-comp-breadcrumb-divider-foreslash-size-padding-y-comfortable) var(--ids-comp-breadcrumb-divider-foreslash-size-padding-x-comfortable)',
832
+ borderRadius: 'var(--ids-comp-breadcrumb-divider-foreslash-size-border-radius-comfortable)',
833
+ },
834
+ '.ids-breadcrumb.ids-breadcrumb-spacious .ids-breadcrumb-list': {
835
+ display: 'inline-flex',
836
+ alignItems: 'center',
837
+ gap: 'var(--ids-comp-breadcrumb-size-gap-spacious)',
838
+ },
839
+ '.ids-breadcrumb.ids-breadcrumb-spacious .ids-breadcrumb-list.ids-overlay-panel': { alignItems: 'start' },
840
+ '.ids-breadcrumb.ids-breadcrumb-spacious .ids-breadcrumb-link': {
841
+ fontFamily: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-family-spacious)',
842
+ fontSize: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-size-spacious)',
843
+ fontWeight: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-weight-spacious)',
844
+ letterSpacing: 'var(--ids-comp-breadcrumb-navigation-link-typography-letter-spacing-spacious)',
845
+ lineHeight: 'var(--ids-comp-breadcrumb-navigation-link-typography-line-height-spacious)',
846
+ padding:
847
+ 'var(--ids-comp-breadcrumb-navigation-link-size-padding-y-spacious) var(--ids-comp-breadcrumb-navigation-link-size-padding-x-spacious)',
848
+ maxWidth: 'var(--ids-comp-breadcrumb-navigation-link-size-max-width-spacious)',
849
+ borderRadius: 'var(--ids-comp-breadcrumb-navigation-link-size-border-radius-spacious)',
850
+ },
851
+ '.ids-breadcrumb.ids-breadcrumb-spacious .ids-breadcrumb-link:focus,.ids-breadcrumb.ids-breadcrumb-spacious .ids-breadcrumb-link:focus-visible':
852
+ { outlineWidth: 'var(--ids-comp-breadcrumb-focused-outline-size-outline-spacious)' },
853
+ '.ids-breadcrumb.ids-breadcrumb-spacious .ids-breadcrumb-page': {
854
+ fontFamily: 'var(--ids-comp-breadcrumb-current-page-typography-font-family-spacious)',
855
+ fontSize: 'var(--ids-comp-breadcrumb-current-page-typography-font-size-spacious)',
856
+ fontWeight: 'var(--ids-comp-breadcrumb-current-page-typography-font-weight-spacious)',
857
+ letterSpacing: 'var(--ids-comp-breadcrumb-current-page-typography-letter-spacing-spacious)',
858
+ lineHeight: 'var(--ids-comp-breadcrumb-current-page-typography-line-height-spacious)',
859
+ padding:
860
+ 'var(--ids-comp-breadcrumb-current-page-size-padding-y-spacious) var(--ids-comp-breadcrumb-current-page-size-padding-x-spacious)',
861
+ maxWidth: 'var(--ids-comp-breadcrumb-current-page-size-max-width-spacious)',
862
+ },
863
+ '.ids-breadcrumb.ids-breadcrumb-spacious .ids-breadcrumb-divider-foreslash': {
864
+ fontFamily: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-family-spacious)',
865
+ fontSize: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-size-spacious)',
866
+ fontWeight: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-weight-spacious)',
867
+ letterSpacing: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-letter-spacing-spacious)',
868
+ lineHeight: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-line-height-spacious)',
869
+ padding:
870
+ 'var(--ids-comp-breadcrumb-divider-foreslash-size-padding-y-spacious) var(--ids-comp-breadcrumb-divider-foreslash-size-padding-x-spacious)',
871
+ borderRadius: 'var(--ids-comp-breadcrumb-divider-foreslash-size-border-radius-spacious)',
872
+ },
873
+ '.ids-breadcrumb.ids-breadcrumb-dense .ids-breadcrumb-list': {
874
+ display: 'inline-flex',
875
+ alignItems: 'center',
876
+ gap: 'var(--ids-comp-breadcrumb-size-gap-dense)',
877
+ },
878
+ '.ids-breadcrumb.ids-breadcrumb-dense .ids-breadcrumb-list.ids-overlay-panel': { alignItems: 'start' },
879
+ '.ids-breadcrumb.ids-breadcrumb-dense .ids-breadcrumb-link': {
880
+ fontFamily: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-family-dense)',
881
+ fontSize: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-size-dense)',
882
+ fontWeight: 'var(--ids-comp-breadcrumb-navigation-link-typography-font-weight-dense)',
883
+ letterSpacing: 'var(--ids-comp-breadcrumb-navigation-link-typography-letter-spacing-dense)',
884
+ lineHeight: 'var(--ids-comp-breadcrumb-navigation-link-typography-line-height-dense)',
885
+ padding:
886
+ 'var(--ids-comp-breadcrumb-navigation-link-size-padding-y-dense) var(--ids-comp-breadcrumb-navigation-link-size-padding-x-dense)',
887
+ maxWidth: 'var(--ids-comp-breadcrumb-navigation-link-size-max-width-dense)',
888
+ borderRadius: 'var(--ids-comp-breadcrumb-navigation-link-size-border-radius-dense)',
889
+ },
890
+ '.ids-breadcrumb.ids-breadcrumb-dense .ids-breadcrumb-link:focus,.ids-breadcrumb.ids-breadcrumb-dense .ids-breadcrumb-link:focus-visible':
891
+ { outlineWidth: 'var(--ids-comp-breadcrumb-focused-outline-size-outline-dense)' },
892
+ '.ids-breadcrumb.ids-breadcrumb-dense .ids-breadcrumb-page': {
893
+ fontFamily: 'var(--ids-comp-breadcrumb-current-page-typography-font-family-dense)',
894
+ fontSize: 'var(--ids-comp-breadcrumb-current-page-typography-font-size-dense)',
895
+ fontWeight: 'var(--ids-comp-breadcrumb-current-page-typography-font-weight-dense)',
896
+ letterSpacing: 'var(--ids-comp-breadcrumb-current-page-typography-letter-spacing-dense)',
897
+ lineHeight: 'var(--ids-comp-breadcrumb-current-page-typography-line-height-dense)',
898
+ padding:
899
+ 'var(--ids-comp-breadcrumb-current-page-size-padding-y-dense) var(--ids-comp-breadcrumb-current-page-size-padding-x-dense)',
900
+ maxWidth: 'var(--ids-comp-breadcrumb-current-page-size-max-width-dense)',
901
+ },
902
+ '.ids-breadcrumb.ids-breadcrumb-dense .ids-breadcrumb-divider-foreslash': {
903
+ fontFamily: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-family-dense)',
904
+ fontSize: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-size-dense)',
905
+ fontWeight: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-font-weight-dense)',
906
+ letterSpacing: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-letter-spacing-dense)',
907
+ lineHeight: 'var(--ids-comp-breadcrumb-divider-foreslash-typography-line-height-dense)',
908
+ padding:
909
+ 'var(--ids-comp-breadcrumb-divider-foreslash-size-padding-y-dense) var(--ids-comp-breadcrumb-divider-foreslash-size-padding-x-dense)',
910
+ borderRadius: 'var(--ids-comp-breadcrumb-divider-foreslash-size-border-radius-dense)',
911
+ },
912
+ '.ids-breadcrumb.ids-breadcrumb-primary .ids-breadcrumb-link': {
913
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-primary-default)',
914
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-primary-default)',
915
+ },
916
+ '.ids-breadcrumb.ids-breadcrumb-primary .ids-breadcrumb-link:hover': {
917
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-primary-hovered)',
918
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-primary-hovered)',
919
+ },
920
+ '.ids-breadcrumb.ids-breadcrumb-primary .ids-breadcrumb-link:focus,.ids-breadcrumb.ids-breadcrumb-primary .ids-breadcrumb-link:focus-visible':
921
+ {
922
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-primary-focused)',
923
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-primary-focused)',
924
+ outlineColor: 'var(--ids-comp-breadcrumb-focused-outline-color-dark-focused)',
925
+ },
926
+ '.ids-breadcrumb.ids-breadcrumb-primary .ids-breadcrumb-link:active': {
927
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-primary-pressed)',
928
+ },
929
+ '.ids-breadcrumb.ids-breadcrumb-primary .ids-breadcrumb-link:is([disabled])': {
930
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-primary-disabled)',
931
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-primary-disabled)',
932
+ },
933
+ '.ids-breadcrumb.ids-breadcrumb-primary .ids-breadcrumb-page': {
934
+ color: 'var(--ids-comp-breadcrumb-current-page-fg-primary-default)',
935
+ background: 'var(--ids-comp-breadcrumb-current-page-bg-primary-default)',
936
+ },
937
+ '.ids-breadcrumb.ids-breadcrumb-primary .ids-breadcrumb-divider-foreslash': {
938
+ color: 'var(--ids-comp-breadcrumb-divider-foreslash-fg-primary-default)',
939
+ },
940
+ '.ids-breadcrumb.ids-breadcrumb-light .ids-breadcrumb-link': {
941
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-light-default)',
942
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-light-default)',
943
+ },
944
+ '.ids-breadcrumb.ids-breadcrumb-light .ids-breadcrumb-link:hover': {
945
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-light-hovered)',
946
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-light-hovered)',
947
+ },
948
+ '.ids-breadcrumb.ids-breadcrumb-light .ids-breadcrumb-link:focus,.ids-breadcrumb.ids-breadcrumb-light .ids-breadcrumb-link:focus-visible':
949
+ {
950
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-light-focused)',
951
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-light-focused)',
952
+ outlineColor: 'var(--ids-comp-breadcrumb-focused-outline-color-light-focused)',
953
+ },
954
+ '.ids-breadcrumb.ids-breadcrumb-light .ids-breadcrumb-link:active': {
955
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-light-pressed)',
956
+ },
957
+ '.ids-breadcrumb.ids-breadcrumb-light .ids-breadcrumb-link:is([disabled])': {
958
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-light-disabled)',
959
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-light-disabled)',
960
+ },
961
+ '.ids-breadcrumb.ids-breadcrumb-light .ids-breadcrumb-page': {
962
+ color: 'var(--ids-comp-breadcrumb-current-page-fg-light-default)',
963
+ background: 'var(--ids-comp-breadcrumb-current-page-bg-light-default)',
964
+ },
965
+ '.ids-breadcrumb.ids-breadcrumb-light .ids-breadcrumb-divider-foreslash': {
966
+ color: 'var(--ids-comp-breadcrumb-divider-foreslash-fg-light-default)',
967
+ },
968
+ '.ids-breadcrumb.ids-breadcrumb-surface .ids-breadcrumb-link': {
969
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-surface-default)',
970
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-surface-default)',
971
+ },
972
+ '.ids-breadcrumb.ids-breadcrumb-surface .ids-breadcrumb-link:hover': {
973
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-surface-hovered)',
974
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-surface-hovered)',
975
+ },
976
+ '.ids-breadcrumb.ids-breadcrumb-surface .ids-breadcrumb-link:focus,.ids-breadcrumb.ids-breadcrumb-surface .ids-breadcrumb-link:focus-visible':
977
+ {
978
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-surface-focused)',
979
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-surface-focused)',
980
+ outlineColor: 'var(--ids-comp-breadcrumb-focused-outline-color-dark-focused)',
981
+ },
982
+ '.ids-breadcrumb.ids-breadcrumb-surface .ids-breadcrumb-link:active': {
983
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-surface-pressed)',
984
+ },
985
+ '.ids-breadcrumb.ids-breadcrumb-surface .ids-breadcrumb-link:is([disabled])': {
986
+ color: 'var(--ids-comp-breadcrumb-navigation-link-fg-surface-disabled)',
987
+ background: 'var(--ids-comp-breadcrumb-navigation-link-bg-surface-disabled)',
988
+ },
989
+ '.ids-breadcrumb.ids-breadcrumb-surface .ids-breadcrumb-page': {
990
+ color: 'var(--ids-comp-breadcrumb-current-page-fg-surface-default)',
991
+ background: 'var(--ids-comp-breadcrumb-current-page-bg-surface-default)',
992
+ },
993
+ '.ids-breadcrumb.ids-breadcrumb-surface .ids-breadcrumb-divider-foreslash': {
994
+ color: 'var(--ids-comp-breadcrumb-divider-foreslash-fg-surface-default)',
995
+ },
733
996
  '.ids-button-group': {
734
997
  boxSizing: 'border-box',
735
998
  borderWidth: '0',
@@ -783,8 +1046,8 @@ module.exports = function ComponentsPlugin() {
783
1046
  },
784
1047
  '.ids-button:focus,.ids-button:focus-visible': { outlineOffset: '2px', outlineStyle: 'solid' },
785
1048
  '.ids-button:active': { outlineStyle: 'none' },
786
- '.ids-button:not(:disabled)': { cursor: 'pointer' },
787
- '.ids-button:disabled': { cursor: 'not-allowed' },
1049
+ '.ids-button:not(:is(:disabled,.ids-button-disabled))': { cursor: 'pointer' },
1050
+ '.ids-button:is(:disabled,.ids-button-disabled)': { cursor: 'not-allowed' },
788
1051
  '.ids-button>.ids-icon': { flexShrink: 0 },
789
1052
  '.ids-button.ids-button-compact': {
790
1053
  gap: 'var(--ids-comp-button-size-gap-compact)',
@@ -910,12 +1173,12 @@ module.exports = function ComponentsPlugin() {
910
1173
  '.ids-button.ids-button-filled.ids-button-primary:active>.ids-icon': {
911
1174
  color: 'var(--ids-comp-button-filled-color-fg-icon-primary-pressed)',
912
1175
  },
913
- '.ids-button.ids-button-filled.ids-button-primary:disabled': {
1176
+ '.ids-button.ids-button-filled.ids-button-primary:is(:disabled,.ids-button-disabled)': {
914
1177
  color: 'var(--ids-comp-button-filled-color-fg-label-primary-disabled)',
915
1178
  background: 'var(--ids-comp-button-filled-color-bg-primary-disabled)',
916
1179
  borderColor: 'var(--ids-comp-button-filled-color-border-primary-disabled)',
917
1180
  },
918
- '.ids-button.ids-button-filled.ids-button-primary:disabled>.ids-icon': {
1181
+ '.ids-button.ids-button-filled.ids-button-primary:is(:disabled,.ids-button-disabled)>.ids-icon': {
919
1182
  color: 'var(--ids-comp-button-filled-color-fg-icon-primary-disabled)',
920
1183
  },
921
1184
  '.ids-button.ids-button-filled.ids-button-secondary': {
@@ -950,12 +1213,12 @@ module.exports = function ComponentsPlugin() {
950
1213
  '.ids-button.ids-button-filled.ids-button-secondary:active>.ids-icon': {
951
1214
  color: 'var(--ids-comp-button-filled-color-fg-icon-secondary-pressed)',
952
1215
  },
953
- '.ids-button.ids-button-filled.ids-button-secondary:disabled': {
1216
+ '.ids-button.ids-button-filled.ids-button-secondary:is(:disabled,.ids-button-disabled)': {
954
1217
  color: 'var(--ids-comp-button-filled-color-fg-label-secondary-disabled)',
955
1218
  background: 'var(--ids-comp-button-filled-color-bg-secondary-disabled)',
956
1219
  borderColor: 'var(--ids-comp-button-filled-color-border-secondary-disabled)',
957
1220
  },
958
- '.ids-button.ids-button-filled.ids-button-secondary:disabled>.ids-icon': {
1221
+ '.ids-button.ids-button-filled.ids-button-secondary:is(:disabled,.ids-button-disabled)>.ids-icon': {
959
1222
  color: 'var(--ids-comp-button-filled-color-fg-icon-secondary-disabled)',
960
1223
  },
961
1224
  '.ids-button.ids-button-filled.ids-button-brand': {
@@ -988,12 +1251,12 @@ module.exports = function ComponentsPlugin() {
988
1251
  '.ids-button.ids-button-filled.ids-button-brand:active>.ids-icon': {
989
1252
  color: 'var(--ids-comp-button-filled-color-fg-icon-brand-pressed)',
990
1253
  },
991
- '.ids-button.ids-button-filled.ids-button-brand:disabled': {
1254
+ '.ids-button.ids-button-filled.ids-button-brand:is(:disabled,.ids-button-disabled)': {
992
1255
  color: 'var(--ids-comp-button-filled-color-fg-label-brand-disabled)',
993
1256
  background: 'var(--ids-comp-button-filled-color-bg-brand-disabled)',
994
1257
  borderColor: 'var(--ids-comp-button-filled-color-border-brand-disabled)',
995
1258
  },
996
- '.ids-button.ids-button-filled.ids-button-brand:disabled>.ids-icon': {
1259
+ '.ids-button.ids-button-filled.ids-button-brand:is(:disabled,.ids-button-disabled)>.ids-icon': {
997
1260
  color: 'var(--ids-comp-button-filled-color-fg-icon-brand-disabled)',
998
1261
  },
999
1262
  '.ids-button.ids-button-filled.ids-button-error': {
@@ -1026,12 +1289,12 @@ module.exports = function ComponentsPlugin() {
1026
1289
  '.ids-button.ids-button-filled.ids-button-error:active>.ids-icon': {
1027
1290
  color: 'var(--ids-comp-button-filled-color-fg-icon-error-pressed)',
1028
1291
  },
1029
- '.ids-button.ids-button-filled.ids-button-error:disabled': {
1292
+ '.ids-button.ids-button-filled.ids-button-error:is(:disabled,.ids-button-disabled)': {
1030
1293
  color: 'var(--ids-comp-button-filled-color-fg-label-error-disabled)',
1031
1294
  background: 'var(--ids-comp-button-filled-color-bg-error-disabled)',
1032
1295
  borderColor: 'var(--ids-comp-button-filled-color-border-error-disabled)',
1033
1296
  },
1034
- '.ids-button.ids-button-filled.ids-button-error:disabled>.ids-icon': {
1297
+ '.ids-button.ids-button-filled.ids-button-error:is(:disabled,.ids-button-disabled)>.ids-icon': {
1035
1298
  color: 'var(--ids-comp-button-filled-color-fg-icon-error-disabled)',
1036
1299
  },
1037
1300
  '.ids-button.ids-button-filled.ids-button-success': {
@@ -1066,12 +1329,12 @@ module.exports = function ComponentsPlugin() {
1066
1329
  '.ids-button.ids-button-filled.ids-button-success:active>.ids-icon': {
1067
1330
  color: 'var(--ids-comp-button-filled-color-fg-icon-success-pressed)',
1068
1331
  },
1069
- '.ids-button.ids-button-filled.ids-button-success:disabled': {
1332
+ '.ids-button.ids-button-filled.ids-button-success:is(:disabled,.ids-button-disabled)': {
1070
1333
  color: 'var(--ids-comp-button-filled-color-fg-label-success-disabled)',
1071
1334
  background: 'var(--ids-comp-button-filled-color-bg-success-disabled)',
1072
1335
  borderColor: 'var(--ids-comp-button-filled-color-border-success-disabled)',
1073
1336
  },
1074
- '.ids-button.ids-button-filled.ids-button-success:disabled>.ids-icon': {
1337
+ '.ids-button.ids-button-filled.ids-button-success:is(:disabled,.ids-button-disabled)>.ids-icon': {
1075
1338
  color: 'var(--ids-comp-button-filled-color-fg-icon-success-disabled)',
1076
1339
  },
1077
1340
  '.ids-button.ids-button-filled.ids-button-warning': {
@@ -1106,12 +1369,12 @@ module.exports = function ComponentsPlugin() {
1106
1369
  '.ids-button.ids-button-filled.ids-button-warning:active>.ids-icon': {
1107
1370
  color: 'var(--ids-comp-button-filled-color-fg-icon-warning-pressed)',
1108
1371
  },
1109
- '.ids-button.ids-button-filled.ids-button-warning:disabled': {
1372
+ '.ids-button.ids-button-filled.ids-button-warning:is(:disabled,.ids-button-disabled)': {
1110
1373
  color: 'var(--ids-comp-button-filled-color-fg-label-warning-disabled)',
1111
1374
  background: 'var(--ids-comp-button-filled-color-bg-warning-disabled)',
1112
1375
  borderColor: 'var(--ids-comp-button-filled-color-border-warning-disabled)',
1113
1376
  },
1114
- '.ids-button.ids-button-filled.ids-button-warning:disabled>.ids-icon': {
1377
+ '.ids-button.ids-button-filled.ids-button-warning:is(:disabled,.ids-button-disabled)>.ids-icon': {
1115
1378
  color: 'var(--ids-comp-button-filled-color-fg-icon-warning-disabled)',
1116
1379
  },
1117
1380
  '.ids-button.ids-button-filled.ids-button-light': {
@@ -1144,12 +1407,12 @@ module.exports = function ComponentsPlugin() {
1144
1407
  '.ids-button.ids-button-filled.ids-button-light:active>.ids-icon': {
1145
1408
  color: 'var(--ids-comp-button-filled-color-fg-icon-light-pressed)',
1146
1409
  },
1147
- '.ids-button.ids-button-filled.ids-button-light:disabled': {
1410
+ '.ids-button.ids-button-filled.ids-button-light:is(:disabled,.ids-button-disabled)': {
1148
1411
  color: 'var(--ids-comp-button-filled-color-fg-label-light-disabled)',
1149
1412
  background: 'var(--ids-comp-button-filled-color-bg-light-disabled)',
1150
1413
  borderColor: 'var(--ids-comp-button-filled-color-border-light-disabled)',
1151
1414
  },
1152
- '.ids-button.ids-button-filled.ids-button-light:disabled>.ids-icon': {
1415
+ '.ids-button.ids-button-filled.ids-button-light:is(:disabled,.ids-button-disabled)>.ids-icon': {
1153
1416
  color: 'var(--ids-comp-button-filled-color-fg-icon-light-disabled)',
1154
1417
  },
1155
1418
  '.ids-button.ids-button-filled.ids-button-light-fixed': {
@@ -1184,12 +1447,12 @@ module.exports = function ComponentsPlugin() {
1184
1447
  '.ids-button.ids-button-filled.ids-button-light-fixed:active>.ids-icon': {
1185
1448
  color: 'var(--ids-comp-button-filled-color-fg-icon-light-fixed-pressed)',
1186
1449
  },
1187
- '.ids-button.ids-button-filled.ids-button-light-fixed:disabled': {
1450
+ '.ids-button.ids-button-filled.ids-button-light-fixed:is(:disabled,.ids-button-disabled)': {
1188
1451
  color: 'var(--ids-comp-button-filled-color-fg-label-light-fixed-disabled)',
1189
1452
  background: 'var(--ids-comp-button-filled-color-bg-light-fixed-disabled)',
1190
1453
  borderColor: 'var(--ids-comp-button-filled-color-border-light-fixed-disabled)',
1191
1454
  },
1192
- '.ids-button.ids-button-filled.ids-button-light-fixed:disabled>.ids-icon': {
1455
+ '.ids-button.ids-button-filled.ids-button-light-fixed:is(:disabled,.ids-button-disabled)>.ids-icon': {
1193
1456
  color: 'var(--ids-comp-button-filled-color-fg-icon-light-fixed-disabled)',
1194
1457
  },
1195
1458
  '.ids-button.ids-button-filled.ids-button-dark': {
@@ -1222,12 +1485,12 @@ module.exports = function ComponentsPlugin() {
1222
1485
  '.ids-button.ids-button-filled.ids-button-dark:active>.ids-icon': {
1223
1486
  color: 'var(--ids-comp-button-filled-color-fg-icon-dark-pressed)',
1224
1487
  },
1225
- '.ids-button.ids-button-filled.ids-button-dark:disabled': {
1488
+ '.ids-button.ids-button-filled.ids-button-dark:is(:disabled,.ids-button-disabled)': {
1226
1489
  color: 'var(--ids-comp-button-filled-color-fg-label-dark-disabled)',
1227
1490
  background: 'var(--ids-comp-button-filled-color-bg-dark-disabled)',
1228
1491
  borderColor: 'var(--ids-comp-button-filled-color-border-dark-disabled)',
1229
1492
  },
1230
- '.ids-button.ids-button-filled.ids-button-dark:disabled>.ids-icon': {
1493
+ '.ids-button.ids-button-filled.ids-button-dark:is(:disabled,.ids-button-disabled)>.ids-icon': {
1231
1494
  color: 'var(--ids-comp-button-filled-color-fg-icon-dark-disabled)',
1232
1495
  },
1233
1496
  '.ids-button.ids-button-filled.ids-button-surface': {
@@ -1262,12 +1525,12 @@ module.exports = function ComponentsPlugin() {
1262
1525
  '.ids-button.ids-button-filled.ids-button-surface:active>.ids-icon': {
1263
1526
  color: 'var(--ids-comp-button-filled-color-fg-icon-surface-pressed)',
1264
1527
  },
1265
- '.ids-button.ids-button-filled.ids-button-surface:disabled': {
1528
+ '.ids-button.ids-button-filled.ids-button-surface:is(:disabled,.ids-button-disabled)': {
1266
1529
  color: 'var(--ids-comp-button-filled-color-fg-label-surface-disabled)',
1267
1530
  background: 'var(--ids-comp-button-filled-color-bg-surface-disabled)',
1268
1531
  borderColor: 'var(--ids-comp-button-filled-color-border-surface-disabled)',
1269
1532
  },
1270
- '.ids-button.ids-button-filled.ids-button-surface:disabled>.ids-icon': {
1533
+ '.ids-button.ids-button-filled.ids-button-surface:is(:disabled,.ids-button-disabled)>.ids-icon': {
1271
1534
  color: 'var(--ids-comp-button-filled-color-fg-icon-surface-disabled)',
1272
1535
  },
1273
1536
  '.ids-button.ids-button-outlined.ids-button-primary': {
@@ -1302,12 +1565,12 @@ module.exports = function ComponentsPlugin() {
1302
1565
  '.ids-button.ids-button-outlined.ids-button-primary:active>.ids-icon': {
1303
1566
  color: 'var(--ids-comp-button-outlined-color-fg-icon-primary-pressed)',
1304
1567
  },
1305
- '.ids-button.ids-button-outlined.ids-button-primary:disabled': {
1568
+ '.ids-button.ids-button-outlined.ids-button-primary:is(:disabled,.ids-button-disabled)': {
1306
1569
  color: 'var(--ids-comp-button-outlined-color-fg-label-primary-disabled)',
1307
1570
  background: 'var(--ids-comp-button-outlined-color-bg-primary-disabled)',
1308
1571
  borderColor: 'var(--ids-comp-button-outlined-color-border-primary-disabled)',
1309
1572
  },
1310
- '.ids-button.ids-button-outlined.ids-button-primary:disabled>.ids-icon': {
1573
+ '.ids-button.ids-button-outlined.ids-button-primary:is(:disabled,.ids-button-disabled)>.ids-icon': {
1311
1574
  color: 'var(--ids-comp-button-outlined-color-fg-icon-primary-disabled)',
1312
1575
  },
1313
1576
  '.ids-button.ids-button-outlined.ids-button-secondary': {
@@ -1342,12 +1605,12 @@ module.exports = function ComponentsPlugin() {
1342
1605
  '.ids-button.ids-button-outlined.ids-button-secondary:active>.ids-icon': {
1343
1606
  color: 'var(--ids-comp-button-outlined-color-fg-icon-secondary-pressed)',
1344
1607
  },
1345
- '.ids-button.ids-button-outlined.ids-button-secondary:disabled': {
1608
+ '.ids-button.ids-button-outlined.ids-button-secondary:is(:disabled,.ids-button-disabled)': {
1346
1609
  color: 'var(--ids-comp-button-outlined-color-fg-label-secondary-disabled)',
1347
1610
  background: 'var(--ids-comp-button-outlined-color-bg-secondary-disabled)',
1348
1611
  borderColor: 'var(--ids-comp-button-outlined-color-border-secondary-disabled)',
1349
1612
  },
1350
- '.ids-button.ids-button-outlined.ids-button-secondary:disabled>.ids-icon': {
1613
+ '.ids-button.ids-button-outlined.ids-button-secondary:is(:disabled,.ids-button-disabled)>.ids-icon': {
1351
1614
  color: 'var(--ids-comp-button-outlined-color-fg-icon-secondary-disabled)',
1352
1615
  },
1353
1616
  '.ids-button.ids-button-outlined.ids-button-brand': {
@@ -1382,12 +1645,12 @@ module.exports = function ComponentsPlugin() {
1382
1645
  '.ids-button.ids-button-outlined.ids-button-brand:active>.ids-icon': {
1383
1646
  color: 'var(--ids-comp-button-outlined-color-fg-icon-brand-pressed)',
1384
1647
  },
1385
- '.ids-button.ids-button-outlined.ids-button-brand:disabled': {
1648
+ '.ids-button.ids-button-outlined.ids-button-brand:is(:disabled,.ids-button-disabled)': {
1386
1649
  color: 'var(--ids-comp-button-outlined-color-fg-label-brand-disabled)',
1387
1650
  background: 'var(--ids-comp-button-outlined-color-bg-brand-disabled)',
1388
1651
  borderColor: 'var(--ids-comp-button-outlined-color-border-brand-disabled)',
1389
1652
  },
1390
- '.ids-button.ids-button-outlined.ids-button-brand:disabled>.ids-icon': {
1653
+ '.ids-button.ids-button-outlined.ids-button-brand:is(:disabled,.ids-button-disabled)>.ids-icon': {
1391
1654
  color: 'var(--ids-comp-button-outlined-color-fg-icon-brand-disabled)',
1392
1655
  },
1393
1656
  '.ids-button.ids-button-outlined.ids-button-error': {
@@ -1422,12 +1685,12 @@ module.exports = function ComponentsPlugin() {
1422
1685
  '.ids-button.ids-button-outlined.ids-button-error:active>.ids-icon': {
1423
1686
  color: 'var(--ids-comp-button-outlined-color-fg-icon-error-pressed)',
1424
1687
  },
1425
- '.ids-button.ids-button-outlined.ids-button-error:disabled': {
1688
+ '.ids-button.ids-button-outlined.ids-button-error:is(:disabled,.ids-button-disabled)': {
1426
1689
  color: 'var(--ids-comp-button-outlined-color-fg-label-error-disabled)',
1427
1690
  background: 'var(--ids-comp-button-outlined-color-bg-error-disabled)',
1428
1691
  borderColor: 'var(--ids-comp-button-outlined-color-border-error-disabled)',
1429
1692
  },
1430
- '.ids-button.ids-button-outlined.ids-button-error:disabled>.ids-icon': {
1693
+ '.ids-button.ids-button-outlined.ids-button-error:is(:disabled,.ids-button-disabled)>.ids-icon': {
1431
1694
  color: 'var(--ids-comp-button-outlined-color-fg-icon-error-disabled)',
1432
1695
  },
1433
1696
  '.ids-button.ids-button-outlined.ids-button-success': {
@@ -1462,12 +1725,12 @@ module.exports = function ComponentsPlugin() {
1462
1725
  '.ids-button.ids-button-outlined.ids-button-success:active>.ids-icon': {
1463
1726
  color: 'var(--ids-comp-button-outlined-color-fg-icon-success-pressed)',
1464
1727
  },
1465
- '.ids-button.ids-button-outlined.ids-button-success:disabled': {
1728
+ '.ids-button.ids-button-outlined.ids-button-success:is(:disabled,.ids-button-disabled)': {
1466
1729
  color: 'var(--ids-comp-button-outlined-color-fg-label-success-disabled)',
1467
1730
  background: 'var(--ids-comp-button-outlined-color-bg-success-disabled)',
1468
1731
  borderColor: 'var(--ids-comp-button-outlined-color-border-success-disabled)',
1469
1732
  },
1470
- '.ids-button.ids-button-outlined.ids-button-success:disabled>.ids-icon': {
1733
+ '.ids-button.ids-button-outlined.ids-button-success:is(:disabled,.ids-button-disabled)>.ids-icon': {
1471
1734
  color: 'var(--ids-comp-button-outlined-color-fg-icon-success-disabled)',
1472
1735
  },
1473
1736
  '.ids-button.ids-button-outlined.ids-button-warning': {
@@ -1502,12 +1765,12 @@ module.exports = function ComponentsPlugin() {
1502
1765
  '.ids-button.ids-button-outlined.ids-button-warning:active>.ids-icon': {
1503
1766
  color: 'var(--ids-comp-button-outlined-color-fg-icon-warning-pressed)',
1504
1767
  },
1505
- '.ids-button.ids-button-outlined.ids-button-warning:disabled': {
1768
+ '.ids-button.ids-button-outlined.ids-button-warning:is(:disabled,.ids-button-disabled)': {
1506
1769
  color: 'var(--ids-comp-button-outlined-color-fg-label-warning-disabled)',
1507
1770
  background: 'var(--ids-comp-button-outlined-color-bg-warning-disabled)',
1508
1771
  borderColor: 'var(--ids-comp-button-outlined-color-border-warning-disabled)',
1509
1772
  },
1510
- '.ids-button.ids-button-outlined.ids-button-warning:disabled>.ids-icon': {
1773
+ '.ids-button.ids-button-outlined.ids-button-warning:is(:disabled,.ids-button-disabled)>.ids-icon': {
1511
1774
  color: 'var(--ids-comp-button-outlined-color-fg-icon-warning-disabled)',
1512
1775
  },
1513
1776
  '.ids-button.ids-button-outlined.ids-button-light': {
@@ -1542,12 +1805,12 @@ module.exports = function ComponentsPlugin() {
1542
1805
  '.ids-button.ids-button-outlined.ids-button-light:active>.ids-icon': {
1543
1806
  color: 'var(--ids-comp-button-outlined-color-fg-icon-light-pressed)',
1544
1807
  },
1545
- '.ids-button.ids-button-outlined.ids-button-light:disabled': {
1808
+ '.ids-button.ids-button-outlined.ids-button-light:is(:disabled,.ids-button-disabled)': {
1546
1809
  color: 'var(--ids-comp-button-outlined-color-fg-label-light-disabled)',
1547
1810
  background: 'var(--ids-comp-button-outlined-color-bg-light-disabled)',
1548
1811
  borderColor: 'var(--ids-comp-button-outlined-color-border-light-disabled)',
1549
1812
  },
1550
- '.ids-button.ids-button-outlined.ids-button-light:disabled>.ids-icon': {
1813
+ '.ids-button.ids-button-outlined.ids-button-light:is(:disabled,.ids-button-disabled)>.ids-icon': {
1551
1814
  color: 'var(--ids-comp-button-outlined-color-fg-icon-light-disabled)',
1552
1815
  },
1553
1816
  '.ids-button.ids-button-outlined.ids-button-light-fixed': {
@@ -1582,12 +1845,12 @@ module.exports = function ComponentsPlugin() {
1582
1845
  '.ids-button.ids-button-outlined.ids-button-light-fixed:active>.ids-icon': {
1583
1846
  color: 'var(--ids-comp-button-outlined-color-fg-icon-light-fixed-pressed)',
1584
1847
  },
1585
- '.ids-button.ids-button-outlined.ids-button-light-fixed:disabled': {
1848
+ '.ids-button.ids-button-outlined.ids-button-light-fixed:is(:disabled,.ids-button-disabled)': {
1586
1849
  color: 'var(--ids-comp-button-outlined-color-fg-label-light-fixed-disabled)',
1587
1850
  background: 'var(--ids-comp-button-outlined-color-bg-light-fixed-disabled)',
1588
1851
  borderColor: 'var(--ids-comp-button-outlined-color-border-light-fixed-disabled)',
1589
1852
  },
1590
- '.ids-button.ids-button-outlined.ids-button-light-fixed:disabled>.ids-icon': {
1853
+ '.ids-button.ids-button-outlined.ids-button-light-fixed:is(:disabled,.ids-button-disabled)>.ids-icon': {
1591
1854
  color: 'var(--ids-comp-button-outlined-color-fg-icon-light-fixed-disabled)',
1592
1855
  },
1593
1856
  '.ids-button.ids-button-outlined.ids-button-dark': {
@@ -1620,12 +1883,12 @@ module.exports = function ComponentsPlugin() {
1620
1883
  '.ids-button.ids-button-outlined.ids-button-dark:active>.ids-icon': {
1621
1884
  color: 'var(--ids-comp-button-outlined-color-fg-icon-dark-pressed)',
1622
1885
  },
1623
- '.ids-button.ids-button-outlined.ids-button-dark:disabled': {
1886
+ '.ids-button.ids-button-outlined.ids-button-dark:is(:disabled,.ids-button-disabled)': {
1624
1887
  color: 'var(--ids-comp-button-outlined-color-fg-label-dark-disabled)',
1625
1888
  background: 'var(--ids-comp-button-outlined-color-bg-dark-disabled)',
1626
1889
  borderColor: 'var(--ids-comp-button-outlined-color-border-dark-disabled)',
1627
1890
  },
1628
- '.ids-button.ids-button-outlined.ids-button-dark:disabled>.ids-icon': {
1891
+ '.ids-button.ids-button-outlined.ids-button-dark:is(:disabled,.ids-button-disabled)>.ids-icon': {
1629
1892
  color: 'var(--ids-comp-button-outlined-color-fg-icon-dark-disabled)',
1630
1893
  },
1631
1894
  '.ids-button.ids-button-outlined.ids-button-surface': {
@@ -1660,12 +1923,12 @@ module.exports = function ComponentsPlugin() {
1660
1923
  '.ids-button.ids-button-outlined.ids-button-surface:active>.ids-icon': {
1661
1924
  color: 'var(--ids-comp-button-outlined-color-fg-icon-surface-pressed)',
1662
1925
  },
1663
- '.ids-button.ids-button-outlined.ids-button-surface:disabled': {
1926
+ '.ids-button.ids-button-outlined.ids-button-surface:is(:disabled,.ids-button-disabled)': {
1664
1927
  color: 'var(--ids-comp-button-outlined-color-fg-label-surface-disabled)',
1665
1928
  background: 'var(--ids-comp-button-outlined-color-bg-surface-disabled)',
1666
1929
  borderColor: 'var(--ids-comp-button-outlined-color-border-surface-disabled)',
1667
1930
  },
1668
- '.ids-button.ids-button-outlined.ids-button-surface:disabled>.ids-icon': {
1931
+ '.ids-button.ids-button-outlined.ids-button-surface:is(:disabled,.ids-button-disabled)>.ids-icon': {
1669
1932
  color: 'var(--ids-comp-button-outlined-color-fg-icon-surface-disabled)',
1670
1933
  },
1671
1934
  '.ids-button.ids-button-text.ids-button-primary': {
@@ -1698,12 +1961,12 @@ module.exports = function ComponentsPlugin() {
1698
1961
  '.ids-button.ids-button-text.ids-button-primary:active>.ids-icon': {
1699
1962
  color: 'var(--ids-comp-button-text-color-fg-icon-primary-pressed)',
1700
1963
  },
1701
- '.ids-button.ids-button-text.ids-button-primary:disabled': {
1964
+ '.ids-button.ids-button-text.ids-button-primary:is(:disabled,.ids-button-disabled)': {
1702
1965
  color: 'var(--ids-comp-button-text-color-fg-label-primary-disabled)',
1703
1966
  background: 'var(--ids-comp-button-text-color-bg-primary-disabled)',
1704
1967
  borderColor: 'var(--ids-comp-button-text-color-border-primary-default)',
1705
1968
  },
1706
- '.ids-button.ids-button-text.ids-button-primary:disabled>.ids-icon': {
1969
+ '.ids-button.ids-button-text.ids-button-primary:is(:disabled,.ids-button-disabled)>.ids-icon': {
1707
1970
  color: 'var(--ids-comp-button-text-color-fg-icon-primary-disabled)',
1708
1971
  },
1709
1972
  '.ids-button.ids-button-text.ids-button-secondary': {
@@ -1738,12 +2001,12 @@ module.exports = function ComponentsPlugin() {
1738
2001
  '.ids-button.ids-button-text.ids-button-secondary:active>.ids-icon': {
1739
2002
  color: 'var(--ids-comp-button-text-color-fg-icon-secondary-pressed)',
1740
2003
  },
1741
- '.ids-button.ids-button-text.ids-button-secondary:disabled': {
2004
+ '.ids-button.ids-button-text.ids-button-secondary:is(:disabled,.ids-button-disabled)': {
1742
2005
  color: 'var(--ids-comp-button-text-color-fg-label-secondary-disabled)',
1743
2006
  background: 'var(--ids-comp-button-text-color-bg-secondary-disabled)',
1744
2007
  borderColor: 'var(--ids-comp-button-text-color-border-secondary-default)',
1745
2008
  },
1746
- '.ids-button.ids-button-text.ids-button-secondary:disabled>.ids-icon': {
2009
+ '.ids-button.ids-button-text.ids-button-secondary:is(:disabled,.ids-button-disabled)>.ids-icon': {
1747
2010
  color: 'var(--ids-comp-button-text-color-fg-icon-secondary-disabled)',
1748
2011
  },
1749
2012
  '.ids-button.ids-button-text.ids-button-brand': {
@@ -1773,12 +2036,12 @@ module.exports = function ComponentsPlugin() {
1773
2036
  borderColor: 'var(--ids-comp-button-text-color-border-brand-default)',
1774
2037
  },
1775
2038
  '.ids-button.ids-button-text.ids-button-brand:active>.ids-icon': { color: 'var(--ids-comp-button-text-color-fg-icon-brand-pressed)' },
1776
- '.ids-button.ids-button-text.ids-button-brand:disabled': {
2039
+ '.ids-button.ids-button-text.ids-button-brand:is(:disabled,.ids-button-disabled)': {
1777
2040
  color: 'var(--ids-comp-button-text-color-fg-label-brand-disabled)',
1778
2041
  background: 'var(--ids-comp-button-text-color-bg-brand-disabled)',
1779
2042
  borderColor: 'var(--ids-comp-button-text-color-border-brand-default)',
1780
2043
  },
1781
- '.ids-button.ids-button-text.ids-button-brand:disabled>.ids-icon': {
2044
+ '.ids-button.ids-button-text.ids-button-brand:is(:disabled,.ids-button-disabled)>.ids-icon': {
1782
2045
  color: 'var(--ids-comp-button-text-color-fg-icon-brand-disabled)',
1783
2046
  },
1784
2047
  '.ids-button.ids-button-text.ids-button-error': {
@@ -1808,12 +2071,12 @@ module.exports = function ComponentsPlugin() {
1808
2071
  borderColor: 'var(--ids-comp-button-text-color-border-error-default)',
1809
2072
  },
1810
2073
  '.ids-button.ids-button-text.ids-button-error:active>.ids-icon': { color: 'var(--ids-comp-button-text-color-fg-icon-error-pressed)' },
1811
- '.ids-button.ids-button-text.ids-button-error:disabled': {
2074
+ '.ids-button.ids-button-text.ids-button-error:is(:disabled,.ids-button-disabled)': {
1812
2075
  color: 'var(--ids-comp-button-text-color-fg-label-error-disabled)',
1813
2076
  background: 'var(--ids-comp-button-text-color-bg-error-disabled)',
1814
2077
  borderColor: 'var(--ids-comp-button-text-color-border-error-default)',
1815
2078
  },
1816
- '.ids-button.ids-button-text.ids-button-error:disabled>.ids-icon': {
2079
+ '.ids-button.ids-button-text.ids-button-error:is(:disabled,.ids-button-disabled)>.ids-icon': {
1817
2080
  color: 'var(--ids-comp-button-text-color-fg-icon-error-disabled)',
1818
2081
  },
1819
2082
  '.ids-button.ids-button-text.ids-button-success': {
@@ -1846,12 +2109,12 @@ module.exports = function ComponentsPlugin() {
1846
2109
  '.ids-button.ids-button-text.ids-button-success:active>.ids-icon': {
1847
2110
  color: 'var(--ids-comp-button-text-color-fg-icon-success-pressed)',
1848
2111
  },
1849
- '.ids-button.ids-button-text.ids-button-success:disabled': {
2112
+ '.ids-button.ids-button-text.ids-button-success:is(:disabled,.ids-button-disabled)': {
1850
2113
  color: 'var(--ids-comp-button-text-color-fg-label-success-disabled)',
1851
2114
  background: 'var(--ids-comp-button-text-color-bg-success-disabled)',
1852
2115
  borderColor: 'var(--ids-comp-button-text-color-border-success-default)',
1853
2116
  },
1854
- '.ids-button.ids-button-text.ids-button-success:disabled>.ids-icon': {
2117
+ '.ids-button.ids-button-text.ids-button-success:is(:disabled,.ids-button-disabled)>.ids-icon': {
1855
2118
  color: 'var(--ids-comp-button-text-color-fg-icon-success-disabled)',
1856
2119
  },
1857
2120
  '.ids-button.ids-button-text.ids-button-warning': {
@@ -1884,12 +2147,12 @@ module.exports = function ComponentsPlugin() {
1884
2147
  '.ids-button.ids-button-text.ids-button-warning:active>.ids-icon': {
1885
2148
  color: 'var(--ids-comp-button-text-color-fg-icon-warning-pressed)',
1886
2149
  },
1887
- '.ids-button.ids-button-text.ids-button-warning:disabled': {
2150
+ '.ids-button.ids-button-text.ids-button-warning:is(:disabled,.ids-button-disabled)': {
1888
2151
  color: 'var(--ids-comp-button-text-color-fg-label-warning-disabled)',
1889
2152
  background: 'var(--ids-comp-button-text-color-bg-warning-disabled)',
1890
2153
  borderColor: 'var(--ids-comp-button-text-color-border-warning-default)',
1891
2154
  },
1892
- '.ids-button.ids-button-text.ids-button-warning:disabled>.ids-icon': {
2155
+ '.ids-button.ids-button-text.ids-button-warning:is(:disabled,.ids-button-disabled)>.ids-icon': {
1893
2156
  color: 'var(--ids-comp-button-text-color-fg-icon-warning-disabled)',
1894
2157
  },
1895
2158
  '.ids-button.ids-button-text.ids-button-light': {
@@ -1919,12 +2182,12 @@ module.exports = function ComponentsPlugin() {
1919
2182
  borderColor: 'var(--ids-comp-button-text-color-border-light-default)',
1920
2183
  },
1921
2184
  '.ids-button.ids-button-text.ids-button-light:active>.ids-icon': { color: 'var(--ids-comp-button-text-color-fg-icon-light-pressed)' },
1922
- '.ids-button.ids-button-text.ids-button-light:disabled': {
2185
+ '.ids-button.ids-button-text.ids-button-light:is(:disabled,.ids-button-disabled)': {
1923
2186
  color: 'var(--ids-comp-button-text-color-fg-label-light-disabled)',
1924
2187
  background: 'var(--ids-comp-button-text-color-bg-light-disabled)',
1925
2188
  borderColor: 'var(--ids-comp-button-text-color-border-light-default)',
1926
2189
  },
1927
- '.ids-button.ids-button-text.ids-button-light:disabled>.ids-icon': {
2190
+ '.ids-button.ids-button-text.ids-button-light:is(:disabled,.ids-button-disabled)>.ids-icon': {
1928
2191
  color: 'var(--ids-comp-button-text-color-fg-icon-light-disabled)',
1929
2192
  },
1930
2193
  '.ids-button.ids-button-text.ids-button-light-fixed': {
@@ -1959,12 +2222,12 @@ module.exports = function ComponentsPlugin() {
1959
2222
  '.ids-button.ids-button-text.ids-button-light-fixed:active>.ids-icon': {
1960
2223
  color: 'var(--ids-comp-button-text-color-fg-icon-light-fixed-pressed)',
1961
2224
  },
1962
- '.ids-button.ids-button-text.ids-button-light-fixed:disabled': {
2225
+ '.ids-button.ids-button-text.ids-button-light-fixed:is(:disabled,.ids-button-disabled)': {
1963
2226
  color: 'var(--ids-comp-button-text-color-fg-label-light-fixed-disabled)',
1964
2227
  background: 'var(--ids-comp-button-text-color-bg-light-fixed-disabled)',
1965
2228
  borderColor: 'var(--ids-comp-button-text-color-border-light-fixed-default)',
1966
2229
  },
1967
- '.ids-button.ids-button-text.ids-button-light-fixed:disabled>.ids-icon': {
2230
+ '.ids-button.ids-button-text.ids-button-light-fixed:is(:disabled,.ids-button-disabled)>.ids-icon': {
1968
2231
  color: 'var(--ids-comp-button-text-color-fg-icon-light-fixed-disabled)',
1969
2232
  },
1970
2233
  '.ids-button.ids-button-text.ids-button-dark': {
@@ -1994,12 +2257,12 @@ module.exports = function ComponentsPlugin() {
1994
2257
  borderColor: 'var(--ids-comp-button-text-color-border-dark-default)',
1995
2258
  },
1996
2259
  '.ids-button.ids-button-text.ids-button-dark:active>.ids-icon': { color: 'var(--ids-comp-button-text-color-fg-icon-dark-pressed)' },
1997
- '.ids-button.ids-button-text.ids-button-dark:disabled': {
2260
+ '.ids-button.ids-button-text.ids-button-dark:is(:disabled,.ids-button-disabled)': {
1998
2261
  color: 'var(--ids-comp-button-text-color-fg-label-dark-disabled)',
1999
2262
  background: 'var(--ids-comp-button-text-color-bg-dark-disabled)',
2000
2263
  borderColor: 'var(--ids-comp-button-text-color-border-dark-default)',
2001
2264
  },
2002
- '.ids-button.ids-button-text.ids-button-dark:disabled>.ids-icon': {
2265
+ '.ids-button.ids-button-text.ids-button-dark:is(:disabled,.ids-button-disabled)>.ids-icon': {
2003
2266
  color: 'var(--ids-comp-button-text-color-fg-icon-dark-disabled)',
2004
2267
  },
2005
2268
  '.ids-button.ids-button-text.ids-button-surface': {
@@ -2032,12 +2295,12 @@ module.exports = function ComponentsPlugin() {
2032
2295
  '.ids-button.ids-button-text.ids-button-surface:active>.ids-icon': {
2033
2296
  color: 'var(--ids-comp-button-text-color-fg-icon-surface-pressed)',
2034
2297
  },
2035
- '.ids-button.ids-button-text.ids-button-surface:disabled': {
2298
+ '.ids-button.ids-button-text.ids-button-surface:is(:disabled,.ids-button-disabled)': {
2036
2299
  color: 'var(--ids-comp-button-text-color-fg-label-surface-disabled)',
2037
2300
  background: 'var(--ids-comp-button-text-color-bg-surface-disabled)',
2038
2301
  borderColor: 'var(--ids-comp-button-text-color-border-surface-default)',
2039
2302
  },
2040
- '.ids-button.ids-button-text.ids-button-surface:disabled>.ids-icon': {
2303
+ '.ids-button.ids-button-text.ids-button-surface:is(:disabled,.ids-button-disabled)>.ids-icon': {
2041
2304
  color: 'var(--ids-comp-button-text-color-fg-icon-surface-disabled)',
2042
2305
  },
2043
2306
  '.ids-card': {
@@ -6622,8 +6885,8 @@ module.exports = function ComponentsPlugin() {
6622
6885
  },
6623
6886
  '.ids-icon-button:focus,.ids-icon-button:focus-visible': { outlineOffset: '2px', outlineStyle: 'solid' },
6624
6887
  '.ids-icon-button:active': { outlineStyle: 'none' },
6625
- '.ids-icon-button:not(:disabled)': { cursor: 'pointer' },
6626
- '.ids-icon-button:disabled': { cursor: 'not-allowed' },
6888
+ '.ids-icon-button:not(:is(:disabled,.ids-icon-button-disabled))': { cursor: 'pointer' },
6889
+ '.ids-icon-button:is(:disabled,.ids-icon-button-disabled)': { cursor: 'not-allowed' },
6627
6890
  '.ids-icon-button>.ids-icon': { color: 'inherit' },
6628
6891
  '.ids-icon-button.ids-icon-button-compact': {
6629
6892
  padding: 'var(--ids-comp-icon-button-size-padding-y-compact) var(--ids-comp-icon-button-size-padding-x-compact)',
@@ -6715,7 +6978,7 @@ module.exports = function ComponentsPlugin() {
6715
6978
  color: 'var(--ids-comp-icon-button-filled-color-fg-primary-pressed)',
6716
6979
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-primary-pressed)',
6717
6980
  },
6718
- '.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:disabled': {
6981
+ '.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:is(:disabled,.ids-icon-button-disabled)': {
6719
6982
  background: 'var(--ids-comp-icon-button-filled-color-bg-primary-disabled)',
6720
6983
  color: 'var(--ids-comp-icon-button-filled-color-fg-primary-disabled)',
6721
6984
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-primary-disabled)',
@@ -6742,7 +7005,7 @@ module.exports = function ComponentsPlugin() {
6742
7005
  color: 'var(--ids-comp-icon-button-filled-color-fg-secondary-pressed)',
6743
7006
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-secondary-pressed)',
6744
7007
  },
6745
- '.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:disabled': {
7008
+ '.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:is(:disabled,.ids-icon-button-disabled)': {
6746
7009
  background: 'var(--ids-comp-icon-button-filled-color-bg-secondary-disabled)',
6747
7010
  color: 'var(--ids-comp-icon-button-filled-color-fg-secondary-disabled)',
6748
7011
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-secondary-disabled)',
@@ -6769,7 +7032,7 @@ module.exports = function ComponentsPlugin() {
6769
7032
  color: 'var(--ids-comp-icon-button-filled-color-fg-brand-pressed)',
6770
7033
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-brand-pressed)',
6771
7034
  },
6772
- '.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:disabled': {
7035
+ '.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:is(:disabled,.ids-icon-button-disabled)': {
6773
7036
  background: 'var(--ids-comp-icon-button-filled-color-bg-brand-disabled)',
6774
7037
  color: 'var(--ids-comp-icon-button-filled-color-fg-brand-disabled)',
6775
7038
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-brand-disabled)',
@@ -6862,7 +7125,7 @@ module.exports = function ComponentsPlugin() {
6862
7125
  color: 'var(--ids-comp-icon-button-filled-color-fg-light-pressed)',
6863
7126
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-light-pressed)',
6864
7127
  },
6865
- '.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:disabled': {
7128
+ '.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:is(:disabled,.ids-icon-button-disabled)': {
6866
7129
  background: 'var(--ids-comp-icon-button-filled-color-bg-light-disabled)',
6867
7130
  color: 'var(--ids-comp-icon-button-filled-color-fg-light-disabled)',
6868
7131
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-light-disabled)',
@@ -6889,7 +7152,7 @@ module.exports = function ComponentsPlugin() {
6889
7152
  color: 'var(--ids-comp-icon-button-filled-color-fg-dark-pressed)',
6890
7153
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-dark-pressed)',
6891
7154
  },
6892
- '.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:disabled': {
7155
+ '.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:is(:disabled,.ids-icon-button-disabled)': {
6893
7156
  background: 'var(--ids-comp-icon-button-filled-color-bg-dark-disabled)',
6894
7157
  color: 'var(--ids-comp-icon-button-filled-color-fg-dark-disabled)',
6895
7158
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-dark-disabled)',
@@ -6916,7 +7179,7 @@ module.exports = function ComponentsPlugin() {
6916
7179
  color: 'var(--ids-comp-icon-button-filled-color-fg-surface-pressed)',
6917
7180
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-surface-pressed)',
6918
7181
  },
6919
- '.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:disabled': {
7182
+ '.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:is(:disabled,.ids-icon-button-disabled)': {
6920
7183
  background: 'var(--ids-comp-icon-button-filled-color-bg-surface-disabled)',
6921
7184
  color: 'var(--ids-comp-icon-button-filled-color-fg-surface-disabled)',
6922
7185
  borderColor: 'var(--ids-comp-icon-button-filled-color-border-surface-disabled)',
@@ -6943,7 +7206,7 @@ module.exports = function ComponentsPlugin() {
6943
7206
  color: 'var(--ids-comp-icon-button-outlined-color-fg-primary-pressed)',
6944
7207
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-primary-pressed)',
6945
7208
  },
6946
- '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:disabled': {
7209
+ '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:is(:disabled,.ids-icon-button-disabled)': {
6947
7210
  background: 'var(--ids-comp-icon-button-outlined-color-bg-primary-disabled)',
6948
7211
  color: 'var(--ids-comp-icon-button-outlined-color-fg-primary-disabled)',
6949
7212
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-primary-disabled)',
@@ -6970,7 +7233,7 @@ module.exports = function ComponentsPlugin() {
6970
7233
  color: 'var(--ids-comp-icon-button-outlined-color-fg-secondary-pressed)',
6971
7234
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-secondary-pressed)',
6972
7235
  },
6973
- '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:disabled': {
7236
+ '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:is(:disabled,.ids-icon-button-disabled)': {
6974
7237
  background: 'var(--ids-comp-icon-button-outlined-color-bg-secondary-disabled)',
6975
7238
  color: 'var(--ids-comp-icon-button-outlined-color-fg-secondary-disabled)',
6976
7239
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-secondary-disabled)',
@@ -6997,7 +7260,7 @@ module.exports = function ComponentsPlugin() {
6997
7260
  color: 'var(--ids-comp-icon-button-outlined-color-fg-brand-pressed)',
6998
7261
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-brand-pressed)',
6999
7262
  },
7000
- '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:disabled': {
7263
+ '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:is(:disabled,.ids-icon-button-disabled)': {
7001
7264
  background: 'var(--ids-comp-icon-button-outlined-color-bg-brand-disabled)',
7002
7265
  color: 'var(--ids-comp-icon-button-outlined-color-fg-brand-disabled)',
7003
7266
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-brand-disabled)',
@@ -7090,7 +7353,7 @@ module.exports = function ComponentsPlugin() {
7090
7353
  color: 'var(--ids-comp-icon-button-outlined-color-fg-light-pressed)',
7091
7354
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-light-pressed)',
7092
7355
  },
7093
- '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:disabled': {
7356
+ '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:is(:disabled,.ids-icon-button-disabled)': {
7094
7357
  background: 'var(--ids-comp-icon-button-outlined-color-bg-light-disabled)',
7095
7358
  color: 'var(--ids-comp-icon-button-outlined-color-fg-light-disabled)',
7096
7359
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-light-disabled)',
@@ -7117,7 +7380,7 @@ module.exports = function ComponentsPlugin() {
7117
7380
  color: 'var(--ids-comp-icon-button-outlined-color-fg-dark-pressed)',
7118
7381
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-dark-pressed)',
7119
7382
  },
7120
- '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:disabled': {
7383
+ '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:is(:disabled,.ids-icon-button-disabled)': {
7121
7384
  background: 'var(--ids-comp-icon-button-outlined-color-bg-dark-disabled)',
7122
7385
  color: 'var(--ids-comp-icon-button-outlined-color-fg-dark-disabled)',
7123
7386
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-dark-disabled)',
@@ -7144,7 +7407,7 @@ module.exports = function ComponentsPlugin() {
7144
7407
  color: 'var(--ids-comp-icon-button-outlined-color-fg-surface-pressed)',
7145
7408
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-surface-pressed)',
7146
7409
  },
7147
- '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:disabled': {
7410
+ '.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:is(:disabled,.ids-icon-button-disabled)': {
7148
7411
  background: 'var(--ids-comp-icon-button-outlined-color-bg-surface-disabled)',
7149
7412
  color: 'var(--ids-comp-icon-button-outlined-color-fg-surface-disabled)',
7150
7413
  borderColor: 'var(--ids-comp-icon-button-outlined-color-border-surface-disabled)',
@@ -7168,7 +7431,7 @@ module.exports = function ComponentsPlugin() {
7168
7431
  background: 'var(--ids-comp-icon-button-standard-color-bg-primary-pressed)',
7169
7432
  color: 'var(--ids-comp-icon-button-standard-color-fg-primary-pressed)',
7170
7433
  },
7171
- '.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:disabled': {
7434
+ '.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:is(:disabled,.ids-icon-button-disabled)': {
7172
7435
  background: 'var(--ids-comp-icon-button-standard-color-bg-primary-disabled)',
7173
7436
  color: 'var(--ids-comp-icon-button-standard-color-fg-primary-disabled)',
7174
7437
  },
@@ -7190,7 +7453,7 @@ module.exports = function ComponentsPlugin() {
7190
7453
  background: 'var(--ids-comp-icon-button-standard-color-bg-secondary-pressed)',
7191
7454
  color: 'var(--ids-comp-icon-button-standard-color-fg-secondary-pressed)',
7192
7455
  },
7193
- '.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:disabled': {
7456
+ '.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:is(:disabled,.ids-icon-button-disabled)': {
7194
7457
  background: 'var(--ids-comp-icon-button-standard-color-bg-secondary-disabled)',
7195
7458
  color: 'var(--ids-comp-icon-button-standard-color-fg-secondary-disabled)',
7196
7459
  },
@@ -7212,7 +7475,7 @@ module.exports = function ComponentsPlugin() {
7212
7475
  background: 'var(--ids-comp-icon-button-standard-color-bg-brand-pressed)',
7213
7476
  color: 'var(--ids-comp-icon-button-standard-color-fg-brand-pressed)',
7214
7477
  },
7215
- '.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:disabled': {
7478
+ '.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:is(:disabled,.ids-icon-button-disabled)': {
7216
7479
  background: 'var(--ids-comp-icon-button-standard-color-bg-brand-disabled)',
7217
7480
  color: 'var(--ids-comp-icon-button-standard-color-fg-brand-disabled)',
7218
7481
  },
@@ -7288,7 +7551,7 @@ module.exports = function ComponentsPlugin() {
7288
7551
  background: 'var(--ids-comp-icon-button-standard-color-bg-light-pressed)',
7289
7552
  color: 'var(--ids-comp-icon-button-standard-color-fg-light-pressed)',
7290
7553
  },
7291
- '.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:disabled': {
7554
+ '.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:is(:disabled,.ids-icon-button-disabled)': {
7292
7555
  background: 'var(--ids-comp-icon-button-standard-color-bg-light-disabled)',
7293
7556
  color: 'var(--ids-comp-icon-button-standard-color-fg-light-disabled)',
7294
7557
  },
@@ -7310,7 +7573,7 @@ module.exports = function ComponentsPlugin() {
7310
7573
  background: 'var(--ids-comp-icon-button-standard-color-bg-dark-pressed)',
7311
7574
  color: 'var(--ids-comp-icon-button-standard-color-fg-dark-pressed)',
7312
7575
  },
7313
- '.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:disabled': {
7576
+ '.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:is(:disabled,.ids-icon-button-disabled)': {
7314
7577
  background: 'var(--ids-comp-icon-button-standard-color-bg-dark-disabled)',
7315
7578
  color: 'var(--ids-comp-icon-button-standard-color-fg-dark-disabled)',
7316
7579
  },
@@ -7332,7 +7595,7 @@ module.exports = function ComponentsPlugin() {
7332
7595
  background: 'var(--ids-comp-icon-button-standard-color-bg-surface-pressed)',
7333
7596
  color: 'var(--ids-comp-icon-button-standard-color-fg-surface-pressed)',
7334
7597
  },
7335
- '.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:disabled': {
7598
+ '.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:is(:disabled,.ids-icon-button-disabled)': {
7336
7599
  background: 'var(--ids-comp-icon-button-standard-color-bg-surface-disabled)',
7337
7600
  color: 'var(--ids-comp-icon-button-standard-color-fg-surface-disabled)',
7338
7601
  },