@i-cell/ids-styles 0.0.59 → 0.0.61

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.
@@ -8016,9 +8016,14 @@ module.exports = function ComponentsPlugin() {
8016
8016
  {
8017
8017
  color: 'var(--ids-comp-menu-item-text-color-fg-label-surface-focused)',
8018
8018
  background: 'var(--ids-comp-menu-item-text-color-bg-surface-focused)',
8019
+ outlineColor: 'var(--ids-comp-button-focused-outline-color-dark-focused)',
8020
+ outlineWidth: 'var(--ids-comp-button-focused-outline-size-outline-dense)',
8021
+ outlineOffset: '2px',
8022
+ outlineStyle: 'solid',
8019
8023
  },
8020
8024
  '.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:active': {
8021
8025
  background: 'var(--ids-comp-menu-item-text-color-bg-surface-pressed)',
8026
+ outlineStyle: 'none',
8022
8027
  },
8023
8028
  '.ids-menu-item.ids-menu-item-text.ids-menu-item-surface:is(:disabled,.ids-menu-item-disabled)': {
8024
8029
  color: 'var(--ids-comp-menu-item-text-color-fg-label-surface-disabled)',
@@ -8039,9 +8044,14 @@ module.exports = function ComponentsPlugin() {
8039
8044
  '.ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus,.ids-menu-item.ids-menu-item-text.ids-menu-item-light:focus-visible': {
8040
8045
  color: 'var(--ids-comp-menu-item-text-color-fg-label-light-focused)',
8041
8046
  background: 'var(--ids-comp-menu-item-text-color-bg-light-focused)',
8047
+ outlineColor: 'var(--ids-comp-button-focused-outline-color-light-focused)',
8048
+ outlineWidth: 'var(--ids-comp-button-focused-outline-size-outline-dense)',
8049
+ outlineOffset: '2px',
8050
+ outlineStyle: 'solid',
8042
8051
  },
8043
8052
  '.ids-menu-item.ids-menu-item-text.ids-menu-item-light:active': {
8044
8053
  background: 'var(--ids-comp-menu-item-text-color-bg-light-pressed)',
8054
+ outlineStyle: 'none',
8045
8055
  },
8046
8056
  '.ids-menu-item.ids-menu-item-text.ids-menu-item-light:is(:disabled,.ids-menu-item-disabled)': {
8047
8057
  color: 'var(--ids-comp-menu-item-text-color-fg-label-light-disabled)',
@@ -8063,9 +8073,14 @@ module.exports = function ComponentsPlugin() {
8063
8073
  {
8064
8074
  color: 'var(--ids-comp-menu-item-filled-color-fg-label-surface-focused)',
8065
8075
  background: 'var(--ids-comp-menu-item-filled-color-bg-surface-focused)',
8076
+ outlineColor: 'var(--ids-comp-button-focused-outline-color-dark-focused)',
8077
+ outlineWidth: 'var(--ids-comp-button-focused-outline-size-outline-dense)',
8078
+ outlineOffset: '2px',
8079
+ outlineStyle: 'solid',
8066
8080
  },
8067
8081
  '.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:active': {
8068
8082
  background: 'var(--ids-comp-menu-item-filled-color-bg-surface-pressed)',
8083
+ outlineStyle: 'none',
8069
8084
  },
8070
8085
  '.ids-menu-item.ids-menu-item-filled.ids-menu-item-surface:is(:disabled,.ids-menu-item-disabled)': {
8071
8086
  color: 'var(--ids-comp-menu-item-filled-color-fg-label-surface-disabled)',
@@ -8087,9 +8102,14 @@ module.exports = function ComponentsPlugin() {
8087
8102
  {
8088
8103
  color: 'var(--ids-comp-menu-item-filled-color-fg-label-light-focused)',
8089
8104
  background: 'var(--ids-comp-menu-item-filled-color-bg-light-focused)',
8105
+ outlineColor: 'var(--ids-comp-button-focused-outline-color-light-focused)',
8106
+ outlineWidth: 'var(--ids-comp-button-focused-outline-size-outline-dense)',
8107
+ outlineOffset: '2px',
8108
+ outlineStyle: 'solid',
8090
8109
  },
8091
8110
  '.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:active': {
8092
8111
  background: 'var(--ids-comp-menu-item-filled-color-bg-light-pressed)',
8112
+ outlineStyle: 'none',
8093
8113
  },
8094
8114
  '.ids-menu-item.ids-menu-item-filled.ids-menu-item-light:is(:disabled,.ids-menu-item-disabled)': {
8095
8115
  color: 'var(--ids-comp-menu-item-filled-color-fg-label-light-disabled)',
@@ -8954,9 +8974,6 @@ module.exports = function ComponentsPlugin() {
8954
8974
  borderColor: 'var(--ids-comp-overlay-panel-elevated-color-border-surface-default)',
8955
8975
  },
8956
8976
  '.ids-overlay-panel.ids-overlay-panel-has-menu button:hover': { borderColor: 'rgba(0,0,0,0)' },
8957
- '.ids-overlay-panel.ids-overlay-panel-has-menu button:focus,.ids-overlay-panel.ids-overlay-panel-has-menu button:focus-visible': {
8958
- outlineStyle: 'none !important',
8959
- },
8960
8977
  '.ids-paginator': {
8961
8978
  boxSizing: 'border-box',
8962
8979
  borderWidth: '0',
@@ -10634,297 +10651,280 @@ module.exports = function ComponentsPlugin() {
10634
10651
  },
10635
10652
  '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary .ids-segmented-control-toggle-item>button:focus-visible':
10636
10653
  { outlineColor: 'var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused)' },
10637
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button':
10638
- {
10639
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-default)',
10640
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-default)',
10641
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
10642
- },
10643
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button .ids-icon':
10644
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-default)' },
10645
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10654
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button': {
10655
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-default)',
10656
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-default)',
10657
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
10658
+ },
10659
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button .ids-icon': {
10660
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-default)',
10661
+ },
10662
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10646
10663
  {
10647
10664
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-active)',
10648
10665
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-active)',
10649
10666
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-active)',
10650
10667
  },
