@i-cell/ids-styles 0.0.10 → 0.0.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/components.css +1200 -1
  2. package/dist/components.min.css +1 -1
  3. package/dist/components.plugin.js +962 -1
  4. package/dist/form-elements/form-field/form-field.css +1193 -0
  5. package/dist/form-elements/form-field/form-field.min.css +1 -0
  6. package/dist/form-elements/form-field/form-field.plugin.js +967 -0
  7. package/dist/form-elements/message/message.css +3 -1
  8. package/dist/form-elements/message/message.min.css +1 -1
  9. package/dist/form-elements/message/message.plugin.js +1 -1
  10. package/dist/paginator/paginator.css +3 -0
  11. package/dist/paginator/paginator.min.css +1 -1
  12. package/dist/paginator/paginator.plugin.js +3 -0
  13. package/package.json +4 -4
package/dist/form-elements/form-field/form-field.plugin.js ADDED
@@ -0,0 +1,967 @@
1
+ // Tailwind CSS plugin for the form-field component in the i-Cell Design System
2
+ module.exports = function FormFieldPlugin() {
3
+ return function ({ addComponents }) {
4
+ const cssObj = {
5
+ '.ids-form-field': { display: 'inline-flex', flexDirection: 'column', alignItems: 'flex-start' },
6
+ '.ids-form-field>.ids-form-field__label': { flex: '1 0', overflow: 'hidden', textOverflow: 'ellipsis', fontStyle: 'normal' },
7
+ '.ids-form-field>.ids-form-field__field-wrapper': {
8
+ display: 'flex',
9
+ alignItems: 'center',
10
+ alignSelf: 'stretch',
11
+ flexShrink: 0,
12
+ borderStyle: 'solid',
13
+ boxSizing: 'border-box',
14
+ },
15
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container': {
16
+ display: 'flex',
17
+ alignItems: 'center',
18
+ flex: '1 0 0',
19
+ },
20
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__duffix,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon':
21
+ { display: 'flex', alignItems: 'center' },
22
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix': {
23
+ display: 'flex',
24
+ alignItems: 'center',
25
+ flex: '1 0 0',
26
+ },
27
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
28
+ { appearance: 'none', border: 'none', backgroundColor: 'rgba(0,0,0,0)', flex: '1 0 0', padding: '0' },
29
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input:focus-visible,.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea:focus-visible':
30
+ { outline: 'none' },
31
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea': {
32
+ resize: 'vertical',
33
+ },
34
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action': {
35
+ display: 'flex',
36
+ justifyContent: 'center',
37
+ alignItems: 'center',
38
+ alignSelf: 'stretch',
39
+ borderLeftStyle: 'solid',
40
+ },
41
+ '.ids-form-field>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field>.ids-form-field__field-wrapper:has(textarea:focus)':
42
+ { outlineOffset: '2px', outlineStyle: 'solid' },
43
+ '.ids-form-field.ids-form-field-compact': { gap: 'var(--ids-comp-forms-form-field-standard-size-gap-compact)' },
44
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__label': {
45
+ padding: 'var(--ids-comp-forms-form-field-standard-label-size-padding-y-compact) 0px',
46
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-label-typography-font-family-compact)',
47
+ fontSize: 'var(--ids-comp-forms-form-field-standard-label-typography-font-size-compact)',
48
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-label-typography-font-weight-compact)',
49
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-label-typography-letter-spacing-compact)',
50
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-label-typography-line-height-compact)',
51
+ },
52
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper': {
53
+ padding:
54
+ 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-padding-y-compact) var(--ids-comp-forms-form-field-standard-field-wrapper-size-padding-x-compact)',
55
+ gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-gap-compact)',
56
+ borderRadius: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-border-radius-compact)',
57
+ borderWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-border-width-compact)',
58
+ },
59
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container': {
60
+ minHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-min-height-compact)',
61
+ padding:
62
+ 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-padding-y-compact) var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-padding-x-compact)',
63
+ gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-gap-compact)',
64
+ },
65
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
66
+ {
67
+ height: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-size-height-compact)',
68
+ width: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-size-width-compact)',
69
+ },
70
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
71
+ {
72
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-family-compact)',
73
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-size-compact)',
74
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-weight-compact)',
75
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-letter-spacing-compact)',
76
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-line-height-compact)',
77
+ },
78
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
79
+ { padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-compact) 0' },
80
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
81
+ {
82
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-family-compact)',
83
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-size-compact)',
84
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-weight-compact)',
85
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-letter-spacing-compact)',
86
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-line-height-compact)',
87
+ },
88
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
89
+ {
90
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-compact)',
91
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-compact)',
92
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-weight-compact)',
93
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-letter-spacing-compact)',
94
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-line-height-compact)',
95
+ },
96
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
97
+ {
98
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-family-compact)',
99
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-size-compact)',
100
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-weight-compact)',
101
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-letter-spacing-compact)',
102
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-line-height-compact)',
103
+ },
104
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
105
+ {
106
+ height: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-size-height-compact)',
107
+ width: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-size-width-compact)',
108
+ },
109
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action': {
110
+ padding:
111
+ '0px var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-padding-right-compact) 0px var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-padding-left-compact)',
112
+ borderLeftWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-border-left-compact)',
113
+ },
114
+ '.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-compact>.ids-form-field__field-wrapper:has(textarea:focus)':
115
+ { outlineWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-focused-outline-outline-compact)' },
116
+ '.ids-form-field.ids-form-field-comfortable': { gap: 'var(--ids-comp-forms-form-field-standard-size-gap-comfortable)' },
117
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__label': {
118
+ padding: 'var(--ids-comp-forms-form-field-standard-label-size-padding-y-comfortable) 0px',
119
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-label-typography-font-family-comfortable)',
120
+ fontSize: 'var(--ids-comp-forms-form-field-standard-label-typography-font-size-comfortable)',
121
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-label-typography-font-weight-comfortable)',
122
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-label-typography-letter-spacing-comfortable)',
123
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-label-typography-line-height-comfortable)',
124
+ },
125
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper': {
126
+ padding:
127
+ 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-padding-y-comfortable) var(--ids-comp-forms-form-field-standard-field-wrapper-size-padding-x-comfortable)',
128
+ gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-gap-comfortable)',
129
+ borderRadius: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-border-radius-comfortable)',
130
+ borderWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-border-width-comfortable)',
131
+ },
132
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container': {
133
+ minHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-min-height-comfortable)',
134
+ padding:
135
+ 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-padding-y-comfortable) var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-padding-x-comfortable)',
136
+ gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-gap-comfortable)',
137
+ },
138
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
139
+ {
140
+ height: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-size-height-comfortable)',
141
+ width: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-size-width-comfortable)',
142
+ },
143
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
144
+ {
145
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-family-comfortable)',
146
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-size-comfortable)',
147
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-weight-comfortable)',
148
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-letter-spacing-comfortable)',
149
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-line-height-comfortable)',
150
+ },
151
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
152
+ { padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-comfortable) 0' },
153
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
154
+ {
155
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-family-comfortable)',
156
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-size-comfortable)',
157
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-weight-comfortable)',
158
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-letter-spacing-comfortable)',
159
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-line-height-comfortable)',
160
+ },
161
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
162
+ {
163
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-comfortable)',
164
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-comfortable)',
165
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-weight-comfortable)',
166
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-letter-spacing-comfortable)',
167
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-line-height-comfortable)',
168
+ },
169
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
170
+ {
171
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-family-comfortable)',
172
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-size-comfortable)',
173
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-weight-comfortable)',
174
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-letter-spacing-comfortable)',
175
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-line-height-comfortable)',
176
+ },
177
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
178
+ {
179
+ height: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-size-height-comfortable)',
180
+ width: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-size-width-comfortable)',
181
+ },
182
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action': {
183
+ padding:
184
+ '0px var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-padding-right-comfortable) 0px var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-padding-left-comfortable)',
185
+ borderLeftWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-border-left-comfortable)',
186
+ },
187
+ '.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-comfortable>.ids-form-field__field-wrapper:has(textarea:focus)':
188
+ { outlineWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-focused-outline-outline-comfortable)' },
189
+ '.ids-form-field.ids-form-field-spacious': { gap: 'var(--ids-comp-forms-form-field-standard-size-gap-spacious)' },
190
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__label': {
191
+ padding: 'var(--ids-comp-forms-form-field-standard-label-size-padding-y-spacious) 0px',
192
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-label-typography-font-family-spacious)',
193
+ fontSize: 'var(--ids-comp-forms-form-field-standard-label-typography-font-size-spacious)',
194
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-label-typography-font-weight-spacious)',
195
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-label-typography-letter-spacing-spacious)',
196
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-label-typography-line-height-spacious)',
197
+ },
198
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper': {
199
+ padding:
200
+ 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-padding-y-spacious) var(--ids-comp-forms-form-field-standard-field-wrapper-size-padding-x-spacious)',
201
+ gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-gap-spacious)',
202
+ borderRadius: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-border-radius-spacious)',
203
+ borderWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-border-width-spacious)',
204
+ },
205
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container': {
206
+ minHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-min-height-spacious)',
207
+ padding:
208
+ 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-padding-y-spacious) var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-padding-x-spacious)',
209
+ gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-gap-spacious)',
210
+ },
211
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
212
+ {
213
+ height: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-size-height-spacious)',
214
+ width: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-size-width-spacious)',
215
+ },
216
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
217
+ {
218
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-family-spacious)',
219
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-size-spacious)',
220
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-weight-spacious)',
221
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-letter-spacing-spacious)',
222
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-line-height-spacious)',
223
+ },
224
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
225
+ { padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-spacious) 0' },
226
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
227
+ {
228
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-family-spacious)',
229
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-size-spacious)',
230
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-weight-spacious)',
231
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-letter-spacing-spacious)',
232
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-line-height-spacious)',
233
+ },
234
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
235
+ {
236
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-spacious)',
237
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-spacious)',
238
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-weight-spacious)',
239
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-letter-spacing-spacious)',
240
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-line-height-spacious)',
241
+ },
242
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
243
+ {
244
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-family-spacious)',
245
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-size-spacious)',
246
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-weight-spacious)',
247
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-letter-spacing-spacious)',
248
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-line-height-spacious)',
249
+ },
250
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
251
+ {
252
+ height: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-size-height-spacious)',
253
+ width: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-size-width-spacious)',
254
+ },
255
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action': {
256
+ padding:
257
+ '0px var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-padding-right-spacious) 0px var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-padding-left-spacious)',
258
+ borderLeftWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-border-left-spacious)',
259
+ },
260
+ '.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-spacious>.ids-form-field__field-wrapper:has(textarea:focus)':
261
+ { outlineWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-focused-outline-outline-spacious)' },
262
+ '.ids-form-field.ids-form-field-dense': { gap: 'var(--ids-comp-forms-form-field-standard-size-gap-dense)' },
263
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__label': {
264
+ padding: 'var(--ids-comp-forms-form-field-standard-label-size-padding-y-dense) 0px',
265
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-label-typography-font-family-dense)',
266
+ fontSize: 'var(--ids-comp-forms-form-field-standard-label-typography-font-size-dense)',
267
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-label-typography-font-weight-dense)',
268
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-label-typography-letter-spacing-dense)',
269
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-label-typography-line-height-dense)',
270
+ },
271
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper': {
272
+ padding:
273
+ 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-padding-y-dense) var(--ids-comp-forms-form-field-standard-field-wrapper-size-padding-x-dense)',
274
+ gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-gap-dense)',
275
+ borderRadius: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-border-radius-dense)',
276
+ borderWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-size-border-width-dense)',
277
+ },
278
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container': {
279
+ minHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-min-height-dense)',
280
+ padding:
281
+ 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-padding-y-dense) var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-padding-x-dense)',
282
+ gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-gap-dense)',
283
+ },
284
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
285
+ {
286
+ height: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-size-height-dense)',
287
+ width: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-size-width-dense)',
288
+ },
289
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
290
+ {
291
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-family-dense)',
292
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-size-dense)',
293
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-font-weight-dense)',
294
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-letter-spacing-dense)',
295
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-typography-line-height-dense)',
296
+ },
297
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix':
298
+ { padding: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-size-padding-y-dense) 0' },
299
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
300
+ {
301
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-family-dense)',
302
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-size-dense)',
303
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-font-weight-dense)',
304
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-letter-spacing-dense)',
305
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-filled-line-height-dense)',
306
+ },
307
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
308
+ {
309
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-family-dense)',
310
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-size-dense)',
311
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-font-weight-dense)',
312
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-letter-spacing-dense)',
313
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-typography-empty-line-height-dense)',
314
+ },
315
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
316
+ {
317
+ fontFamily: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-family-dense)',
318
+ fontSize: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-size-dense)',
319
+ fontWeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-font-weight-dense)',
320
+ letterSpacing: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-letter-spacing-dense)',
321
+ lineHeight: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-typography-line-height-dense)',
322
+ },
323
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
324
+ {
325
+ height: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-size-height-dense)',
326
+ width: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-size-width-dense)',
327
+ },
328
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action': {
329
+ padding:
330
+ '0px var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-padding-right-dense) 0px var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-padding-left-dense)',
331
+ borderLeftWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-size-border-left-dense)',
332
+ },
333
+ '.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-dense>.ids-form-field__field-wrapper:has(textarea:focus)':
334
+ { outlineWidth: 'var(--ids-comp-forms-form-field-standard-field-wrapper-focused-outline-outline-dense)' },
335
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper': {
336
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-default)',
337
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-default)',
338
+ },
339
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
340
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-default)' },
341
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
342
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-default)' },
343
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
344
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-default)' },
345
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
346
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-default)' },
347
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
348
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-default)' },
349
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
350
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-default)' },
351
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action':
352
+ {
353
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-default)',
354
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
355
+ },
356
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)':
357
+ {
358
+ outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)',
359
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-focused)',
360
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-focused)',
361
+ },
362
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover': {
363
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-hovered)',
364
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-hovered)',
365
+ },
366
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
367
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-hovered)' },
368
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
369
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-hovered)' },
370
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
371
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-hovered)' },
372
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
373
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-hovered)' },
374
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
375
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-hovered)' },
376
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
377
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-hovered)' },
378
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__action':
379
+ {
380
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-default)',
381
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
382
+ },
383
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover:has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover:has(textarea:focus)':
384
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
385
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
386
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-focused)' },
387
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
388
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-focused)' },
389
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
390
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-focused)' },
391
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
392
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-focused)' },
393
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
394
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-focused)' },
395
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
396
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-focused)' },
397
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__action':
398
+ {
399
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-default)',
400
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
401
+ },
402
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus):has(textarea:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus):has(textarea:focus)':
403
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
404
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)':
405
+ {
406
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-pressed)',
407
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-pressed)',
408
+ },
409
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
410
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-pressed)' },
411
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
412
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-pressed)' },
413
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
414
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-pressed)' },
415
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
416
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-pressed)' },
417
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
418
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-pressed)' },
419
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
420
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-pressed)' },
421
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__action':
422
+ {
423
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-default)',
424
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
425
+ },
426
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active):has(textarea:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active):has(textarea:focus)':
427
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
428
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled)>.ids-form-field__label': {
429
+ color: 'var(--ids-comp-forms-form-field-standard-label-color-fg-surface-default)',
430
+ },
431
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper': {
432
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-error-default)',
433
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-error-default)',
434
+ },
435
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
436
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-default)' },
437
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
438
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-default)' },
439
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
440
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-default)' },
441
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
442
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-default)' },
443
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
444
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-default)' },
445
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
446
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-default)' },
447
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action':
448
+ {
449
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-error-default)',
450
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
451
+ },
452
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)':
453
+ {
454
+ outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)',
455
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-error-focused)',
456
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-error-focused)',
457
+ },
458
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover': {
459
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-error-hovered)',
460
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-error-hovered)',
461
+ },
462
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
463
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-hovered)' },
464
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
465
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-hovered)' },
466
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
467
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-hovered)' },
468
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
469
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-hovered)' },
470
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
471
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-hovered)' },
472
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
473
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-hovered)' },
474
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__action':
475
+ {
476
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-error-default)',
477
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
478
+ },
479
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover:has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover:has(textarea:focus)':
480
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
481
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
482
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-focused)' },
483
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
484
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-focused)' },
485
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
486
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-focused)' },
487
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
488
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-focused)' },
489
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
490
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-focused)' },
491
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
492
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-focused)' },
493
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__action':
494
+ {
495
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-error-default)',
496
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
497
+ },
498
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus):has(textarea:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus):has(textarea:focus)':
499
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
500
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)':
501
+ {
502
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-error-pressed)',
503
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-error-pressed)',
504
+ },
505
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
506
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-pressed)' },
507
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
508
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-pressed)' },
509
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
510
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-pressed)' },
511
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
512
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-pressed)' },
513
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
514
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-pressed)' },
515
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
516
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-pressed)' },
517
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__action':
518
+ {
519
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-error-default)',
520
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
521
+ },
522
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active):has(textarea:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active):has(textarea:focus)':
523
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
524
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__label': {
525
+ color: 'var(--ids-comp-forms-form-field-standard-label-color-fg-surface-error-default)',
526
+ },
527
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper': {
528
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-success-default)',
529
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-success-default)',
530
+ },
531
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
532
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-default)' },
533
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
534
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-default)' },
535
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
536
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-default)' },
537
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
538
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-default)' },
539
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
540
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-default)' },
541
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
542
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-default)' },
543
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action':
544
+ {
545
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-success-default)',
546
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
547
+ },
548
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)':
549
+ {
550
+ outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)',
551
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-success-focused)',
552
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-success-focused)',
553
+ },
554
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover': {
555
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-success-hovered)',
556
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-success-hovered)',
557
+ },
558
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
559
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-hovered)' },
560
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
561
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-hovered)' },
562
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
563
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-hovered)' },
564
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
565
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-hovered)' },
566
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
567
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-hovered)' },
568
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
569
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-hovered)' },
570
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__action':
571
+ {
572
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-success-default)',
573
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
574
+ },
575
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover:has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover:has(textarea:focus)':
576
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
577
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
578
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-focused)' },
579
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
580
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-focused)' },
581
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
582
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-focused)' },
583
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
584
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-focused)' },
585
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
586
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-focused)' },
587
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
588
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-focused)' },
589
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__action':
590
+ {
591
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-success-default)',
592
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
593
+ },
594
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus):has(textarea:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus):has(textarea:focus)':
595
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
596
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)':
597
+ {
598
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-success-pressed)',
599
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-success-pressed)',
600
+ },
601
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
602
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-pressed)' },
603
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
604
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-pressed)' },
605
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
606
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-pressed)' },
607
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
608
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-pressed)' },
609
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
610
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-pressed)' },
611
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
612
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-pressed)' },
613
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__action':
614
+ {
615
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-success-default)',
616
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
617
+ },
618
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active):has(textarea:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active):has(input:focus),.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active):has(textarea:focus)':
619
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
620
+ '.ids-form-field.ids-form-field-surface:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__label': {
621
+ color: 'var(--ids-comp-forms-form-field-standard-label-color-fg-surface-success-default)',
622
+ },
623
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper': {
624
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-surface-disabled)',
625
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-surface-disabled)',
626
+ },
627
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
628
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-surface-disabled)' },
629
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
630
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-surface-disabled)' },
631
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
632
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-surface-disabled)' },
633
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
634
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-surface-disabled)' },
635
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
636
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-surface-disabled)' },
637
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
638
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-surface-disabled)' },
639
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action':
640
+ {
641
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-surface-default)',
642
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-surface-default)',
643
+ },
644
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__field-wrapper:has(textarea:focus)':
645
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-dark-focused)' },
646
+ '.ids-form-field.ids-form-field-surface.ids-form-field-disabled>.ids-form-field__label': {
647
+ color: 'var(--ids-comp-forms-form-field-standard-label-color-fg-surface-disabled)',
648
+ },
649
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper': {
650
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-default)',
651
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-default)',
652
+ },
653
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
654
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-default)' },
655
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
656
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-default)' },
657
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
658
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-default)' },
659
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
660
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-default)' },
661
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
662
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-default)' },
663
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
664
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-default)' },
665
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action':
666
+ {
667
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-default)',
668
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
669
+ },
670
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)':
671
+ {
672
+ outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)',
673
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-focused)',
674
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-focused)',
675
+ },
676
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover': {
677
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-hovered)',
678
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-hovered)',
679
+ },
680
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
681
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-hovered)' },
682
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
683
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-hovered)' },
684
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
685
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-hovered)' },
686
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
687
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-hovered)' },
688
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
689
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-hovered)' },
690
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
691
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-hovered)' },
692
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__action':
693
+ {
694
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-default)',
695
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
696
+ },
697
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover:has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:hover:has(textarea:focus)':
698
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
699
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
700
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-focused)' },
701
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
702
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-focused)' },
703
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
704
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-focused)' },
705
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
706
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-focused)' },
707
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
708
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-focused)' },
709
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
710
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-focused)' },
711
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__action':
712
+ {
713
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-default)',
714
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
715
+ },
716
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:focus):has(textarea:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:focus):has(textarea:focus)':
717
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
718
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)':
719
+ {
720
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-pressed)',
721
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-pressed)',
722
+ },
723
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
724
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-pressed)' },
725
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
726
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-pressed)' },
727
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
728
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-pressed)' },
729
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
730
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-pressed)' },
731
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
732
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-pressed)' },
733
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
734
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-pressed)' },
735
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__action':
736
+ {
737
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-default)',
738
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
739
+ },
740
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(input:active):has(textarea:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__field-wrapper:has(textarea:active):has(textarea:focus)':
741
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
742
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled)>.ids-form-field__label': {
743
+ color: 'var(--ids-comp-forms-form-field-standard-label-color-fg-light-default)',
744
+ },
745
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper': {
746
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-error-default)',
747
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-error-default)',
748
+ },
749
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
750
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-default)' },
751
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
752
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-default)' },
753
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
754
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-default)' },
755
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
756
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-default)' },
757
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
758
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-default)' },
759
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
760
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-default)' },
761
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action':
762
+ {
763
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-error-default)',
764
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
765
+ },
766
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)':
767
+ {
768
+ outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)',
769
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-error-focused)',
770
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-error-focused)',
771
+ },
772
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover': {
773
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-error-hovered)',
774
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-error-hovered)',
775
+ },
776
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
777
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-hovered)' },
778
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
779
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-hovered)' },
780
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
781
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-hovered)' },
782
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
783
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-hovered)' },
784
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
785
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-hovered)' },
786
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
787
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-hovered)' },
788
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__action':
789
+ {
790
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-error-default)',
791
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
792
+ },
793
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover:has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:hover:has(textarea:focus)':
794
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
795
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
796
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-focused)' },
797
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
798
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-focused)' },
799
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
800
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-focused)' },
801
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
802
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-focused)' },
803
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
804
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-focused)' },
805
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
806
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-focused)' },
807
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__action':
808
+ {
809
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-error-default)',
810
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
811
+ },
812
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:focus):has(textarea:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:focus):has(textarea:focus)':
813
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
814
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)':
815
+ {
816
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-error-pressed)',
817
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-error-pressed)',
818
+ },
819
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
820
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-pressed)' },
821
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
822
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-pressed)' },
823
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
824
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-pressed)' },
825
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
826
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-pressed)' },
827
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
828
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-pressed)' },
829
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
830
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-pressed)' },
831
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__action':
832
+ {
833
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-error-default)',
834
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
835
+ },
836
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(input:active):has(textarea:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__field-wrapper:has(textarea:active):has(textarea:focus)':
837
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
838
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-invalid>.ids-form-field__label': {
839
+ color: 'var(--ids-comp-forms-form-field-standard-label-color-fg-light-error-default)',
840
+ },
841
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper': {
842
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-success-default)',
843
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-success-default)',
844
+ },
845
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
846
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-default)' },
847
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
848
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-default)' },
849
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
850
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-default)' },
851
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
852
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-default)' },
853
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
854
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-default)' },
855
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
856
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-default)' },
857
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action':
858
+ {
859
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-success-default)',
860
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
861
+ },
862
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)':
863
+ {
864
+ outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)',
865
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-success-focused)',
866
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-success-focused)',
867
+ },
868
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover': {
869
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-success-hovered)',
870
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-success-hovered)',
871
+ },
872
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
873
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-hovered)' },
874
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
875
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-hovered)' },
876
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
877
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-hovered)' },
878
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
879
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-hovered)' },
880
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
881
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-hovered)' },
882
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
883
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-hovered)' },
884
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover>.ids-form-field__field-wrapper__action':
885
+ {
886
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-success-default)',
887
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
888
+ },
889
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover:has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:hover:has(textarea:focus)':
890
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
891
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
892
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-focused)' },
893
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
894
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-focused)' },
895
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
896
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-focused)' },
897
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
898
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-focused)' },
899
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
900
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-focused)' },
901
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
902
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-focused)' },
903
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus)>.ids-form-field__field-wrapper__action':
904
+ {
905
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-success-default)',
906
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
907
+ },
908
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:focus):has(textarea:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:focus):has(textarea:focus)':
909
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
910
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)':
911
+ {
912
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-success-pressed)',
913
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-success-pressed)',
914
+ },
915
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
916
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-pressed)' },
917
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
918
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-pressed)' },
919
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
920
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-pressed)' },
921
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
922
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-pressed)' },
923
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
924
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-pressed)' },
925
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
926
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-pressed)' },
927
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active)>.ids-form-field__field-wrapper__action,.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active)>.ids-form-field__field-wrapper__action':
928
+ {
929
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-success-default)',
930
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
931
+ },
932
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(input:active):has(textarea:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active):has(input:focus),.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__field-wrapper:has(textarea:active):has(textarea:focus)':
933
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
934
+ '.ids-form-field.ids-form-field-light:not(.ids-form-field-disabled).ids-form-field-valid>.ids-form-field__label': {
935
+ color: 'var(--ids-comp-forms-form-field-standard-label-color-fg-light-success-default)',
936
+ },
937
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper': {
938
+ borderColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-border-light-disabled)',
939
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-bg-light-disabled)',
940
+ },
941
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__leading-icon .ids-icon':
942
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-leading-icon-color-fg-light-disabled)' },
943
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__prefix':
944
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-prefix-color-fg-light-disabled)' },
945
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input,.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea':
946
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-filled-color-fg-text-light-disabled)' },
947
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix input::placeholder,.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix textarea::placeholder':
948
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-infix-empty-color-fg-text-light-disabled)' },
949
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__suffix':
950
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-suffix-color-fg-light-disabled)' },
951
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__trailing-icon .ids-icon':
952
+ { color: 'var(--ids-comp-forms-form-field-standard-field-wrapper-trailing-icon-color-fg-light-disabled)' },
953
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__action':
954
+ {
955
+ borderLeftColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-border-light-default)',
956
+ background: 'var(--ids-comp-forms-form-field-standard-field-wrapper-action-color-bg-light-default)',
957
+ },
958
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper:has(input:focus),.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__field-wrapper:has(textarea:focus)':
959
+ { outlineColor: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-color-focused-outline-color-light-focused)' },
960
+ '.ids-form-field.ids-form-field-light.ids-form-field-disabled>.ids-form-field__label': {
961
+ color: 'var(--ids-comp-forms-form-field-standard-label-color-fg-light-disabled)',
962
+ },
963
+ };
964
+
965
+ addComponents(cssObj);
966
+ };
967
+ };