@i-cell/ids-styles 0.0.69 → 0.0.71

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.
@@ -37,7 +37,11 @@ module.exports = function CheckboxPlugin() {
37
37
  '.ids-checkbox .ids-checkbox__input-wrapper input[type=checkbox]+.ids-checkbox__icon': { position: 'absolute' },
38
38
  '.ids-checkbox .ids-checkbox__input-wrapper input[type=checkbox]+.ids-checkbox__icon>.ids-icon': { color: 'inherit' },
39
39
  '.ids-checkbox .ids-checkbox__label-wrapper': { display: 'flex', flexDirection: 'column', alignItems: 'flex-start', flex: '1 0 0' },
40
- '.ids-checkbox .ids-checkbox__label-wrapper .ids-checkbox__label-container': { textAlign: 'start' },
40
+ '.ids-checkbox .ids-checkbox__label-wrapper .ids-checkbox__label-container': {
41
+ textAlign: 'start',
42
+ display: 'flex',
43
+ flexDirection: 'row',
44
+ },
41
45
  '.ids-checkbox .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label': { fontStyle: 'normal' },
42
46
  '.ids-checkbox .ids-checkbox__label-wrapper .ids-checkbox__message-container': { width: '100%' },
43
47
  '.ids-checkbox.ids-checkbox-compact': {
@@ -80,6 +84,7 @@ module.exports = function CheckboxPlugin() {
80
84
  letterSpacing: 'var(--ids-comp-checkbox-label-typography-letter-spacing-compact)',
81
85
  fontSize: 'var(--ids-comp-checkbox-label-typography-font-size-compact)',
82
86
  lineHeight: 'var(--ids-comp-checkbox-label-typography-line-height-compact)',
87
+ gap: 'var(--ids-comp-checkbox-label-size-gap-compact)',
83
88
  },
84
89
  '.ids-checkbox.ids-checkbox-comfortable': {
85
90
  padding:
@@ -123,6 +128,7 @@ module.exports = function CheckboxPlugin() {
123
128
  letterSpacing: 'var(--ids-comp-checkbox-label-typography-letter-spacing-comfortable)',
124
129
  fontSize: 'var(--ids-comp-checkbox-label-typography-font-size-comfortable)',
125
130
  lineHeight: 'var(--ids-comp-checkbox-label-typography-line-height-comfortable)',
131
+ gap: 'var(--ids-comp-checkbox-label-size-gap-comfortable)',
126
132
  },
127
133
  '.ids-checkbox.ids-checkbox-spacious': {
128
134
  padding: 'var(--ids-comp-checkbox-container-size-padding-y-spacious) var(--ids-comp-checkbox-container-size-padding-x-spacious)',
@@ -165,6 +171,7 @@ module.exports = function CheckboxPlugin() {
165
171
  letterSpacing: 'var(--ids-comp-checkbox-label-typography-letter-spacing-spacious)',
166
172
  fontSize: 'var(--ids-comp-checkbox-label-typography-font-size-spacious)',
167
173
  lineHeight: 'var(--ids-comp-checkbox-label-typography-line-height-spacious)',
174
+ gap: 'var(--ids-comp-checkbox-label-size-gap-spacious)',
168
175
  },
169
176
  '.ids-checkbox.ids-checkbox-dense': {
170
177
  padding: 'var(--ids-comp-checkbox-container-size-padding-y-dense) var(--ids-comp-checkbox-container-size-padding-x-dense)',
@@ -206,89 +213,91 @@ module.exports = function CheckboxPlugin() {
206
213
  letterSpacing: 'var(--ids-comp-checkbox-label-typography-letter-spacing-dense)',
207
214
  fontSize: 'var(--ids-comp-checkbox-label-typography-font-size-dense)',
208
215
  lineHeight: 'var(--ids-comp-checkbox-label-typography-line-height-dense)',
216
+ gap: 'var(--ids-comp-checkbox-label-size-gap-dense)',
209
217
  },
210
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate)':
218
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate):not([aria-readonly=true])':
211
219
  {
212
220
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-hovered)',
213
221
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-hovered)',
214
222
  },
215
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):is(:checked,:indeterminate)':
223
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):is(:checked,:indeterminate):not([aria-readonly=true])':
216
224
  {
217
225
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-hovered)',
218
226
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-hovered)',
219
227
  },
