@i-cell/ids-styles 0.0.7 → 0.0.9

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.
@@ -0,0 +1,757 @@
1
+ // Tailwind CSS plugin for the radio component in the i-Cell Design System
2
+ module.exports = function RadioPlugin() {
3
+ return function ({ addComponents }) {
4
+ const cssObj = {
5
+ '.ids-radio-group': { display: 'inline-flex', alignItems: 'flex-start', justifyContent: 'start' },
6
+ '.ids-radio-group.ids-radio-group-horizontal': { flexDirection: 'row' },
7
+ '.ids-radio-group.ids-radio-group-vertical': { flexDirection: 'column' },
8
+ '.ids-radio-group.ids-radio-group-left': { alignItems: 'flex-end' },
9
+ '.ids-radio-group.ids-radio-group-right': { alignItems: 'flex-start' },
10
+ '.ids-radio-group .ids-radio-item': { display: 'flex', alignItems: 'center' },
11
+ '.ids-radio-group .ids-radio-item.ids-radio-item-left': { flexDirection: 'row-reverse', justifyContent: 'start' },
12
+ '.ids-radio-group .ids-radio-item.ids-radio-item-righ': { flexDirection: 'row', justifyContent: 'start' },
13
+ '.ids-radio-group .ids-radio-item.ids-radio-item-top': { flexDirection: 'column-reverse', alignItems: 'center' },
14
+ '.ids-radio-group .ids-radio-item.ids-radio-item-bottom': { flexDirection: 'column', alignItems: 'center' },
15
+ '.ids-radio-group .ids-radio-item .ids-radio-item__input-wrapper': {
16
+ position: 'relative',
17
+ display: 'flex',
18
+ alignItems: 'center',
19
+ justifyContent: 'center',
20
+ },
21
+ '.ids-radio-group .ids-radio-item .ids-radio-item__input-wrapper .ids-radio-item__touch-target': {
22
+ position: 'absolute',
23
+ cursor: 'pointer',
24
+ },
25
+ '.ids-radio-group .ids-radio-item .ids-radio-item__input-wrapper input[type=radio]': {
26
+ appearance: 'none',
27
+ WebkitAppearance: 'none',
28
+ flexShrink: [0, 0],
29
+ borderStyle: 'solid',
30
+ margin: '0',
31
+ display: 'flex',
32
+ justifyContent: 'center',
33
+ alignItems: 'center',
34
+ cursor: 'pointer',
35
+ },
36
+ '.ids-radio-group .ids-radio-item .ids-radio-item__input-wrapper input[type=radio]+.ids-radio-item__inner-circle': {
37
+ position: 'absolute',
38
+ flexShrink: 0,
39
+ borderStyle: 'solid',
40
+ height: '0',
41
+ width: '0',
42
+ borderWidth: '0',
43
+ cursor: 'pointer',
44
+ },
45
+ '.ids-radio-group .ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:focus,.ids-radio-group .ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:focus-visible':
46
+ { outlineOffset: '2px', outlineStyle: 'solid' },
47
+ '.ids-radio-group .ids-radio-item .ids-radio-item__label': {
48
+ cursor: 'pointer',
49
+ display: 'flex',
50
+ justifyContent: 'center',
51
+ alignItems: 'center',
52
+ flex: '1 0 0',
53
+ fontStyle: 'normal',
54
+ },
55
+ '.ids-radio-group .ids-radio-item.ids-radio-item-disabled .ids-radio-item__input-wrapper .ids-radio-item__touch-target': {
56
+ cursor: 'not-allowed',
57
+ },
58
+ '.ids-radio-group .ids-radio-item.ids-radio-item-disabled .ids-radio-item__input-wrapper input[type=radio]': {
59
+ cursor: 'not-allowed',
60
+ },
61
+ '.ids-radio-group .ids-radio-item.ids-radio-item-disabled .ids-radio-item__input-wrapper input[type=radio]+.ids-radio-item__inner-circle':
62
+ { cursor: 'not-allowed' },
63
+ '.ids-radio-group .ids-radio-item.ids-radio-item-disabled .ids-radio-item__label': { cursor: 'not-allowed' },
64
+ '.ids-radio-group.ids-radio-group-compact.ids-radio-group-horizontal': {
65
+ padding:
66
+ 'var(--ids-comp-radio-group-horizontal-container-size-padding-y-compact) var(--ids-comp-radio-group-horizontal-container-size-padding-x-compact)',
67
+ gap: 'var(--ids-comp-radio-group-horizontal-container-size-gap-compact)',
68
+ },
69
+ '.ids-radio-group.ids-radio-group-compact.ids-radio-group-vertical': {
70
+ padding:
71
+ 'var(--ids-comp-radio-group-vertical-container-size-padding-y-compact) var(--ids-comp-radio-group-vertical-container-size-padding-x-compact)',
72
+ gap: 'var(--ids-comp-radio-group-vertical-container-size-gap-compact)',
73
+ },
74
+ '.ids-radio-group.ids-radio-group-compact>.ids-radio-item': {
75
+ padding:
76
+ 'var(--ids-comp-radio-button-container-size-padding-y-compact) var(--ids-comp-radio-button-container-size-padding-x-compact)',
77
+ gap: 'var(--ids-comp-radio-button-container-size-gap-compact)',
78
+ },
79
+ '.ids-radio-group.ids-radio-group-compact>.ids-radio-item .ids-radio-item__input-wrapper .ids-radio-item__touch-target': {
80
+ top: 'calc((var(--ids-comp-radio-button-input-size-height-compact) - var(--ids-comp-radio-button-input-size-touchtarget-height-compact))/2)',
81
+ left: 'calc((var(--ids-comp-radio-button-input-size-width-compact) - var(--ids-comp-radio-button-input-size-touchtarget-width-compact))/2)',
82
+ height: 'var(--ids-comp-radio-button-input-size-touchtarget-height-compact)',
83
+ width: 'var(--ids-comp-radio-button-input-size-touchtarget-width-compact)',
84
+ },
85
+ '.ids-radio-group.ids-radio-group-compact>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]': {
86
+ width: 'var(--ids-comp-radio-button-input-size-width-compact)',
87
+ height: 'var(--ids-comp-radio-button-input-size-height-compact)',
88
+ borderRadius: 'var(--ids-comp-radio-button-input-size-border-radius-compact)',
89
+ borderWidth: 'var(--ids-comp-radio-button-input-size-border-width-compact)',
90
+ },
91
+ '.ids-radio-group.ids-radio-group-compact>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:checked+.ids-radio-item__inner-circle':
92
+ {
93
+ width: 'var(--ids-comp-radio-button-input-inner-circle-size-width-compact)',
94
+ height: 'var(--ids-comp-radio-button-input-inner-circle-size-height-compact)',
95
+ borderRadius: 'var(--ids-comp-radio-button-input-inner-circle-size-border-radius-compact)',
96
+ borderWidth: 'var(--ids-comp-radio-button-input-inner-circle-size-border-width-compact)',
97
+ },
98
+ '.ids-radio-group.ids-radio-group-compact>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:focus': {
99
+ outlineWidth: 'var(--ids-comp-radio-focused-outline-outline-compact)',
100
+ },
101
+ '.ids-radio-group.ids-radio-group-compact>.ids-radio-item .ids-radio-item__label': {
102
+ padding: 'var(--ids-comp-radio-button-label-size-padding-y-compact) 0px',
103
+ fontFamily: 'var(--ids-comp-radio-button-label-typography-font-family-compact)',
104
+ fontSize: 'var(--ids-comp-radio-button-label-typography-font-size-compact)',
105
+ fontWeight: 'var(--ids-comp-radio-button-label-typography-font-weight-compact)',
106
+ lineHeight: 'var(--ids-comp-radio-button-label-typography-line-height-compact)',
107
+ letterSpacing: 'var(--ids-comp-radio-button-label-typography-letter-spacing-compact)',
108
+ },
109
+ '.ids-radio-group.ids-radio-group-comfortable.ids-radio-group-horizontal': {
110
+ padding:
111
+ 'var(--ids-comp-radio-group-horizontal-container-size-padding-y-comfortable) var(--ids-comp-radio-group-horizontal-container-size-padding-x-comfortable)',
112
+ gap: 'var(--ids-comp-radio-group-horizontal-container-size-gap-comfortable)',
113
+ },
114
+ '.ids-radio-group.ids-radio-group-comfortable.ids-radio-group-vertical': {
115
+ padding:
116
+ 'var(--ids-comp-radio-group-vertical-container-size-padding-y-comfortable) var(--ids-comp-radio-group-vertical-container-size-padding-x-comfortable)',
117
+ gap: 'var(--ids-comp-radio-group-vertical-container-size-gap-comfortable)',
118
+ },
119
+ '.ids-radio-group.ids-radio-group-comfortable>.ids-radio-item': {
120
+ padding:
121
+ 'var(--ids-comp-radio-button-container-size-padding-y-comfortable) var(--ids-comp-radio-button-container-size-padding-x-comfortable)',
122
+ gap: 'var(--ids-comp-radio-button-container-size-gap-comfortable)',
123
+ },
124
+ '.ids-radio-group.ids-radio-group-comfortable>.ids-radio-item .ids-radio-item__input-wrapper .ids-radio-item__touch-target': {
125
+ top: 'calc((var(--ids-comp-radio-button-input-size-height-comfortable) - var(--ids-comp-radio-button-input-size-touchtarget-height-comfortable))/2)',
126
+ left: 'calc((var(--ids-comp-radio-button-input-size-width-comfortable) - var(--ids-comp-radio-button-input-size-touchtarget-width-comfortable))/2)',
127
+ height: 'var(--ids-comp-radio-button-input-size-touchtarget-height-comfortable)',
128
+ width: 'var(--ids-comp-radio-button-input-size-touchtarget-width-comfortable)',
129
+ },
130
+ '.ids-radio-group.ids-radio-group-comfortable>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]': {
131
+ width: 'var(--ids-comp-radio-button-input-size-width-comfortable)',
132
+ height: 'var(--ids-comp-radio-button-input-size-height-comfortable)',
133
+ borderRadius: 'var(--ids-comp-radio-button-input-size-border-radius-comfortable)',
134
+ borderWidth: 'var(--ids-comp-radio-button-input-size-border-width-comfortable)',
135
+ },
136
+ '.ids-radio-group.ids-radio-group-comfortable>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:checked+.ids-radio-item__inner-circle':
137
+ {
138
+ width: 'var(--ids-comp-radio-button-input-inner-circle-size-width-comfortable)',
139
+ height: 'var(--ids-comp-radio-button-input-inner-circle-size-height-comfortable)',
140
+ borderRadius: 'var(--ids-comp-radio-button-input-inner-circle-size-border-radius-comfortable)',
141
+ borderWidth: 'var(--ids-comp-radio-button-input-inner-circle-size-border-width-comfortable)',
142
+ },
143
+ '.ids-radio-group.ids-radio-group-comfortable>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:focus': {
144
+ outlineWidth: 'var(--ids-comp-radio-focused-outline-outline-comfortable)',
145
+ },
146
+ '.ids-radio-group.ids-radio-group-comfortable>.ids-radio-item .ids-radio-item__label': {
147
+ padding: 'var(--ids-comp-radio-button-label-size-padding-y-comfortable) 0px',
148
+ fontFamily: 'var(--ids-comp-radio-button-label-typography-font-family-comfortable)',
149
+ fontSize: 'var(--ids-comp-radio-button-label-typography-font-size-comfortable)',
150
+ fontWeight: 'var(--ids-comp-radio-button-label-typography-font-weight-comfortable)',
151
+ lineHeight: 'var(--ids-comp-radio-button-label-typography-line-height-comfortable)',
152
+ letterSpacing: 'var(--ids-comp-radio-button-label-typography-letter-spacing-comfortable)',
153
+ },
154
+ '.ids-radio-group.ids-radio-group-spacious.ids-radio-group-horizontal': {
155
+ padding:
156
+ 'var(--ids-comp-radio-group-horizontal-container-size-padding-y-spacious) var(--ids-comp-radio-group-horizontal-container-size-padding-x-spacious)',
157
+ gap: 'var(--ids-comp-radio-group-horizontal-container-size-gap-spacious)',
158
+ },
159
+ '.ids-radio-group.ids-radio-group-spacious.ids-radio-group-vertical': {
160
+ padding:
161
+ 'var(--ids-comp-radio-group-vertical-container-size-padding-y-spacious) var(--ids-comp-radio-group-vertical-container-size-padding-x-spacious)',
162
+ gap: 'var(--ids-comp-radio-group-vertical-container-size-gap-spacious)',
163
+ },
164
+ '.ids-radio-group.ids-radio-group-spacious>.ids-radio-item': {
165
+ padding:
166
+ 'var(--ids-comp-radio-button-container-size-padding-y-spacious) var(--ids-comp-radio-button-container-size-padding-x-spacious)',
167
+ gap: 'var(--ids-comp-radio-button-container-size-gap-spacious)',
168
+ },
169
+ '.ids-radio-group.ids-radio-group-spacious>.ids-radio-item .ids-radio-item__input-wrapper .ids-radio-item__touch-target': {
170
+ top: 'calc((var(--ids-comp-radio-button-input-size-height-spacious) - var(--ids-comp-radio-button-input-size-touchtarget-height-spacious))/2)',
171
+ left: 'calc((var(--ids-comp-radio-button-input-size-width-spacious) - var(--ids-comp-radio-button-input-size-touchtarget-width-spacious))/2)',
172
+ height: 'var(--ids-comp-radio-button-input-size-touchtarget-height-spacious)',
173
+ width: 'var(--ids-comp-radio-button-input-size-touchtarget-width-spacious)',
174
+ },
175
+ '.ids-radio-group.ids-radio-group-spacious>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]': {
176
+ width: 'var(--ids-comp-radio-button-input-size-width-spacious)',
177
+ height: 'var(--ids-comp-radio-button-input-size-height-spacious)',
178
+ borderRadius: 'var(--ids-comp-radio-button-input-size-border-radius-spacious)',
179
+ borderWidth: 'var(--ids-comp-radio-button-input-size-border-width-spacious)',
180
+ },
181
+ '.ids-radio-group.ids-radio-group-spacious>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:checked+.ids-radio-item__inner-circle':
182
+ {
183
+ width: 'var(--ids-comp-radio-button-input-inner-circle-size-width-spacious)',
184
+ height: 'var(--ids-comp-radio-button-input-inner-circle-size-height-spacious)',
185
+ borderRadius: 'var(--ids-comp-radio-button-input-inner-circle-size-border-radius-spacious)',
186
+ borderWidth: 'var(--ids-comp-radio-button-input-inner-circle-size-border-width-spacious)',
187
+ },
188
+ '.ids-radio-group.ids-radio-group-spacious>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:focus': {
189
+ outlineWidth: 'var(--ids-comp-radio-focused-outline-outline-spacious)',
190
+ },
191
+ '.ids-radio-group.ids-radio-group-spacious>.ids-radio-item .ids-radio-item__label': {
192
+ padding: 'var(--ids-comp-radio-button-label-size-padding-y-spacious) 0px',
193
+ fontFamily: 'var(--ids-comp-radio-button-label-typography-font-family-spacious)',
194
+ fontSize: 'var(--ids-comp-radio-button-label-typography-font-size-spacious)',
195
+ fontWeight: 'var(--ids-comp-radio-button-label-typography-font-weight-spacious)',
196
+ lineHeight: 'var(--ids-comp-radio-button-label-typography-line-height-spacious)',
197
+ letterSpacing: 'var(--ids-comp-radio-button-label-typography-letter-spacing-spacious)',
198
+ },
199
+ '.ids-radio-group.ids-radio-group-dense.ids-radio-group-horizontal': {
200
+ padding:
201
+ 'var(--ids-comp-radio-group-horizontal-container-size-padding-y-dense) var(--ids-comp-radio-group-horizontal-container-size-padding-x-dense)',
202
+ gap: 'var(--ids-comp-radio-group-horizontal-container-size-gap-dense)',
203
+ },
204
+ '.ids-radio-group.ids-radio-group-dense.ids-radio-group-vertical': {
205
+ padding:
206
+ 'var(--ids-comp-radio-group-vertical-container-size-padding-y-dense) var(--ids-comp-radio-group-vertical-container-size-padding-x-dense)',
207
+ gap: 'var(--ids-comp-radio-group-vertical-container-size-gap-dense)',
208
+ },
209
+ '.ids-radio-group.ids-radio-group-dense>.ids-radio-item': {
210
+ padding: 'var(--ids-comp-radio-button-container-size-padding-y-dense) var(--ids-comp-radio-button-container-size-padding-x-dense)',
211
+ gap: 'var(--ids-comp-radio-button-container-size-gap-dense)',
212
+ },
213
+ '.ids-radio-group.ids-radio-group-dense>.ids-radio-item .ids-radio-item__input-wrapper .ids-radio-item__touch-target': {
214
+ top: 'calc((var(--ids-comp-radio-button-input-size-height-dense) - var(--ids-comp-radio-button-input-size-touchtarget-height-dense))/2)',
215
+ left: 'calc((var(--ids-comp-radio-button-input-size-width-dense) - var(--ids-comp-radio-button-input-size-touchtarget-width-dense))/2)',
216
+ height: 'var(--ids-comp-radio-button-input-size-touchtarget-height-dense)',
217
+ width: 'var(--ids-comp-radio-button-input-size-touchtarget-width-dense)',
218
+ },
219
+ '.ids-radio-group.ids-radio-group-dense>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]': {
220
+ width: 'var(--ids-comp-radio-button-input-size-width-dense)',
221
+ height: 'var(--ids-comp-radio-button-input-size-height-dense)',
222
+ borderRadius: 'var(--ids-comp-radio-button-input-size-border-radius-dense)',
223
+ borderWidth: 'var(--ids-comp-radio-button-input-size-border-width-dense)',
224
+ },
225
+ '.ids-radio-group.ids-radio-group-dense>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:checked+.ids-radio-item__inner-circle':
226
+ {
227
+ width: 'var(--ids-comp-radio-button-input-inner-circle-size-width-dense)',
228
+ height: 'var(--ids-comp-radio-button-input-inner-circle-size-height-dense)',
229
+ borderRadius: 'var(--ids-comp-radio-button-input-inner-circle-size-border-radius-dense)',
230
+ borderWidth: 'var(--ids-comp-radio-button-input-inner-circle-size-border-width-dense)',
231
+ },
232
+ '.ids-radio-group.ids-radio-group-dense>.ids-radio-item .ids-radio-item__input-wrapper input[type=radio]:focus': {
233
+ outlineWidth: 'var(--ids-comp-radio-focused-outline-outline-dense)',
234
+ },
235
+ '.ids-radio-group.ids-radio-group-dense>.ids-radio-item .ids-radio-item__label': {
236
+ padding: 'var(--ids-comp-radio-button-label-size-padding-y-dense) 0px',
237
+ fontFamily: 'var(--ids-comp-radio-button-label-typography-font-family-dense)',
238
+ fontSize: 'var(--ids-comp-radio-button-label-typography-font-size-dense)',
239
+ fontWeight: 'var(--ids-comp-radio-button-label-typography-font-weight-dense)',
240
+ lineHeight: 'var(--ids-comp-radio-button-label-typography-line-height-dense)',
241
+ letterSpacing: 'var(--ids-comp-radio-button-label-typography-letter-spacing-dense)',
242
+ },
243
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
244
+ {
245
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-hovered)',
246
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-hovered)',
247
+ },
248
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled)': {
249
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-default)',
250
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-default)',
251
+ },
252
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover': {
253
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-hovered)',
254
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-hovered)',
255
+ },
256
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active': {
257
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-pressed)',
258
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-pressed)',
259
+ },
260
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible':
261
+ {
262
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-focused)',
263
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-focused)',
264
+ outlineColor: 'var(--ids-comp-radio-input-unselected-color-focused-outline-surface-focused)',
265
+ },
266
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:disabled': {
267
+ borderColor: 'var(--ids-comp-forms-form-field-standard-container-color-border-surface-disabled)',
268
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-disabled)',
269
+ },
270
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)': {
271
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-default)',
272
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-default)',
273
+ },
274
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle':
275
+ {
276
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-default)',
277
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-default)',
278
+ },
279
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover': {
280
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-hovered)',
281
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-hovered)',
282
+ },
283
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle':
284
+ {
285
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-hovered)',
286
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-hovered)',
287
+ },
288
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active': {
289
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-pressed)',
290
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-pressed)',
291
+ },
292
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle':
293
+ {
294
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-pressed)',
295
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-pressed)',
296
+ },
297
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible':
298
+ {
299
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-focused)',
300
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-focused)',
301
+ outlineColor: 'var(--ids-comp-radio-input-selected-color-focused-outline-surface-focused)',
302
+ },
303
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle':
304
+ {
305
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-focused)',
306
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-focused)',
307
+ },
308
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:disabled': {
309
+ borderColor: 'var(--ids-comp-forms-form-field-standard-container-color-border-surface-disabled)',
310
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-disabled)',
311
+ },
312
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:disabled+.ids-radio-item__inner-circle':
313
+ {
314
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-disabled)',
315
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-disabled)',
316
+ },
317
+ '.ids-radio-group .ids-radio-item-surface:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
318
+ {
319
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-hovered)',
320
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-hovered)',
321
+ },
322
+ '.ids-radio-group .ids-radio-item-surface:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle':
323
+ {
324
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-hovered)',
325
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-hovered)',
326
+ },
327
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__label': { color: 'var(--ids-comp-radio-label-color-fg-surface-default)' },
328
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__label:hover': {
329
+ color: 'var(--ids-comp-radio-label-color-fg-surface-hovered)',
330
+ },
331
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__label:active': {
332
+ color: 'var(--ids-comp-radio-label-color-fg-surface-pressed)',
333
+ },
334
+ '.ids-radio-group .ids-radio-item-surface .ids-radio-item__label:focus': {
335
+ color: 'var(--ids-comp-radio-label-color-fg-surface-focused)',
336
+ },
337
+ '.ids-radio-group .ids-radio-item-surface.ids-radio-item-disabled .ids-radio-item__label': {
338
+ color: 'var(--ids-comp-radio-label-color-fg-surface-disabled)',
339
+ },
340
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
341
+ {
342
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-hovered)',
343
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-hovered)',
344
+ },
345
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled)': {
346
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-default)',
347
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-default)',
348
+ },
349
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover': {
350
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-hovered)',
351
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-hovered)',
352
+ },
353
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active': {
354
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-pressed)',
355
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-pressed)',
356
+ },
357
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible':
358
+ {
359
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-focused)',
360
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-focused)',
361
+ outlineColor: 'var(--ids-comp-radio-input-unselected-color-focused-outline-light-focused)',
362
+ },
363
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:disabled': {
364
+ borderColor: 'var(--ids-comp-forms-form-field-standard-container-color-border-light-disabled)',
365
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-disabled)',
366
+ },
367
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)': {
368
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-default)',
369
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-default)',
370
+ },
371
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle':
372
+ {
373
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-default)',
374
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-default)',
375
+ },
376
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover': {
377
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-hovered)',
378
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-hovered)',
379
+ },
380
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle':
381
+ {
382
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-hovered)',
383
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-hovered)',
384
+ },
385
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active': {
386
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-pressed)',
387
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-pressed)',
388
+ },
389
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle':
390
+ {
391
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-pressed)',
392
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-pressed)',
393
+ },
394
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible':
395
+ {
396
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-focused)',
397
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-focused)',
398
+ outlineColor: 'var(--ids-comp-radio-input-selected-color-focused-outline-light-focused)',
399
+ },
400
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle':
401
+ {
402
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-focused)',
403
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-focused)',
404
+ },
405
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:disabled': {
406
+ borderColor: 'var(--ids-comp-forms-form-field-standard-container-color-border-light-disabled)',
407
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-disabled)',
408
+ },
409
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:disabled+.ids-radio-item__inner-circle':
410
+ {
411
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-disabled)',
412
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-disabled)',
413
+ },
414
+ '.ids-radio-group .ids-radio-item-light:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
415
+ {
416
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-hovered)',
417
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-hovered)',
418
+ },
419
+ '.ids-radio-group .ids-radio-item-light:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle':
420
+ {
421
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-hovered)',
422
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-hovered)',
423
+ },
424
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__label': { color: 'var(--ids-comp-radio-label-color-fg-light-default)' },
425
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__label:hover': {
426
+ color: 'var(--ids-comp-radio-label-color-fg-light-hovered)',
427
+ },
428
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__label:active': {
429
+ color: 'var(--ids-comp-radio-label-color-fg-light-pressed)',
430
+ },
431
+ '.ids-radio-group .ids-radio-item-light .ids-radio-item__label:focus': {
432
+ color: 'var(--ids-comp-radio-label-color-fg-light-focused)',
433
+ },
434
+ '.ids-radio-group .ids-radio-item-light.ids-radio-item-disabled .ids-radio-item__label': {
435
+ color: 'var(--ids-comp-radio-label-color-fg-light-disabled)',
436
+ },
437
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
438
+ {
439
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-hovered)',
440
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-hovered)',
441
+ },
442
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled)': {
443
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-default)',
444
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-default)',
445
+ },
446
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover': {
447
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-hovered)',
448
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-hovered)',
449
+ },
450
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active': {
451
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-pressed)',
452
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-pressed)',
453
+ },
454
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible':
455
+ {
456
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-focused)',
457
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-focused)',
458
+ outlineColor: 'var(--ids-comp-radio-input-unselected-color-focused-outline-dark-focused)',
459
+ },
460
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:disabled': {
461
+ borderColor: 'var(--ids-comp-forms-form-field-standard-container-color-border-dark-disabled)',
462
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-disabled)',
463
+ },
464
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)': {
465
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-default)',
466
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-default)',
467
+ },
468
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle':
469
+ {
470
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-default)',
471
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-default)',
472
+ },
473
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover': {
474
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-hovered)',
475
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-hovered)',
476
+ },
477
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle':
478
+ {
479
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-hovered)',
480
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-hovered)',
481
+ },
482
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active': {
483
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-pressed)',
484
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-pressed)',
485
+ },
486
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle':
487
+ {
488
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-pressed)',
489
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-pressed)',
490
+ },
491
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible':
492
+ {
493
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-focused)',
494
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-focused)',
495
+ outlineColor: 'var(--ids-comp-radio-input-selected-color-focused-outline-dark-focused)',
496
+ },
497
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle':
498
+ {
499
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-focused)',
500
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-focused)',
501
+ },
502
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:disabled': {
503
+ borderColor: 'var(--ids-comp-forms-form-field-standard-container-color-border-dark-disabled)',
504
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-disabled)',
505
+ },
506
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:disabled+.ids-radio-item__inner-circle':
507
+ {
508
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-disabled)',
509
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-disabled)',
510
+ },
511
+ '.ids-radio-group .ids-radio-item-dark:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
512
+ {
513
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-hovered)',
514
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-hovered)',
515
+ },
516
+ '.ids-radio-group .ids-radio-item-dark:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle':
517
+ {
518
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-hovered)',
519
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-hovered)',
520
+ },
521
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__label': { color: 'var(--ids-comp-radio-label-color-fg-dark-default)' },
522
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__label:hover': { color: 'var(--ids-comp-radio-label-color-fg-dark-hovered)' },
523
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__label:active': { color: 'var(--ids-comp-radio-label-color-fg-dark-pressed)' },
524
+ '.ids-radio-group .ids-radio-item-dark .ids-radio-item__label:focus': { color: 'var(--ids-comp-radio-label-color-fg-dark-focused)' },
525
+ '.ids-radio-group .ids-radio-item-dark.ids-radio-item-disabled .ids-radio-item__label': {
526
+ color: 'var(--ids-comp-radio-label-color-fg-dark-disabled)',
527
+ },
528
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
529
+ {
530
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-error-hovered)',
531
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-hovered)',
532
+ },
533
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled)':
534
+ {
535
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-error-default)',
536
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-default)',
537
+ },
538
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover':
539
+ {
540
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-error-hovered)',
541
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-hovered)',
542
+ },
543
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active':
544
+ {
545
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-error-pressed)',
546
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-pressed)',
547
+ },
548
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible':
549
+ {
550
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-surface-error-focused)',
551
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-surface-focused)',
552
+ },
553
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)':
554
+ {
555
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-error-default)',
556
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-default)',
557
+ },
558
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle':
559
+ {
560
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-error-default)',
561
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-error-default)',
562
+ },
563
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover':
564
+ {
565
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-error-hovered)',
566
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-hovered)',
567
+ },
568
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle':
569
+ {
570
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-error-hovered)',
571
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-error-hovered)',
572
+ },
573
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active':
574
+ {
575
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-error-pressed)',
576
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-pressed)',
577
+ },
578
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle':
579
+ {
580
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-error-pressed)',
581
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-error-pressed)',
582
+ },
583
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible':
584
+ {
585
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-error-focused)',
586
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-focused)',
587
+ },
588
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group.ng-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle':
589
+ {
590
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-error-focused)',
591
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-error-focused)',
592
+ },
593
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
594
+ {
595
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-surface-error-hovered)',
596
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-surface-hovered)',
597
+ },
598
+ '.ids-radio-group.ng-invalid .ids-radio-item-surface:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-surface:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle':
599
+ {
600
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-surface-error-hovered)',
601
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-surface-error-hovered)',
602
+ },
603
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
604
+ {
605
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-error-hovered)',
606
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-hovered)',
607
+ },
608
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled)':
609
+ {
610
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-error-default)',
611
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-default)',
612
+ },
613
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover':
614
+ {
615
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-error-hovered)',
616
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-hovered)',
617
+ },
618
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active':
619
+ {
620
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-error-pressed)',
621
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-pressed)',
622
+ },
623
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible':
624
+ {
625
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-light-error-focused)',
626
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-light-focused)',
627
+ },
628
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)':
629
+ {
630
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-error-default)',
631
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-default)',
632
+ },
633
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle':
634
+ {
635
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-error-default)',
636
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-error-default)',
637
+ },
638
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover':
639
+ {
640
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-error-hovered)',
641
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-hovered)',
642
+ },
643
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle':
644
+ {
645
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-error-hovered)',
646
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-error-hovered)',
647
+ },
648
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active':
649
+ {
650
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-error-pressed)',
651
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-pressed)',
652
+ },
653
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle':
654
+ {
655
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-error-pressed)',
656
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-error-pressed)',
657
+ },
658
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible':
659
+ {
660
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-error-focused)',
661
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-focused)',
662
+ },
663
+ '.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group.ng-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle':
664
+ {
665
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-error-focused)',
666
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-error-focused)',
667
+ },
668
+ '.ids-radio-group.ng-invalid .ids-radio-item-light:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
669
+ {
670
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-light-error-hovered)',
671
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-light-hovered)',
672
+ },
673
+ '.ids-radio-group.ng-invalid .ids-radio-item-light:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-light:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle':
674
+ {
675
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-light-error-hovered)',
676
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-light-error-hovered)',
677
+ },
678
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
679
+ {
680
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-error-hovered)',
681
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-hovered)',
682
+ },
683
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled)':
684
+ {
685
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-error-default)',
686
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-default)',
687
+ },
688
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):hover':
689
+ {
690
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-error-hovered)',
691
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-hovered)',
692
+ },
693
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):active':
694
+ {
695
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-error-pressed)',
696
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-pressed)',
697
+ },
698
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:not(:disabled):focus-visible':
699
+ {
700
+ borderColor: 'var(--ids-comp-radio-input-unselected-color-border-dark-error-focused)',
701
+ backgroundColor: 'var(--ids-comp-radio-input-unselected-color-bg-dark-focused)',
702
+ },
703
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)':
704
+ {
705
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-error-default)',
706
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-default)',
707
+ },
708
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled)+.ids-radio-item__inner-circle':
709
+ {
710
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-error-default)',
711
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-error-default)',
712
+ },
713
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover':
714
+ {
715
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-error-hovered)',
716
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-hovered)',
717
+ },
718
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):hover+.ids-radio-item__inner-circle':
719
+ {
720
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-error-hovered)',
721
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-error-hovered)',
722
+ },
723
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active':
724
+ {
725
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-error-pressed)',
726
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-pressed)',
727
+ },
728
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):active+.ids-radio-item__inner-circle':
729
+ {
730
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-error-pressed)',
731
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-error-pressed)',
732
+ },
733
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible':
734
+ {
735
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-error-focused)',
736
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-focused)',
737
+ },
738
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group.ng-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark .ids-radio-item__input-wrapper input[type=radio]:checked:not(:disabled):focus-visible+.ids-radio-item__inner-circle':
739
+ {
740
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-error-focused)',
741
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-error-focused)',
742
+ },
743
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled),.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)':
744
+ {
745
+ borderColor: 'var(--ids-comp-radio-input-selected-color-border-dark-error-hovered)',
746
+ backgroundColor: 'var(--ids-comp-radio-input-selected-color-bg-dark-hovered)',
747
+ },
748
+ '.ids-radio-group.ng-invalid .ids-radio-item-dark:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle,.ids-radio-group.ids-radio-group-invalid .ids-radio-item-dark:has(input[type=radio]:checked) .ids-radio-item__input-wrapper .ids-radio-item__touch-target:hover+input[type=radio]:not(:disabled)+.ids-radio-item__inner-circle':
749
+ {
750
+ borderColor: 'var(--ids-comp-radio-input-selected-inner-circle-color-border-dark-error-hovered)',
751
+ background: 'var(--ids-comp-radio-input-selected-inner-circle-color-bg-dark-error-hovered)',
752
+ },
753
+ };
754
+
755
+ addComponents(cssObj);
756
+ };
757
+ };