10651
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10668
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10652
10669
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-active)' },
10653
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:hover':
10654
- {
10655
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-hovered)',
10656
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-hovered)',
10657
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-hovered)',
10658
- },
10659
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:hover .ids-icon':
10670
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:hover': {
10671
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-hovered)',
10672
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-hovered)',
10673
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-hovered)',
10674
+ },
10675
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:hover .ids-icon':
10660
10676
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-hovered)' },
10661
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:active':
10662
- {
10663
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-pressed)',
10664
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-pressed)',
10665
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-pressed)',
10666
- },
10667
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:active .ids-icon':
10677
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:active': {
10678
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-pressed)',
10679
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-pressed)',
10680
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-pressed)',
10681
+ },
10682
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:active .ids-icon':
10668
10683
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-pressed)' },
10669
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:focus-visible':
10684
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:focus-visible':
10670
10685
  {
10671
10686
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-focused)',
10672
10687
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-focused)',
10673
10688
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-focused)',
10674
10689
  },
10675
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:focus-visible .ids-icon':
10690
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:focus-visible .ids-icon':
10676
10691
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-focused)' },
10677
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:disabled':
10678
- {
10679
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-disabled)',
10680
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-disabled)',
10681
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-disabled)',
10682
- },
10683
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:disabled .ids-icon':
10692
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:disabled': {
10693
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-disabled)',
10694
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-disabled)',
10695
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-disabled)',
10696
+ },
10697
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:disabled .ids-icon':
10684
10698
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-disabled)' },
10685
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button':
10686
- {
10687
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-default)',
10688
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-default)',
10689
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
10690
- },
10691
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button .ids-icon':
10692
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-default)' },
10693
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10699
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button': {
10700
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-default)',
10701
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-default)',
10702
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
10703
+ },
10704
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button .ids-icon': {
10705
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-default)',
10706
+ },
10707
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10694
10708
  {
10695
10709
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-active)',
10696
10710
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-active)',
10697
10711
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-active)',
10698
10712
  },
10699
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10713
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10700
10714
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-active)' },
10701
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:hover':
10702
- {
10703
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-hovered)',
10704
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-hovered)',
10705
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-hovered)',
10706
- },
10707
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:hover .ids-icon':
10715
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:hover': {
10716
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-hovered)',
10717
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-hovered)',
10718
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-hovered)',
10719
+ },
10720
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:hover .ids-icon':
10708
10721
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-hovered)' },
10709
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:active':
10710
- {
10711
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-pressed)',
10712
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-pressed)',
10713
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-pressed)',
10714
- },
10715
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:active .ids-icon':
10722
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:active': {
10723
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-pressed)',
10724
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-pressed)',
10725
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-pressed)',
10726
+ },
10727
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:active .ids-icon':
10716
10728
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-pressed)' },
10717
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:focus-visible':
10729
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:focus-visible':
10718
10730
  {
10719
10731
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-focused)',
10720
10732
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-focused)',
10721
10733
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-focused)',
10722
10734
  },
