@i-cell/ids-styles 0.0.24 → 0.0.26

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.
@@ -11,7 +11,12 @@ module.exports = function SegmentedControlTogglePlugin() {
11
11
  textWrap: 'nowrap',
12
12
  },
13
13
  '.ids-segmented-control-toggle .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle .ids-segmented-control-toggle-item>button:focus-visible':
14
- { zIndex: 1, outlineStyle: 'solid', outlineOffset: '2px' },
14
+ {
15
+ zIndex: 1,
16
+ outlineStyle: 'solid',
17
+ outlineOffset: '2px',
18
+ outlineColor: 'var(--ids-comp-segmented-control-toggle-focused-outline-color-light-focused)',
19
+ },
15
20
  '.ids-segmented-control-toggle .ids-segmented-control-toggle-item>button.selected': { pointerEvents: 'none' },
16
21
  '.ids-segmented-control-toggle .ids-segmented-control-toggle-item>button:not(:disabled)': { cursor: 'pointer' },
17
22
  '.ids-segmented-control-toggle .ids-segmented-control-toggle-item>button:disabled': { cursor: 'not-allowed' },
@@ -135,422 +140,289 @@ module.exports = function SegmentedControlTogglePlugin() {
135
140
  fontWeight: 'var(--ids-comp-segmented-control-toggle-button-icon-typography-font-weight-dense)',
136
141
  lineHeight: 'var(--ids-comp-segmented-control-toggle-button-icon-typography-line-height-dense)',
137
142
  },
138
- '.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':
139
- { outlineColor: 'var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused)' },
140
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled': {
141
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-filled-color-bg-primary-default)',
143
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled': {
144
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-filled-color-bg-surface-default)',
142
145
  },
143
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button':
144
- {
145
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-default)',
146
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-default)',
147
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
148
- },
149
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button .ids-icon':
150
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-default)' },
151
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
146
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined': {
147
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-surface-default)',
148
+ },
149
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled': {
150
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-filled-color-bg-light-default)',
151
+ },
152
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined': {
153
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-light-default)',
154
+ },
155
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button': {
156
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-default)',
157
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-default)',
158
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
159
+ },
160
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button .ids-icon': {
161
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-default)',
162
+ },
163
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
152
164
  {
153
165
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-active)',
154
166
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-active)',
155
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
167
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-active)',
156
168
  },
157
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
169
+ '.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':
158
170
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-active)' },
159
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:hover':
160
- {
161
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-hovered)',
162
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-hovered)',
163
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
164
- },
165
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:hover .ids-icon':
171
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:hover': {
172
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-hovered)',
173
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-hovered)',
174
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-hovered)',
175
+ },
176
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:hover .ids-icon':
166
177
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-hovered)' },
167
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:active':
168
- {
169
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-pressed)',
170
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-pressed)',
171
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
172
- },
173
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:active .ids-icon':
178
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:active': {
179
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-pressed)',
180
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-pressed)',
181
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-pressed)',
182
+ },
183
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:active .ids-icon':
174
184
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-pressed)' },
175
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus-visible':
185
+ '.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':
176
186
  {
177
187
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-focused)',
178
188
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-focused)',
179
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
189
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-focused)',
180
190
  },
181
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus-visible .ids-icon':
191
+ '.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':
182
192
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-focused)' },
183
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:disabled':
184
- {
185
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-disabled)',
186
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-disabled)',
187
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-default)',
188
- },
189
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:disabled .ids-icon':
193
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:disabled': {
194
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-primary-disabled)',
195
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-primary-disabled)',
196
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-primary-disabled)',
197
+ },
198
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-primary>button:disabled .ids-icon':
190
199
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-primary-disabled)' },
191
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined': {
192
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-primary-default)',
200
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button': {
201
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-default)',
202
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-default)',
203
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
193
204
  },
194
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button':
195
- {
196
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-default)',
197
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-default)',
198
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
199
- },
200
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button .ids-icon':
201
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-default)' },
202
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
205
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button .ids-icon': {
206
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-default)',
207
+ },
208
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
203
209
  {
204
210
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-active)',
205
211
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-active)',
206
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
212
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-active)',
207
213
  },