220
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled)+.ids-checkbox__icon': {
221
- color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-hovered)',
222
- },
223
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate)':
228
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
229
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-hovered)' },
230
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true]):not(:checked):not(:indeterminate)':
224
231
  {
225
232
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-pressed)',
226
233
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-pressed)',
227
234
  },
228
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):is(:checked,:indeterminate)':
235
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true]):is(:checked,:indeterminate)':
229
236
  {
230
237
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-pressed)',
231
238
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-pressed)',
232
239
  },
233
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled)+.ids-checkbox__icon':
240
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
234
241
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-pressed)' },
235
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled)': {
242
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true])': {
236
243
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-default)',
237
244
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-default)',
238
245
  },
239
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover': {
246
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover': {
240
247
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-hovered)',
241
248
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-hovered)',
242
249
  },
243
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active': {
244
- borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-pressed)',
245
- backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-pressed)',
246
- },
247
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible':
250
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active':
251
+ {
252
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-pressed)',
253
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-pressed)',
254
+ },
255
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible':
248
256
  {
249
257
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-focused)',
250
258
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-focused)',
251
259
  outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-light-focused)',
252
260
  },
253
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:disabled': {
254
- borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-disabled)',
255
- backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-disabled)',
256
- },
257
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
261
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:disabled,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox][aria-readonly=true]':
262
+ {
263
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-disabled)',
264
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-disabled)',
265
+ },
266
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])':
258
267
  {
259
268
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-default)',
260
269
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-default)',
261
270
  },
262
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
271
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover':
263
272
  {
264
273
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-hovered)',
265
274
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-hovered)',
266
275
  },
267
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
276
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active':
268
277
  {
269
278
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-pressed)',
270
279
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-pressed)',
271
280
  },
272
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible':
281
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible':
273
282
  {
274
283
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-focused)',
275
284
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-focused)',
276
285
  outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-light-focused)',
277
286
  },
278
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled':
287
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked[aria-readonly=true],.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate[aria-readonly=true]':
279
288
  {
280
289
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-disabled)',
281
290
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-disabled)',
282
291
  },
283
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon':
292
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
284
293
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-default)' },
285
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon':
294
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon':
286
295
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-hovered)' },
287
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon':
296
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon':
288
297
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-pressed)' },
289
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon':
298
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon':
290
299
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-focused)' },
291
- '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled+.ids-checkbox__icon':
300
+ '.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked[aria-readonly=true]+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate[aria-readonly=true]+.ids-checkbox__icon':
292
301
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-disabled)' },
293
302
  '.ids-checkbox.ids-checkbox-light .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label': {
294
303
  color: 'var(--ids-comp-checkbox-label-color-fg-light-default)',
@@ -303,88 +312,88 @@ module.exports = function CheckboxPlugin() {
303
312
  { color: 'var(--ids-comp-checkbox-label-color-fg-light-focused)' },
304
313
  '.ids-checkbox.ids-checkbox-light.ids-checkbox-disabled .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label':
305
314
  { color: 'var(--ids-comp-checkbox-label-color-fg-light-disabled)' },
306
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate)':
315
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate):not([aria-readonly=true])':
307
316
  {
308
317
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-hovered)',
309
318
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-hovered)',
310
319
  },
311
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):is(:checked,:indeterminate)':
320
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):is(:checked,:indeterminate):not([aria-readonly=true])':
312
321
  {
313
322
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-hovered)',
314
323
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-hovered)',
315
324
  },
316
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled)+.ids-checkbox__icon': {
317
- color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-hovered)',
318
- },
319
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate)':
325
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
326
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-hovered)' },
327
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true]):not(:checked):not(:indeterminate)':
320
328
  {
321
329
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-pressed)',
322
330
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-pressed)',
323
331
  },
324
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):is(:checked,:indeterminate)':
332
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true]):is(:checked,:indeterminate)':
325
333
  {
326
334
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-pressed)',
327
335
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-pressed)',
328
336
  },
329
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled)+.ids-checkbox__icon':
337
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
330
338
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-pressed)' },
331
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled)': {
339
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true])': {
332
340
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-default)',
333
341
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-default)',
334
342
  },
335
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover': {
343
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover': {
336
344
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-hovered)',
337
345
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-hovered)',
338
346
  },
339
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active': {
347
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active': {
340
348
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-pressed)',
341
349
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-pressed)',
342
350
  },