10723
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:focus-visible .ids-icon':
10735
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:focus-visible .ids-icon':
10724
10736
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-focused)' },
10725
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:disabled':
10726
- {
10727
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-disabled)',
10728
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-disabled)',
10729
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-disabled)',
10730
- },
10731
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:disabled .ids-icon':
10737
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:disabled': {
10738
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-disabled)',
10739
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-disabled)',
10740
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-disabled)',
10741
+ },
10742
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:disabled .ids-icon':
10732
10743
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-disabled)' },
10733
10744
  '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface .ids-segmented-control-toggle-item>button:focus-visible':
10734
10745
  { outlineColor: 'var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused)' },
10735
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button':
10736
- {
10737
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-default)',
10738
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-default)',
10739
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
10740
- },
10741
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button .ids-icon':
10742
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-default)' },
10743
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10746
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button': {
10747
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-default)',
10748
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-default)',
10749
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
10750
+ },
10751
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button .ids-icon': {
10752
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-default)',
10753
+ },
10754
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10744
10755
  {
10745
10756
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-active)',
10746
10757
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-active)',
10747
10758
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-active)',
10748
10759
  },
10749
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10760
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10750
10761
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-active)' },
10751
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:hover':
10752
- {
10753
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-hovered)',
10754
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-hovered)',
10755
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-hovered)',
10756
- },
10757
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:hover .ids-icon':
10762
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:hover': {
10763
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-hovered)',
10764
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-hovered)',
10765
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-hovered)',
10766
+ },
10767
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:hover .ids-icon':
10758
10768
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-hovered)' },
10759
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:active':
10760
- {
10761
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-pressed)',
10762
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-pressed)',
10763
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-pressed)',
10764
- },
10765
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:active .ids-icon':
10769
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:active': {
10770
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-pressed)',
10771
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-pressed)',
10772
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-pressed)',
10773
+ },
10774
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:active .ids-icon':
10766
10775
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-pressed)' },
10767
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:focus-visible':
10776
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:focus-visible':
10768
10777
  {
10769
10778
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-focused)',
10770
10779
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-focused)',
10771
10780
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-focused)',
10772
10781
  },
10773
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:focus-visible .ids-icon':
10782
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:focus-visible .ids-icon':
10774
10783
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-focused)' },
10775
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:disabled':
10776
- {
10777
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-disabled)',
10778
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-disabled)',
10779
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-disabled)',
10780
- },
10781
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:disabled .ids-icon':
10784
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:disabled': {
10785
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-disabled)',
10786
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-disabled)',
10787
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-disabled)',
10788
+ },
10789
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:disabled .ids-icon':
10782
10790
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-disabled)' },
10783
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button':
10784
- {
10785
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-default)',
10786
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-default)',
10787
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
10788
- },
10789
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button .ids-icon':
10790
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-default)' },
10791
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10791
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button': {
10792
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-default)',
10793
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-default)',
10794
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
10795
+ },
10796
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button .ids-icon': {
10797
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-default)',
10798
+ },
10799
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10792
10800
  {
10793
10801
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-active)',
10794
10802
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-active)',
10795
10803
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-active)',
10796
10804
  },
10797
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10805
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10798
10806
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-active)' },
10799
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:hover':
10800
- {
10801
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-hovered)',
10802
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-hovered)',
10803
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-hovered)',
10804
- },
10805
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:hover .ids-icon':
10807
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:hover': {
10808
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-hovered)',
10809
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-hovered)',
10810
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-hovered)',
10811
+ },
10812
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:hover .ids-icon':
10806
10813
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-hovered)' },
10807
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:active':
10808
- {
10809
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-pressed)',
10810
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-pressed)',
10811
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-pressed)',
10812
- },
10813
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:active .ids-icon':
10814
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:active': {
10815
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-pressed)',
10816
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-pressed)',
10817
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-pressed)',
10818
+ },
10819
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:active .ids-icon':
10814
10820
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-pressed)' },
10815
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:focus-visible':
10821
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:focus-visible':
10816
10822
  {
10817
10823
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-focused)',
10818
10824
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-focused)',
10819
10825
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-focused)',
10820
10826
  },
10821
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:focus-visible .ids-icon':
10827
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:focus-visible .ids-icon':
10822
10828
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-focused)' },
10823
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:disabled':
10824
- {
10825
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-disabled)',
10826
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-disabled)',
10827
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-disabled)',
10828
- },
10829
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:disabled .ids-icon':
10829
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:disabled': {
10830
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-disabled)',
10831
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-disabled)',
10832
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-disabled)',
10833
+ },
10834
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:disabled .ids-icon':
10830
10835
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-disabled)' },
10831
10836
  '.ids-segmented-control-toggle.ids-segmented-control-toggle-light .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-light .ids-segmented-control-toggle-item>button:focus-visible':