208
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
214
+ '.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':
209
215
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-active)' },
210
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:hover':
211
- {
212
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-hovered)',
213
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-hovered)',
214
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
215
- },
216
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:hover .ids-icon':
216
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:hover': {
217
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-hovered)',
218
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-hovered)',
219
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-hovered)',
220
+ },
221
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:hover .ids-icon':
217
222
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-hovered)' },
218
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:active':
219
- {
220
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-pressed)',
221
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-pressed)',
222
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
223
- },
224
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:active .ids-icon':
223
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:active': {
224
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-pressed)',
225
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-pressed)',
226
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-pressed)',
227
+ },
228
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:active .ids-icon':
225
229
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-pressed)' },
226
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus-visible':
230
+ '.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':
227
231
  {
228
232
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-focused)',
229
233
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-focused)',
230
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
234
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-focused)',
231
235
  },
232
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus-visible .ids-icon':
236
+ '.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':
233
237
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-focused)' },
234
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled':
235
- {
236
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-disabled)',
237
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-disabled)',
238
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-default)',
239
- },
240
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-primary.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled .ids-icon':
238
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:disabled': {
239
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-primary-disabled)',
240
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-primary-disabled)',
241
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-primary-disabled)',
242
+ },
243
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-primary>button:disabled .ids-icon':
241
244
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-primary-disabled)' },
242
- '.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':
243
- { outlineColor: 'var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused)' },
244
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled': {
245
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-filled-color-bg-surface-default)',
245
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button': {
246
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-default)',
247
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-default)',
248
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
246
249
  },
247
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button':
248
- {
249
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-default)',
250
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-default)',
251
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
252
- },
253
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button .ids-icon':
254
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-default)' },
255
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
250
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button .ids-icon': {
251
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-default)',
252
+ },
253
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
256
254
  {
257
255
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-active)',
258
256
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-active)',
259
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
257
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-active)',
260
258
  },
261
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
259
+ '.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':
262
260
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-active)' },
263
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:hover':
264
- {
265
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-hovered)',
266
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-hovered)',
267
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
268
- },
269
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:hover .ids-icon':
261
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:hover': {
262
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-hovered)',
263
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-hovered)',
264
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-hovered)',
265
+ },
266
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:hover .ids-icon':
270
267
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-hovered)' },
271
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:active':
272
- {
273
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-pressed)',
274
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-pressed)',
275
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
276
- },
277
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:active .ids-icon':
268
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:active': {
269
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-pressed)',
270
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-pressed)',
271
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-pressed)',
272
+ },
273
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:active .ids-icon':
278
274
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-pressed)' },
279
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus-visible':
275
+ '.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':
280
276
  {
281
277
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-focused)',
282
278
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-focused)',
283
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
279
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-focused)',
284
280
  },
285
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus-visible .ids-icon':
281
+ '.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':
286
282
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-focused)' },
287
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:disabled':
288
- {
289
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-disabled)',
290
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-disabled)',
291
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-default)',
292
- },
293
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:disabled .ids-icon':
283
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:disabled': {
284
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-surface-disabled)',
285
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-surface-disabled)',
286
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-surface-disabled)',
287
+ },
288
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-surface>button:disabled .ids-icon':
294
289
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-surface-disabled)' },
295
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined': {
296
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-surface-default)',
290
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button': {
291
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-default)',
292
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-default)',
293
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
297
294
  },
298
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button':
299
- {
300
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-default)',
301
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-default)',
302
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
303
- },
304
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button .ids-icon':
305
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-default)' },
306
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
295
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button .ids-icon': {
296
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-default)',
297
+ },
298
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
307
299
  {
308
300
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-active)',
309
301
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-active)',
310
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
302
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-active)',
311
303
  },