343
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible':
351
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible':
344
352
  {
345
353
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-focused)',
346
354
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-focused)',
347
355
  outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-dark-focused)',
348
356
  },
349
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:disabled': {
350
- borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-disabled)',
351
- backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-disabled)',
352
- },
353
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
357
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:disabled,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox][aria-readonly=true]':
358
+ {
359
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-disabled)',
360
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-disabled)',
361
+ },
362
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])':
354
363
  {
355
364
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-default)',
356
365
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-default)',
357
366
  },
358
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
367
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover':
359
368
  {
360
369
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-hovered)',
361
370
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-hovered)',
362
371
  },
363
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
372
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active':
364
373
  {
365
374
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-pressed)',
366
375
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-pressed)',
367
376
  },
368
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible':
377
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible':
369
378
  {
370
379
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-focused)',
371
380
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-focused)',
372
381
  outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-dark-focused)',
373
382
  },
374
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled':
383
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked[aria-readonly=true],.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate[aria-readonly=true]':
375
384
  {
376
385
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-disabled)',
377
386
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-disabled)',
378
387
  },
379
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon':
388
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
380
389
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-default)' },
381
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon':
390
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon':
382
391
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-hovered)' },
383
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon':
392
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon':
384
393
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-pressed)' },
385
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon':
394
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon':
386
395
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-focused)' },
387
- '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled+.ids-checkbox__icon':
396
+ '.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked[aria-readonly=true]+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate[aria-readonly=true]+.ids-checkbox__icon':
388
397
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-disabled)' },
389
398
  '.ids-checkbox.ids-checkbox-dark .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label': {
390
399
  color: 'var(--ids-comp-checkbox-label-color-fg-dark-default)',
@@ -399,88 +408,90 @@ module.exports = function CheckboxPlugin() {
399
408
  { color: 'var(--ids-comp-checkbox-label-color-fg-dark-focused)' },
400
409
  '.ids-checkbox.ids-checkbox-dark.ids-checkbox-disabled .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label':
401
410
  { color: 'var(--ids-comp-checkbox-label-color-fg-dark-disabled)' },
402
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate)':
411
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate):not([aria-readonly=true])':
403
412
  {
404
413
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-hovered)',
405
414
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-hovered)',
406
415
  },
407
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):is(:checked,:indeterminate)':
416
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):is(:checked,:indeterminate):not([aria-readonly=true])':
408
417
  {
409
418
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-hovered)',
410
419
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-hovered)',
411
420
  },
412
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled)+.ids-checkbox__icon': {
413
- color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-hovered)',
414
- },
415
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not(:checked):not(:indeterminate)':
421
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:hover input[type=checkbox]:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
422
+ { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-hovered)' },
423
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true]):not(:checked):not(:indeterminate)':
416
424
  {
417
425
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-pressed)',
418
426
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-pressed)',
419
427
  },
420
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):is(:checked,:indeterminate)':
428
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true]):is(:checked,:indeterminate)':
421
429
  {
422
430
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-pressed)',
423
431
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-pressed)',
424
432
  },
425
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled)+.ids-checkbox__icon':
433
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper:has(.ids-checkbox__touch-target:active) input[type=checkbox]:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
426
434
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-pressed)' },
427
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled)': {
435
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true])': {
428
436
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-default)',
429
437
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-default)',
430
438
  },
431
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover': {
432
- borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-hovered)',
433
- backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-hovered)',
434
- },
435
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active': {
436
- borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-pressed)',
437
- backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-pressed)',
438
- },
439
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible':
439
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover':
440
+ {
441
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-hovered)',
442
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-hovered)',
443
+ },
444
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active':
445
+ {
446
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-pressed)',
447
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-pressed)',
448
+ },
449
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible':
440
450
  {
441
451
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-focused)',
442
452
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-focused)',
443
453
  outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-surface-focused)',
444
454
  },
445
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:disabled': {
446
- borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-disabled)',
447
- backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-disabled)',
448
- },
449
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
455
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:disabled,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox][aria-readonly=true]':
456
+ {
457
+ borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-disabled)',
458
+ backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-disabled)',
459
+ },
460
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])':
450
461
  {
451
462
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-default)',
452
463
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-default)',
453
464
  },
454
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
465
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover':
455
466
  {
456
467
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-hovered)',
457
468
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-hovered)',
458
469
  },