10832
10837
  { outlineColor: 'var(--ids-comp-segmented-control-toggle-focused-outline-color-light-focused)' },
10833
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button':
10834
- {
10835
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-default)',
10836
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-default)',
10837
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
10838
- },
10839
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button .ids-icon':
10840
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-default)' },
10841
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10838
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button': {
10839
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-default)',
10840
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-default)',
10841
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
10842
+ },
10843
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button .ids-icon': {
10844
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-default)',
10845
+ },
10846
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10842
10847
  {
10843
10848
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-active)',
10844
10849
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-active)',
10845
10850
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-active)',
10846
10851
  },
10847
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10852
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10848
10853
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-active)' },
10849
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:hover':
10850
- {
10851
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-hovered)',
10852
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-hovered)',
10853
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-hovered)',
10854
- },
10855
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:hover .ids-icon':
10856
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-hovered)' },
10857
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:active':
10858
- {
10859
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-pressed)',
10860
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-pressed)',
10861
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-pressed)',
10862
- },
10863
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:active .ids-icon':
10854
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:hover': {
10855
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-hovered)',
10856
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-hovered)',
10857
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-hovered)',
10858
+ },
10859
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:hover .ids-icon': {
10860
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-hovered)',
10861
+ },
10862
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:active': {
10863
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-pressed)',
10864
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-pressed)',
10865
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-pressed)',
10866
+ },
10867
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:active .ids-icon':
10864
10868
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-pressed)' },
10865
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:focus-visible':
10869
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:focus-visible':
10866
10870
  {
10867
10871
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-focused)',
10868
10872
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-focused)',
10869
10873
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-focused)',
10870
10874
  },
10871
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:focus-visible .ids-icon':
10875
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:focus-visible .ids-icon':
10872
10876
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-focused)' },
10873
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:disabled':
10874
- {
10875
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-disabled)',
10876
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-disabled)',
10877
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-disabled)',
10878
- },
10879
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:disabled .ids-icon':
10877
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:disabled': {
10878
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-disabled)',
10879
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-disabled)',
10880
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-disabled)',
10881
+ },
10882
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:disabled .ids-icon':
10880
10883
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-disabled)' },
10881
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button':
10882
- {
10883
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-default)',
10884
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-default)',
10885
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
10886
- },
10887
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button .ids-icon':
10888
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-default)' },
10889
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10884
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button': {
10885
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-default)',
10886
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-default)',
10887
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
10888
+ },
10889
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button .ids-icon': {
10890
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-default)',
10891
+ },
10892
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
10890
10893
  {
10891
10894
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-active)',
10892
10895
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-active)',
10893
10896
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-active)',
10894
10897
  },
10895
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10898
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
10896
10899
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-active)' },
10897
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:hover':
10898
- {
10899
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-hovered)',
10900
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-hovered)',
10901
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-hovered)',
10902
- },
10903
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:hover .ids-icon':
10900
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:hover': {
10901
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-hovered)',
10902
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-hovered)',
10903
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-hovered)',
10904
+ },
10905
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:hover .ids-icon':
10904
10906
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-hovered)' },
10905
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:active':
10906
- {
10907
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-pressed)',
10908
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-pressed)',
10909
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-pressed)',
10910
- },
10911
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:active .ids-icon':
10907
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:active': {
10908
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-pressed)',
10909
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-pressed)',
10910
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-pressed)',
10911
+ },
10912
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:active .ids-icon':
10912
10913
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-pressed)' },
10913
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:focus-visible':
10914
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:focus-visible':
10914
10915
  {
10915
10916
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-focused)',
10916
10917
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-focused)',
10917
10918
  borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-focused)',
10918
10919
  },
10919
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:focus-visible .ids-icon':
10920
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:focus-visible .ids-icon':
10920
10921
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-focused)' },
10921
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:disabled':
10922
- {
10923
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-disabled)',
10924
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-disabled)',
10925
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-disabled)',
10926
- },
10927
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:disabled .ids-icon':
10922
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:disabled': {
10923
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-disabled)',
10924
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-disabled)',
10925
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-disabled)',
10926
+ },
10927
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:disabled .ids-icon':
10928
10928
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-disabled)' },
10929
10929
  '.ids-select': {
10930
10930
  boxSizing: 'border-box',