312
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
304
+ '.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':
313
305
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-active)' },
314
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:hover':
315
- {
316
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-hovered)',
317
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-hovered)',
318
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
319
- },
320
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:hover .ids-icon':
306
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:hover': {
307
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-hovered)',
308
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-hovered)',
309
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-hovered)',
310
+ },
311
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:hover .ids-icon':
321
312
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-hovered)' },
322
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:active':
323
- {
324
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-pressed)',
325
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-pressed)',
326
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
327
- },
328
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:active .ids-icon':
313
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:active': {
314
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-pressed)',
315
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-pressed)',
316
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-pressed)',
317
+ },
318
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:active .ids-icon':
329
319
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-pressed)' },
330
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus-visible':
320
+ '.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':
331
321
  {
332
322
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-focused)',
333
323
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-focused)',
334
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
324
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-focused)',
335
325
  },
336
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus-visible .ids-icon':
326
+ '.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':
337
327
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-focused)' },
338
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled':
339
- {
340
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-disabled)',
341
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-disabled)',
342
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-default)',
343
- },
344
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-surface.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled .ids-icon':
328
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:disabled': {
329
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-surface-disabled)',
330
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-surface-disabled)',
331
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-surface-disabled)',
332
+ },
333
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-surface>button:disabled .ids-icon':
345
334
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-surface-disabled)' },
346
- '.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':
347
- { outlineColor: 'var(--ids-comp-segmented-control-toggle-focused-outline-color-light-focused)' },
348
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled': {
349
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-filled-color-bg-light-default)',
335
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button': {
336
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-default)',
337
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-default)',
338
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
350
339
  },
351
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button':
352
- {
353
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-default)',
354
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-default)',
355
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
356
- },
357
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button .ids-icon':
358
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-default)' },
359
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
340
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button .ids-icon': {
341
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-default)',
342
+ },
343
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
360
344
  {
361
345
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-active)',
362
346
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-active)',
363
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
347
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-active)',
364
348
  },
365
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
349
+ '.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':
366
350
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-active)' },
367
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:hover':
368
- {
369
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-hovered)',
370
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-hovered)',
371
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
372
- },
373
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:hover .ids-icon':
374
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-hovered)' },
375
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:active':
376
- {
377
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-pressed)',
378
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-pressed)',
379
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
380
- },
381
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:active .ids-icon':
351
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:hover': {
352
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-hovered)',
353
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-hovered)',
354
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-hovered)',
355
+ },
356
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:hover .ids-icon': {
357
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-hovered)',
358
+ },
359
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:active': {
360
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-pressed)',
361
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-pressed)',
362
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-pressed)',
363
+ },
364
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:active .ids-icon':
382
365
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-pressed)' },
383
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus-visible':
366
+ '.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':
384
367
  {
385
368
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-focused)',
386
369
  color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-focused)',
387
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
370
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-focused)',
388
371
  },
389
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus-visible .ids-icon':
372
+ '.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':
390
373
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-focused)' },
391
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:disabled':
392
- {
393
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-disabled)',
394
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-disabled)',
395
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-default)',
396
- },
397
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:disabled .ids-icon':
374
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:disabled': {
375
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-light-disabled)',
376
+ color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-light-disabled)',
377
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-light-disabled)',
378
+ },
379
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item-light>button:disabled .ids-icon':
398
380
  { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-light-disabled)' },
399
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined': {
400
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-light-default)',
381
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button': {
382
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-default)',
383
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-default)',
384
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
401
385
  },
402
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button':
403
- {
404
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-default)',
405
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-default)',
406
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
407
- },
408
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button .ids-icon':
409
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-default)' },
410
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
386
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button .ids-icon': {
387
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-default)',
388
+ },
389
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
411
390
  {
412
391
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-active)',
413
392
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-active)',
414
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
393
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-active)',
415
394
  },
416
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
395
+ '.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':
417
396
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-active)' },
418
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:hover':
419
- {
420
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-hovered)',
421
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-hovered)',
422
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
423
- },
424
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:hover .ids-icon':
397
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:hover': {
398
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-hovered)',
399
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-hovered)',
400
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-hovered)',
401
+ },
402
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:hover .ids-icon':
425
403
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-hovered)' },
426
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:active':
427
- {
428
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-pressed)',
429
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-pressed)',
430
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
431
- },
432
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:active .ids-icon':
404
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:active': {
405
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-pressed)',
406
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-pressed)',
407
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-pressed)',
408
+ },
409
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:active .ids-icon':
433
410
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-pressed)' },
434
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus-visible':
411
+ '.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':
435
412
  {
436
413
  backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-focused)',