459
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
470
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active':
460
471
  {
461
472
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-pressed)',
462
473
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-pressed)',
463
474
  },
464
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible':
475
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible':
465
476
  {
466
477
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-focused)',
467
478
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-focused)',
468
479
  outlineColor: 'var(--ids-comp-checkbox-input-selected-color-focused-outline-surface-focused)',
469
480
  },
470
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled':
481
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked[aria-readonly=true],.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate[aria-readonly=true]':
471
482
  {
472
483
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-disabled)',
473
484
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-disabled)',
474
485
  },
475
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon':
486
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
476
487
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-default)' },
477
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon':
488
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon':
478
489
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-hovered)' },
479
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon':
490
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon':
480
491
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-pressed)' },
481
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon':
492
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon':
482
493
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-focused)' },
483
- '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled+.ids-checkbox__icon':
494
+ '.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked[aria-readonly=true]+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:disabled+.ids-checkbox__icon,.ids-checkbox.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate[aria-readonly=true]+.ids-checkbox__icon':
484
495
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-disabled)' },
485
496
  '.ids-checkbox.ids-checkbox-surface .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label': {
486
497
  color: 'var(--ids-comp-checkbox-label-color-fg-surface-default)',
@@ -495,165 +506,169 @@ module.exports = function CheckboxPlugin() {
495
506
  { color: 'var(--ids-comp-checkbox-label-color-fg-surface-focused)' },
496
507
  '.ids-checkbox.ids-checkbox-surface.ids-checkbox-disabled .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label':
497
508
  { color: 'var(--ids-comp-checkbox-label-color-fg-surface-disabled)' },
509
+ '.ids-checkbox.ids-checkbox-disabled .ids-checkbox__input-wrapper': { cursor: 'not-allowed' },
498
510
  '.ids-checkbox.ids-checkbox-disabled .ids-checkbox__input-wrapper .ids-checkbox__touch-target': { cursor: 'not-allowed' },
499
511
  '.ids-checkbox.ids-checkbox-disabled .ids-checkbox__input-wrapper input[type=checkbox]': { cursor: 'not-allowed' },
500
512
  '.ids-checkbox.ids-checkbox-disabled .ids-checkbox__input-wrapper input[type=checkbox]+.ids-checkbox__icon': {
501
513
  cursor: 'not-allowed',
502
514
  },
515
+ '.ids-checkbox.ids-checkbox-disabled .ids-checkbox__label-wrapper': { cursor: 'not-allowed' },
503
516
  '.ids-checkbox.ids-checkbox-disabled .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label': {
504
517
  cursor: 'not-allowed',
505
518
  },
519
+ '.ids-checkbox:not(.ids-checkbox-disabled) .ids-checkbox__input-wrapper': { cursor: 'pointer' },
506
520
  '.ids-checkbox:not(.ids-checkbox-disabled) .ids-checkbox__input-wrapper .ids-checkbox__touch-target': { cursor: 'pointer' },
507
521
  '.ids-checkbox:not(.ids-checkbox-disabled) .ids-checkbox__input-wrapper input[type=checkbox]': { cursor: 'pointer' },
508
522
  '.ids-checkbox:not(.ids-checkbox-disabled) .ids-checkbox__input-wrapper input[type=checkbox]+.ids-checkbox__icon': {
509
523
  cursor: 'pointer',
510
524
  },
525
+ '.ids-checkbox:not(.ids-checkbox-disabled) .ids-checkbox__label-wrapper': { cursor: 'pointer' },
511
526
  '.ids-checkbox:not(.ids-checkbox-disabled) .ids-checkbox__label-wrapper .ids-checkbox__label-container .ids-checkbox__label': {
512
527
  cursor: 'pointer',
513
528
  },
514
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled)':
529
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true])':
515
530
  {
516
531
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-error-default)',
517
532
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-default)',
518
533
  },
519
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover':
534
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover':
520
535
  {
521
536
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-error-hovered)',
522
537
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-hovered)',
523
538
  },
524
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active':
539
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active':
525
540
  {
526
541
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-error-pressed)',
527
542
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-pressed)',
528
543
  },
529
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible':
544
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible':
530
545
  {
531
546
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-light-error-focused)',
532
547
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-light-focused)',
533
548
  },
534
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
549
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])':
535
550
  {
536
551
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-error-default)',
537
552
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-default)',
538
553
  },