437
414
  color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-focused)',
438
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
415
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-focused)',
439
416
  },
440
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus-visible .ids-icon':
417
+ '.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':
441
418
  { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-focused)' },
442
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled':
443
- {
444
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-disabled)',
445
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-disabled)',
446
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-default)',
447
- },
448
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-light.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled .ids-icon':
449
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-disabled)' },
450
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-dark .ids-segmented-control-toggle-item>button:focus-visible':
451
- { outlineColor: 'var(--ids-comp-segmented-control-toggle-focused-outline-color-dark-focused)' },
452
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled': {
453
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-filled-color-bg-dark-default)',
454
- },
455
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button':
456
- {
457
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-default)',
458
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-default)',
459
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default)',
460
- },
461
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button .ids-icon':
462
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-default)' },
463
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
464
- {
465
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-active)',
466
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-active)',
467
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default)',
468
- },
469
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
470
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-active)' },
471
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:hover':
472
- {
473
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-hovered)',
474
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-hovered)',
475
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default)',
476
- },
477
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:hover .ids-icon':
478
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-hovered)' },
479
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:active':
480
- {
481
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-pressed)',
482
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-pressed)',
483
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default)',
484
- },
485
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:active .ids-icon':
486
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-pressed)' },
487
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus-visible':
488
- {
489
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-focused)',
490
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-focused)',
491
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default)',
492
- },
493
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:focus-visible .ids-icon':
494
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-focused)' },
495
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:disabled':
496
- {
497
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-bg-dark-disabled)',
498
- color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-label-dark-disabled)',
499
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-filled-color-border-dark-default)',
500
- },
501
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-filled .ids-segmented-control-toggle-item>button:disabled .ids-icon':
502
- { color: 'var(--ids-comp-segmented-control-toggle-button-filled-color-fg-icon-dark-disabled)' },
503
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined': {
504
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-container-outlined-color-bg-dark-default)',
419
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:disabled': {
420
+ backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-light-disabled)',
421
+ color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-light-disabled)',
422
+ borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-light-disabled)',
505
423
  },
506
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button':
507
- {
508
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-default)',
509
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-default)',
510
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default)',
511
- },
512
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button .ids-icon':
513
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-default)' },
514
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled)':
515
- {
516
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-active)',
517
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-active)',
518
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default)',
519
- },
520
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button.ids-segmented-control-toggle-item-selected:not(:disabled) .ids-icon':
521
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-active)' },
522
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:hover':
523
- {
524
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-hovered)',
525
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-hovered)',
526
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default)',
527
- },
528
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:hover .ids-icon':
529
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-hovered)' },
530
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:active':
531
- {
532
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-pressed)',
533
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-pressed)',
534
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default)',
535
- },
536
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:active .ids-icon':
537
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-pressed)' },
538
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus,.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus-visible':
539
- {
540
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-focused)',
541
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-focused)',
542
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default)',
543
- },
544
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus .ids-icon,.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:focus-visible .ids-icon':
545
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-focused)' },
546
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled':
547
- {
548
- backgroundColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-bg-dark-disabled)',
549
- color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-label-dark-disabled)',
550
- borderColor: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-border-dark-default)',
551
- },
552
- '.ids-segmented-control-toggle.ids-segmented-control-toggle-dark.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item>button:disabled .ids-icon':
553
- { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-dark-disabled)' },
424
+ '.ids-segmented-control-toggle.ids-segmented-control-toggle-outlined .ids-segmented-control-toggle-item-light>button:disabled .ids-icon':
425
+ { color: 'var(--ids-comp-segmented-control-toggle-button-outlined-color-fg-icon-light-disabled)' },
554
426
  };
555
427
 
556
428
  addComponents(cssObj);