539
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
554
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover':
540
555
  {
541
556
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-error-hovered)',
542
557
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-hovered)',
543
558
  },
544
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
559
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active':
545
560
  {
546
561
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-error-pressed)',
547
562
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-pressed)',
548
563
  },
549
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible':
564
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible':
550
565
  {
551
566
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-light-error-focused)',
552
567
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-light-focused)',
553
568
  },
554
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon':
569
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
555
570
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-error-default)' },
556
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon':
571
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon':
557
572
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-error-hovered)' },
558
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon':
573
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon':
559
574
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-error-pressed)' },
560
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon':
575
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-light .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon':
561
576
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-light-error-focused)' },
562
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled)':
577
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true])':
563
578
  {
564
579
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-error-default)',
565
580
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-default)',
566
581
  },
567
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover':
582
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover':
568
583
  {
569
584
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-error-hovered)',
570
585
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-hovered)',
571
586
  },
572
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active':
587
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active':
573
588
  {
574
589
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-error-pressed)',
575
590
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-pressed)',
576
591
  },
577
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible':
592
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible':
578
593
  {
579
594
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-dark-error-focused)',
580
595
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-dark-focused)',
581
596
  },
582
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
597
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])':
583
598
  {
584
599
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-error-default)',
585
600
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-default)',
586
601
  },
587
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
602
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover':
588
603
  {
589
604
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-error-hovered)',
590
605
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-hovered)',
591
606
  },
592
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
607
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active':
593
608
  {
594
609
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-error-pressed)',
595
610
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-pressed)',
596
611
  },
597
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible':
612
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible':
598
613
  {
599
614
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-dark-error-focused)',
600
615
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-dark-focused)',
601
616
  },
602
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon':
617
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
603
618
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-error-default)' },
604
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon':
619
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon':
605
620
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-error-hovered)' },
606
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon':
621
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon':
607
622
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-error-pressed)' },
608
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon':
623
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-dark .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon':
609
624
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-dark-error-focused)' },
610
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled)':
625
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true])':
611
626
  {
612
627
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-error-default)',
613
628
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-default)',
614
629
  },
615
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):hover':
630
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):hover':
616
631
  {
617
632
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-error-hovered)',
618
633
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-hovered)',
619
634
  },
620
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):active':
635
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):active':
621
636
  {
622
637
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-error-pressed)',
623
638
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-pressed)',
624
639
  },
625
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):focus-visible':
640
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:not(:disabled):not([aria-readonly=true]):focus-visible':
626
641
  {
627
642
  borderColor: 'var(--ids-comp-checkbox-input-unselected-color-border-surface-error-focused)',
628
643
  backgroundColor: 'var(--ids-comp-checkbox-input-unselected-color-bg-surface-focused)',
629
644
  },
630
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)':
645
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]),.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])':
631
646
  {
632
647
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-error-default)',
633
648
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-default)',
634
649
  },
635
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover':
650
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover':
636
651
  {
637
652
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-error-hovered)',
638
653
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-hovered)',
639
654
  },
640
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active':
655
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active':
641
656
  {
642
657
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-error-pressed)',
643
658
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-pressed)',
644
659
  },
645
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible':
660
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible':
646
661
  {
647
662
  borderColor: 'var(--ids-comp-checkbox-input-selected-color-border-surface-error-focused)',
648
663
  backgroundColor: 'var(--ids-comp-checkbox-input-selected-color-bg-surface-focused)',
649
664
  },
650
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled)+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled)+.ids-checkbox__icon':
665
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true])+.ids-checkbox__icon':
651
666
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-default)' },
652
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):hover+.ids-checkbox__icon':
667
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):hover+.ids-checkbox__icon':
653
668
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-hovered)' },
654
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):active+.ids-checkbox__icon':
669
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):active+.ids-checkbox__icon':
655
670
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-pressed)' },
656
- '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):focus-visible+.ids-checkbox__icon':
671
+ '.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ng-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:checked:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus+.ids-checkbox__icon,.ids-checkbox.ng-touched.ids-checkbox-invalid.ids-checkbox-surface .ids-checkbox__input-wrapper input[type=checkbox]:indeterminate:not(:disabled):not([aria-readonly=true]):focus-visible+.ids-checkbox__icon':
657
672
  { color: 'var(--ids-comp-checkbox-input-selected-color-fg-icon-surface-error-focused)' },
658
673
  };
659
674