@i-cell/ids-styles 0.0.2 → 0.0.3

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 (43) hide show
  1. package/dist/accordion/accordion.css +69 -68
  2. package/dist/accordion/accordion.min.css +1 -1
  3. package/dist/accordion/accordion.plugin.js +69 -73
  4. package/dist/action-item/action-item.css +67 -55
  5. package/dist/action-item/action-item.min.css +1 -1
  6. package/dist/action-item/action-item.plugin.js +67 -73
  7. package/dist/action-panel/action-panel.css +29 -28
  8. package/dist/action-panel/action-panel.min.css +1 -1
  9. package/dist/action-panel/action-panel.plugin.js +35 -39
  10. package/dist/avatar/avatar.css +77 -154
  11. package/dist/avatar/avatar.min.css +1 -1
  12. package/dist/avatar/avatar.plugin.js +77 -148
  13. package/dist/button/button.css +134 -178
  14. package/dist/button/button.min.css +1 -1
  15. package/dist/button/button.plugin.js +141 -179
  16. package/dist/card/card.css +137 -184
  17. package/dist/card/card.min.css +1 -1
  18. package/dist/card/card.plugin.js +137 -189
  19. package/dist/checkbox/checkbox.css +554 -0
  20. package/dist/checkbox/checkbox.min.css +1 -0
  21. package/dist/checkbox/checkbox.plugin.js +539 -0
  22. package/dist/components.css +1566 -1326
  23. package/dist/components.min.css +1 -1
  24. package/dist/components.plugin.js +1511 -1374
  25. package/dist/dialog/dialog.css +99 -95
  26. package/dist/dialog/dialog.min.css +1 -1
  27. package/dist/dialog/dialog.plugin.js +103 -102
  28. package/dist/divider/divider.css +21 -23
  29. package/dist/divider/divider.min.css +1 -1
  30. package/dist/divider/divider.plugin.js +22 -30
  31. package/dist/form-elements/message/message.css +165 -0
  32. package/dist/form-elements/message/message.min.css +1 -0
  33. package/dist/form-elements/message/message.plugin.js +116 -0
  34. package/dist/form-elements/required-marker/required-marker.css +6 -0
  35. package/dist/form-elements/required-marker/required-marker.min.css +1 -0
  36. package/dist/form-elements/required-marker/required-marker.plugin.js +15 -0
  37. package/dist/icon-button/icon-button.css +101 -124
  38. package/dist/icon-button/icon-button.min.css +1 -1
  39. package/dist/icon-button/icon-button.plugin.js +108 -125
  40. package/dist/tag/tag.css +104 -417
  41. package/dist/tag/tag.min.css +1 -1
  42. package/dist/tag/tag.plugin.js +111 -418
  43. package/package.json +6 -4
package/dist/icon-button/icon-button.css CHANGED
@@ -4,6 +4,7 @@
4
4
  flex-shrink: 0;
5
5
  align-items: center;
6
6
  justify-content: center;
7
+ border-style: solid;
7
8
  }
8
9
  .ids-icon-button:focus {
9
10
  outline-offset: 2px;
@@ -16,53 +17,53 @@
16
17
  outline: none;
17
18
  }
18
19
  .ids-icon-button.ids-icon-button-compact {
19
- padding: var(--ids-comp-size-icon-button-size-padding-y-compact) var(--ids-comp-size-icon-button-size-padding-x-compact);
20
- width: var(--ids-comp-size-icon-button-size-width-compact);
21
- height: var(--ids-comp-size-icon-button-size-height-compact);
22
- border-radius: var(--ids-comp-size-icon-button-size-border-radius-compact);
23
- border: var(--ids-comp-size-icon-button-size-border-compact) solid;
20
+ padding: var(--ids-comp-icon-button-size-padding-y-compact) var(--ids-comp-icon-button-size-padding-x-compact);
21
+ width: var(--ids-comp-icon-button-size-width-compact);
22
+ height: var(--ids-comp-icon-button-size-height-compact);
23
+ border-radius: var(--ids-comp-icon-button-size-border-radius-compact);
24
+ border-width: var(--ids-comp-icon-button-size-border-compact);
24
25
  }
25
26
  .ids-icon-button.ids-icon-button-compact *[icon] {
26
- width: var(--ids-comp-size-icon-button-size-icon-compact);
27
- height: var(--ids-comp-size-icon-button-size-icon-compact);
27
+ width: var(--ids-comp-icon-button-size-icon-compact);
28
+ height: var(--ids-comp-icon-button-size-icon-compact);
28
29
  }
29
30
  .ids-icon-button.ids-icon-button-comfortable {
30
- padding: var(--ids-comp-size-icon-button-size-padding-y-comfortable) var(--ids-comp-size-icon-button-size-padding-x-comfortable);
31
- width: var(--ids-comp-size-icon-button-size-width-comfortable);
32
- height: var(--ids-comp-size-icon-button-size-height-comfortable);
33
- border-radius: var(--ids-comp-size-icon-button-size-border-radius-comfortable);
34
- border: var(--ids-comp-size-icon-button-size-border-comfortable) solid;
31
+ padding: var(--ids-comp-icon-button-size-padding-y-comfortable) var(--ids-comp-icon-button-size-padding-x-comfortable);
32
+ width: var(--ids-comp-icon-button-size-width-comfortable);
33
+ height: var(--ids-comp-icon-button-size-height-comfortable);
34
+ border-radius: var(--ids-comp-icon-button-size-border-radius-comfortable);
35
+ border-width: var(--ids-comp-icon-button-size-border-comfortable);
35
36
  }
36
37
  .ids-icon-button.ids-icon-button-comfortable *[icon] {
37
- width: var(--ids-comp-size-icon-button-size-icon-comfortable);
38
- height: var(--ids-comp-size-icon-button-size-icon-comfortable);
38
+ width: var(--ids-comp-icon-button-size-icon-comfortable);
39
+ height: var(--ids-comp-icon-button-size-icon-comfortable);
39
40
  }
40
41
  .ids-icon-button.ids-icon-button-spacious {
41
- padding: var(--ids-comp-size-icon-button-size-padding-y-spacious) var(--ids-comp-size-icon-button-size-padding-x-spacious);
42
- width: var(--ids-comp-size-icon-button-size-width-spacious);
43
- height: var(--ids-comp-size-icon-button-size-height-spacious);
44
- border-radius: var(--ids-comp-size-icon-button-size-border-radius-spacious);
45
- border: var(--ids-comp-size-icon-button-size-border-spacious) solid;
42
+ padding: var(--ids-comp-icon-button-size-padding-y-spacious) var(--ids-comp-icon-button-size-padding-x-spacious);
43
+ width: var(--ids-comp-icon-button-size-width-spacious);
44
+ height: var(--ids-comp-icon-button-size-height-spacious);
45
+ border-radius: var(--ids-comp-icon-button-size-border-radius-spacious);
46
+ border-width: var(--ids-comp-icon-button-size-border-spacious);
46
47
  }
47
48
  .ids-icon-button.ids-icon-button-spacious *[icon] {
48
- width: var(--ids-comp-size-icon-button-size-icon-spacious);
49
- height: var(--ids-comp-size-icon-button-size-icon-spacious);
49
+ width: var(--ids-comp-icon-button-size-icon-spacious);
50
+ height: var(--ids-comp-icon-button-size-icon-spacious);
50
51
  }
51
52
  .ids-icon-button.ids-icon-button-dense {
52
- padding: var(--ids-comp-size-icon-button-size-padding-y-dense) var(--ids-comp-size-icon-button-size-padding-x-dense);
53
- width: var(--ids-comp-size-icon-button-size-width-dense);
54
- height: var(--ids-comp-size-icon-button-size-height-dense);
55
- border-radius: var(--ids-comp-size-icon-button-size-border-radius-dense);
56
- border: var(--ids-comp-size-icon-button-size-border-dense) solid;
53
+ padding: var(--ids-comp-icon-button-size-padding-y-dense) var(--ids-comp-icon-button-size-padding-x-dense);
54
+ width: var(--ids-comp-icon-button-size-width-dense);
55
+ height: var(--ids-comp-icon-button-size-height-dense);
56
+ border-radius: var(--ids-comp-icon-button-size-border-radius-dense);
57
+ border-width: var(--ids-comp-icon-button-size-border-dense);
57
58
  }
58
59
  .ids-icon-button.ids-icon-button-dense *[icon] {
59
- width: var(--ids-comp-size-icon-button-size-icon-dense);
60
- height: var(--ids-comp-size-icon-button-size-icon-dense);
60
+ width: var(--ids-comp-icon-button-size-icon-dense);
61
+ height: var(--ids-comp-icon-button-size-icon-dense);
61
62
  }
62
63
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-primary {
63
- color: var(--ids-comp-icon-button-filled-color-fg-primary-enabled);
64
- background: var(--ids-comp-icon-button-filled-color-bg-primary-enabled);
65
- border-color: var(--ids-comp-icon-button-filled-color-border-primary-enabled);
64
+ color: var(--ids-comp-icon-button-filled-color-fg-primary-default);
65
+ background: var(--ids-comp-icon-button-filled-color-bg-primary-default);
66
+ border-color: var(--ids-comp-icon-button-filled-color-border-primary-default);
66
67
  }
67
68
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:hover {
68
69
  background: var(--ids-comp-icon-button-filled-color-bg-primary-hovered);
@@ -84,9 +85,9 @@
84
85
  border-color: var(--ids-comp-icon-button-filled-color-border-primary-disabled);
85
86
  }
86
87
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary {
87
- color: var(--ids-comp-icon-button-filled-color-fg-secondary-enabled);
88
- background: var(--ids-comp-icon-button-filled-color-bg-secondary-enabled);
89
- border-color: var(--ids-comp-icon-button-filled-color-border-secondary-enabled);
88
+ color: var(--ids-comp-icon-button-filled-color-fg-secondary-default);
89
+ background: var(--ids-comp-icon-button-filled-color-bg-secondary-default);
90
+ border-color: var(--ids-comp-icon-button-filled-color-border-secondary-default);
90
91
  }
91
92
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:hover {
92
93
  background: var(--ids-comp-icon-button-filled-color-bg-secondary-hovered);
@@ -108,9 +109,9 @@
108
109
  border-color: var(--ids-comp-icon-button-filled-color-border-secondary-disabled);
109
110
  }
110
111
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-brand {
111
- color: var(--ids-comp-icon-button-filled-color-fg-brand-enabled);
112
- background: var(--ids-comp-icon-button-filled-color-bg-brand-enabled);
113
- border-color: var(--ids-comp-icon-button-filled-color-border-brand-enabled);
112
+ color: var(--ids-comp-icon-button-filled-color-fg-brand-default);
113
+ background: var(--ids-comp-icon-button-filled-color-bg-brand-default);
114
+ border-color: var(--ids-comp-icon-button-filled-color-border-brand-default);
114
115
  }
115
116
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:hover {
116
117
  background: var(--ids-comp-icon-button-filled-color-bg-brand-hovered);
@@ -132,9 +133,9 @@
132
133
  border-color: var(--ids-comp-icon-button-filled-color-border-brand-disabled);
133
134
  }
134
135
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-error {
135
- color: var(--ids-comp-icon-button-filled-color-fg-error-enabled);
136
- background: var(--ids-comp-icon-button-filled-color-bg-error-enabled);
137
- border-color: var(--ids-comp-icon-button-filled-color-border-error-enabled);
136
+ color: var(--ids-comp-icon-button-filled-color-fg-error-default);
137
+ background: var(--ids-comp-icon-button-filled-color-bg-error-default);
138
+ border-color: var(--ids-comp-icon-button-filled-color-border-error-default);
138
139
  }
139
140
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-error:hover {
140
141
  background: var(--ids-comp-icon-button-filled-color-bg-error-hovered);
@@ -151,14 +152,12 @@
151
152
  border-color: var(--ids-comp-icon-button-filled-color-border-error-pressed);
152
153
  }
153
154
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-error:disabled {
154
- background: var(--ids-comp-icon-button-filled-color-bg-error-disabled);
155
- color: var(--ids-comp-icon-button-filled-color-fg-error-disabled);
156
155
  border-color: var(--ids-comp-icon-button-filled-color-border-error-disabled);
157
156
  }
158
157
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-success {
159
- color: var(--ids-comp-icon-button-filled-color-fg-success-enabled);
160
- background: var(--ids-comp-icon-button-filled-color-bg-success-enabled);
161
- border-color: var(--ids-comp-icon-button-filled-color-border-success-enabled);
158
+ color: var(--ids-comp-icon-button-filled-color-fg-success-default);
159
+ background: var(--ids-comp-icon-button-filled-color-bg-success-default);
160
+ border-color: var(--ids-comp-icon-button-filled-color-border-success-default);
162
161
  }
163
162
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-success:hover {
164
163
  background: var(--ids-comp-icon-button-filled-color-bg-success-hovered);
@@ -175,14 +174,12 @@
175
174
  border-color: var(--ids-comp-icon-button-filled-color-border-success-pressed);
176
175
  }
177
176
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-success:disabled {
178
- background: var(--ids-comp-icon-button-filled-color-bg-success-disabled);
179
- color: var(--ids-comp-icon-button-filled-color-fg-success-disabled);
180
177
  border-color: var(--ids-comp-icon-button-filled-color-border-success-disabled);
181
178
  }
182
179
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-warning {
183
- color: var(--ids-comp-icon-button-filled-color-fg-warning-enabled);
184
- background: var(--ids-comp-icon-button-filled-color-bg-warning-enabled);
185
- border-color: var(--ids-comp-icon-button-filled-color-border-warning-enabled);
180
+ color: var(--ids-comp-icon-button-filled-color-fg-warning-default);
181
+ background: var(--ids-comp-icon-button-filled-color-bg-warning-default);
182
+ border-color: var(--ids-comp-icon-button-filled-color-border-warning-default);
186
183
  }
187
184
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:hover {
188
185
  background: var(--ids-comp-icon-button-filled-color-bg-warning-hovered);
@@ -199,14 +196,12 @@
199
196
  border-color: var(--ids-comp-icon-button-filled-color-border-warning-pressed);
200
197
  }
201
198
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:disabled {
202
- background: var(--ids-comp-icon-button-filled-color-bg-warning-disabled);
203
- color: var(--ids-comp-icon-button-filled-color-fg-warning-disabled);
204
199
  border-color: var(--ids-comp-icon-button-filled-color-border-warning-disabled);
205
200
  }
206
201
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-light {
207
- color: var(--ids-comp-icon-button-filled-color-fg-light-enabled);
208
- background: var(--ids-comp-icon-button-filled-color-bg-light-enabled);
209
- border-color: var(--ids-comp-icon-button-filled-color-border-light-enabled);
202
+ color: var(--ids-comp-icon-button-filled-color-fg-light-default);
203
+ background: var(--ids-comp-icon-button-filled-color-bg-light-default);
204
+ border-color: var(--ids-comp-icon-button-filled-color-border-light-default);
210
205
  }
211
206
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-light:hover {
212
207
  background: var(--ids-comp-icon-button-filled-color-bg-light-hovered);
@@ -228,9 +223,9 @@
228
223
  border-color: var(--ids-comp-icon-button-filled-color-border-light-disabled);
229
224
  }
230
225
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-dark {
231
- color: var(--ids-comp-icon-button-filled-color-fg-dark-enabled);
232
- background: var(--ids-comp-icon-button-filled-color-bg-dark-enabled);
233
- border-color: var(--ids-comp-icon-button-filled-color-border-dark-enabled);
226
+ color: var(--ids-comp-icon-button-filled-color-fg-dark-default);
227
+ background: var(--ids-comp-icon-button-filled-color-bg-dark-default);
228
+ border-color: var(--ids-comp-icon-button-filled-color-border-dark-default);
234
229
  }
235
230
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:hover {
236
231
  background: var(--ids-comp-icon-button-filled-color-bg-dark-hovered);
@@ -252,9 +247,9 @@
252
247
  border-color: var(--ids-comp-icon-button-filled-color-border-dark-disabled);
253
248
  }
254
249
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-surface {
255
- color: var(--ids-comp-icon-button-filled-color-fg-surface-enabled);
256
- background: var(--ids-comp-icon-button-filled-color-bg-surface-enabled);
257
- border-color: var(--ids-comp-icon-button-filled-color-border-surface-enabled);
250
+ color: var(--ids-comp-icon-button-filled-color-fg-surface-default);
251
+ background: var(--ids-comp-icon-button-filled-color-bg-surface-default);
252
+ border-color: var(--ids-comp-icon-button-filled-color-border-surface-default);
258
253
  }
259
254
  .ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:hover {
260
255
  background: var(--ids-comp-icon-button-filled-color-bg-surface-hovered);
@@ -276,9 +271,9 @@
276
271
  border-color: var(--ids-comp-icon-button-filled-color-border-surface-disabled);
277
272
  }
278
273
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary {
279
- color: var(--ids-comp-icon-button-outlined-color-fg-primary-enabled);
280
- background: var(--ids-comp-icon-button-outlined-color-bg-primary-enabled);
281
- border-color: var(--ids-comp-icon-button-outlined-color-border-primary-enabled);
274
+ color: var(--ids-comp-icon-button-outlined-color-fg-primary-default);
275
+ background: var(--ids-comp-icon-button-outlined-color-bg-primary-default);
276
+ border-color: var(--ids-comp-icon-button-outlined-color-border-primary-default);
282
277
  }
283
278
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:hover {
284
279
  background: var(--ids-comp-icon-button-outlined-color-bg-primary-hovered);
@@ -300,9 +295,9 @@
300
295
  border-color: var(--ids-comp-icon-button-outlined-color-border-primary-disabled);
301
296
  }
302
297
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary {
303
- color: var(--ids-comp-icon-button-outlined-color-fg-secondary-enabled);
304
- background: var(--ids-comp-icon-button-outlined-color-bg-secondary-enabled);
305
- border-color: var(--ids-comp-icon-button-outlined-color-border-secondary-enabled);
298
+ color: var(--ids-comp-icon-button-outlined-color-fg-secondary-default);
299
+ background: var(--ids-comp-icon-button-outlined-color-bg-secondary-default);
300
+ border-color: var(--ids-comp-icon-button-outlined-color-border-secondary-default);
306
301
  }
307
302
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:hover {
308
303
  background: var(--ids-comp-icon-button-outlined-color-bg-secondary-hovered);
@@ -324,9 +319,9 @@
324
319
  border-color: var(--ids-comp-icon-button-outlined-color-border-secondary-disabled);
325
320
  }
326
321
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand {
327
- color: var(--ids-comp-icon-button-outlined-color-fg-brand-enabled);
328
- background: var(--ids-comp-icon-button-outlined-color-bg-brand-enabled);
329
- border-color: var(--ids-comp-icon-button-outlined-color-border-brand-enabled);
322
+ color: var(--ids-comp-icon-button-outlined-color-fg-brand-default);
323
+ background: var(--ids-comp-icon-button-outlined-color-bg-brand-default);
324
+ border-color: var(--ids-comp-icon-button-outlined-color-border-brand-default);
330
325
  }
331
326
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:hover {
332
327
  background: var(--ids-comp-icon-button-outlined-color-bg-brand-hovered);
@@ -348,9 +343,9 @@
348
343
  border-color: var(--ids-comp-icon-button-outlined-color-border-brand-disabled);
349
344
  }
350
345
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-error {
351
- color: var(--ids-comp-icon-button-outlined-color-fg-error-enabled);
352
- background: var(--ids-comp-icon-button-outlined-color-bg-error-enabled);
353
- border-color: var(--ids-comp-icon-button-outlined-color-border-error-enabled);
346
+ color: var(--ids-comp-icon-button-outlined-color-fg-error-default);
347
+ background: var(--ids-comp-icon-button-outlined-color-bg-error-default);
348
+ border-color: var(--ids-comp-icon-button-outlined-color-border-error-default);
354
349
  }
355
350
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:hover {
356
351
  background: var(--ids-comp-icon-button-outlined-color-bg-error-hovered);
@@ -367,14 +362,12 @@
367
362
  border-color: var(--ids-comp-icon-button-outlined-color-border-error-pressed);
368
363
  }
369
364
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:disabled {
370
- background: var(--ids-comp-icon-button-outlined-color-bg-error-disabled);
371
- color: var(--ids-comp-icon-button-outlined-color-fg-error-disabled);
372
365
  border-color: var(--ids-comp-icon-button-outlined-color-border-error-disabled);
373
366
  }
374
367
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-success {
375
- color: var(--ids-comp-icon-button-outlined-color-fg-success-enabled);
376
- background: var(--ids-comp-icon-button-outlined-color-bg-success-enabled);
377
- border-color: var(--ids-comp-icon-button-outlined-color-border-success-enabled);
368
+ color: var(--ids-comp-icon-button-outlined-color-fg-success-default);
369
+ background: var(--ids-comp-icon-button-outlined-color-bg-success-default);
370
+ border-color: var(--ids-comp-icon-button-outlined-color-border-success-default);
378
371
  }
379
372
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:hover {
380
373
  background: var(--ids-comp-icon-button-outlined-color-bg-success-hovered);
@@ -391,14 +384,12 @@
391
384
  border-color: var(--ids-comp-icon-button-outlined-color-border-success-pressed);
392
385
  }
393
386
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:disabled {
394
- background: var(--ids-comp-icon-button-outlined-color-bg-success-disabled);
395
- color: var(--ids-comp-icon-button-outlined-color-fg-success-disabled);
396
387
  border-color: var(--ids-comp-icon-button-outlined-color-border-success-disabled);
397
388
  }
398
389
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning {
399
- color: var(--ids-comp-icon-button-outlined-color-fg-warning-enabled);
400
- background: var(--ids-comp-icon-button-outlined-color-bg-warning-enabled);
401
- border-color: var(--ids-comp-icon-button-outlined-color-border-warning-enabled);
390
+ color: var(--ids-comp-icon-button-outlined-color-fg-warning-default);
391
+ background: var(--ids-comp-icon-button-outlined-color-bg-warning-default);
392
+ border-color: var(--ids-comp-icon-button-outlined-color-border-warning-default);
402
393
  }
403
394
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:hover {
404
395
  background: var(--ids-comp-icon-button-outlined-color-bg-warning-hovered);
@@ -415,14 +406,12 @@
415
406
  border-color: var(--ids-comp-icon-button-outlined-color-border-warning-pressed);
416
407
  }
417
408
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:disabled {
418
- background: var(--ids-comp-icon-button-outlined-color-bg-warning-disabled);
419
- color: var(--ids-comp-icon-button-outlined-color-fg-warning-disabled);
420
409
  border-color: var(--ids-comp-icon-button-outlined-color-border-warning-disabled);
421
410
  }
422
411
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-light {
423
- color: var(--ids-comp-icon-button-outlined-color-fg-light-enabled);
424
- background: var(--ids-comp-icon-button-outlined-color-bg-light-enabled);
425
- border-color: var(--ids-comp-icon-button-outlined-color-border-light-enabled);
412
+ color: var(--ids-comp-icon-button-outlined-color-fg-light-default);
413
+ background: var(--ids-comp-icon-button-outlined-color-bg-light-default);
414
+ border-color: var(--ids-comp-icon-button-outlined-color-border-light-default);
426
415
  }
427
416
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:hover {
428
417
  background: var(--ids-comp-icon-button-outlined-color-bg-light-hovered);
@@ -444,9 +433,9 @@
444
433
  border-color: var(--ids-comp-icon-button-outlined-color-border-light-disabled);
445
434
  }
446
435
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark {
447
- color: var(--ids-comp-icon-button-outlined-color-fg-dark-enabled);
448
- background: var(--ids-comp-icon-button-outlined-color-bg-dark-enabled);
449
- border-color: var(--ids-comp-icon-button-outlined-color-border-dark-enabled);
436
+ color: var(--ids-comp-icon-button-outlined-color-fg-dark-default);
437
+ background: var(--ids-comp-icon-button-outlined-color-bg-dark-default);
438
+ border-color: var(--ids-comp-icon-button-outlined-color-border-dark-default);
450
439
  }
451
440
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:hover {
452
441
  background: var(--ids-comp-icon-button-outlined-color-bg-dark-hovered);
@@ -468,9 +457,9 @@
468
457
  border-color: var(--ids-comp-icon-button-outlined-color-border-dark-disabled);
469
458
  }
470
459
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface {
471
- color: var(--ids-comp-icon-button-outlined-color-fg-surface-enabled);
472
- background: var(--ids-comp-icon-button-outlined-color-bg-surface-enabled);
473
- border-color: var(--ids-comp-icon-button-outlined-color-border-surface-enabled);
460
+ color: var(--ids-comp-icon-button-outlined-color-fg-surface-default);
461
+ background: var(--ids-comp-icon-button-outlined-color-bg-surface-default);
462
+ border-color: var(--ids-comp-icon-button-outlined-color-border-surface-default);
474
463
  }
475
464
  .ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:hover {
476
465
  background: var(--ids-comp-icon-button-outlined-color-bg-surface-hovered);
@@ -495,8 +484,8 @@
495
484
  border: none;
496
485
  }
497
486
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-primary {
498
- color: var(--ids-comp-icon-button-standard-color-fg-primary-enabled);
499
- background: var(--ids-comp-icon-button-standard-color-bg-primary-enabled);
487
+ color: var(--ids-comp-icon-button-standard-color-fg-primary-default);
488
+ background: var(--ids-comp-icon-button-standard-color-bg-primary-default);
500
489
  }
501
490
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:hover {
502
491
  background: var(--ids-comp-icon-button-standard-color-bg-primary-hovered);
@@ -515,8 +504,8 @@
515
504
  color: var(--ids-comp-icon-button-standard-color-fg-primary-disabled);
516
505
  }
517
506
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary {
518
- color: var(--ids-comp-icon-button-standard-color-fg-secondary-enabled);
519
- background: var(--ids-comp-icon-button-standard-color-bg-secondary-enabled);
507
+ color: var(--ids-comp-icon-button-standard-color-fg-secondary-default);
508
+ background: var(--ids-comp-icon-button-standard-color-bg-secondary-default);
520
509
  }
521
510
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:hover {
522
511
  background: var(--ids-comp-icon-button-standard-color-bg-secondary-hovered);
@@ -535,8 +524,8 @@
535
524
  color: var(--ids-comp-icon-button-standard-color-fg-secondary-disabled);
536
525
  }
537
526
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-brand {
538
- color: var(--ids-comp-icon-button-standard-color-fg-brand-enabled);
539
- background: var(--ids-comp-icon-button-standard-color-bg-brand-enabled);
527
+ color: var(--ids-comp-icon-button-standard-color-fg-brand-default);
528
+ background: var(--ids-comp-icon-button-standard-color-bg-brand-default);
540
529
  }
541
530
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:hover {
542
531
  background: var(--ids-comp-icon-button-standard-color-bg-brand-hovered);
@@ -555,8 +544,8 @@
555
544
  color: var(--ids-comp-icon-button-standard-color-fg-brand-disabled);
556
545
  }
557
546
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-error {
558
- color: var(--ids-comp-icon-button-standard-color-fg-error-enabled);
559
- background: var(--ids-comp-icon-button-standard-color-bg-error-enabled);
547
+ color: var(--ids-comp-icon-button-standard-color-fg-error-default);
548
+ background: var(--ids-comp-icon-button-standard-color-bg-error-default);
560
549
  }
561
550
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-error:hover {
562
551
  background: var(--ids-comp-icon-button-standard-color-bg-error-hovered);
@@ -570,13 +559,9 @@
570
559
  background: var(--ids-comp-icon-button-standard-color-bg-error-pressed);
571
560
  color: var(--ids-comp-icon-button-standard-color-fg-error-pressed);
572
561
  }
573
- .ids-icon-button.ids-icon-button-standard.ids-icon-button-error:disabled {
574
- background: var(--ids-comp-icon-button-standard-color-bg-error-disabled);
575
- color: var(--ids-comp-icon-button-standard-color-fg-error-disabled);
576
- }
577
562
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-success {
578
- color: var(--ids-comp-icon-button-standard-color-fg-success-enabled);
579
- background: var(--ids-comp-icon-button-standard-color-bg-success-enabled);
563
+ color: var(--ids-comp-icon-button-standard-color-fg-success-default);
564
+ background: var(--ids-comp-icon-button-standard-color-bg-success-default);
580
565
  }
581
566
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-success:hover {
582
567
  background: var(--ids-comp-icon-button-standard-color-bg-success-hovered);
@@ -590,13 +575,9 @@
590
575
  background: var(--ids-comp-icon-button-standard-color-bg-success-pressed);
591
576
  color: var(--ids-comp-icon-button-standard-color-fg-success-pressed);
592
577
  }
593
- .ids-icon-button.ids-icon-button-standard.ids-icon-button-success:disabled {
594
- background: var(--ids-comp-icon-button-standard-color-bg-success-disabled);
595
- color: var(--ids-comp-icon-button-standard-color-fg-success-disabled);
596
- }
597
578
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-warning {
598
- color: var(--ids-comp-icon-button-standard-color-fg-warning-enabled);
599
- background: var(--ids-comp-icon-button-standard-color-bg-warning-enabled);
579
+ color: var(--ids-comp-icon-button-standard-color-fg-warning-default);
580
+ background: var(--ids-comp-icon-button-standard-color-bg-warning-default);
600
581
  }
601
582
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:hover {
602
583
  background: var(--ids-comp-icon-button-standard-color-bg-warning-hovered);
@@ -610,13 +591,9 @@
610
591
  background: var(--ids-comp-icon-button-standard-color-bg-warning-pressed);
611
592
  color: var(--ids-comp-icon-button-standard-color-fg-warning-pressed);
612
593
  }
613
- .ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:disabled {
614
- background: var(--ids-comp-icon-button-standard-color-bg-warning-disabled);
615
- color: var(--ids-comp-icon-button-standard-color-fg-warning-disabled);
616
- }
617
594
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-light {
618
- color: var(--ids-comp-icon-button-standard-color-fg-light-enabled);
619
- background: var(--ids-comp-icon-button-standard-color-bg-light-enabled);
595
+ color: var(--ids-comp-icon-button-standard-color-fg-light-default);
596
+ background: var(--ids-comp-icon-button-standard-color-bg-light-default);
620
597
  }
621
598
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-light:hover {
622
599
  background: var(--ids-comp-icon-button-standard-color-bg-light-hovered);
@@ -635,8 +612,8 @@
635
612
  color: var(--ids-comp-icon-button-standard-color-fg-light-disabled);
636
613
  }
637
614
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-dark {
638
- color: var(--ids-comp-icon-button-standard-color-fg-dark-enabled);
639
- background: var(--ids-comp-icon-button-standard-color-bg-dark-enabled);
615
+ color: var(--ids-comp-icon-button-standard-color-fg-dark-default);
616
+ background: var(--ids-comp-icon-button-standard-color-bg-dark-default);
640
617
  }
641
618
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:hover {
642
619
  background: var(--ids-comp-icon-button-standard-color-bg-dark-hovered);
@@ -655,8 +632,8 @@
655
632
  color: var(--ids-comp-icon-button-standard-color-fg-dark-disabled);
656
633
  }
657
634
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-surface {
658
- color: var(--ids-comp-icon-button-standard-color-fg-surface-enabled);
659
- background: var(--ids-comp-icon-button-standard-color-bg-surface-enabled);
635
+ color: var(--ids-comp-icon-button-standard-color-fg-surface-default);
636
+ background: var(--ids-comp-icon-button-standard-color-bg-surface-default);
660
637
  }
661
638
  .ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:hover {
662
639
  background: var(--ids-comp-icon-button-standard-color-bg-surface-hovered);
package/dist/icon-button/icon-button.min.css CHANGED
@@ -1 +1 @@
1
- .ids-icon-button{padding:0px;display:flex;flex-shrink:0;align-items:center;justify-content:center}.ids-icon-button:focus{outline-offset:2px;outline:var(--ids-comp-icon-button-focused-outline-size-outline) solid var(--ids-comp-icon-button-focused-outline-color-dark-focused)}.ids-icon-button:focus.ids-icon-button-light{outline-color:var(--ids-comp-icon-button-focused-outline-color-light-focused)}.ids-icon-button:active{outline:none}.ids-icon-button.ids-icon-button-compact{padding:var(--ids-comp-size-icon-button-size-padding-y-compact) var(--ids-comp-size-icon-button-size-padding-x-compact);width:var(--ids-comp-size-icon-button-size-width-compact);height:var(--ids-comp-size-icon-button-size-height-compact);border-radius:var(--ids-comp-size-icon-button-size-border-radius-compact);border:var(--ids-comp-size-icon-button-size-border-compact) solid}.ids-icon-button.ids-icon-button-compact *[icon]{width:var(--ids-comp-size-icon-button-size-icon-compact);height:var(--ids-comp-size-icon-button-size-icon-compact)}.ids-icon-button.ids-icon-button-comfortable{padding:var(--ids-comp-size-icon-button-size-padding-y-comfortable) var(--ids-comp-size-icon-button-size-padding-x-comfortable);width:var(--ids-comp-size-icon-button-size-width-comfortable);height:var(--ids-comp-size-icon-button-size-height-comfortable);border-radius:var(--ids-comp-size-icon-button-size-border-radius-comfortable);border:var(--ids-comp-size-icon-button-size-border-comfortable) solid}.ids-icon-button.ids-icon-button-comfortable *[icon]{width:var(--ids-comp-size-icon-button-size-icon-comfortable);height:var(--ids-comp-size-icon-button-size-icon-comfortable)}.ids-icon-button.ids-icon-button-spacious{padding:var(--ids-comp-size-icon-button-size-padding-y-spacious) var(--ids-comp-size-icon-button-size-padding-x-spacious);width:var(--ids-comp-size-icon-button-size-width-spacious);height:var(--ids-comp-size-icon-button-size-height-spacious);border-radius:var(--ids-comp-size-icon-button-size-border-radius-spacious);border:var(--ids-comp-size-icon-button-size-border-spacious) solid}.ids-icon-button.ids-icon-button-spacious *[icon]{width:var(--ids-comp-size-icon-button-size-icon-spacious);height:var(--ids-comp-size-icon-button-size-icon-spacious)}.ids-icon-button.ids-icon-button-dense{padding:var(--ids-comp-size-icon-button-size-padding-y-dense) var(--ids-comp-size-icon-button-size-padding-x-dense);width:var(--ids-comp-size-icon-button-size-width-dense);height:var(--ids-comp-size-icon-button-size-height-dense);border-radius:var(--ids-comp-size-icon-button-size-border-radius-dense);border:var(--ids-comp-size-icon-button-size-border-dense) solid}.ids-icon-button.ids-icon-button-dense *[icon]{width:var(--ids-comp-size-icon-button-size-icon-dense);height:var(--ids-comp-size-icon-button-size-icon-dense)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary{color:var(--ids-comp-icon-button-filled-color-fg-primary-enabled);background:var(--ids-comp-icon-button-filled-color-bg-primary-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-primary-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:hover{background:var(--ids-comp-icon-button-filled-color-bg-primary-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-primary-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:focus{background:var(--ids-comp-icon-button-filled-color-bg-primary-focused);color:var(--ids-comp-icon-button-filled-color-fg-primary-focused);border-color:var(--ids-comp-icon-button-filled-color-border-primary-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:active{background:var(--ids-comp-icon-button-filled-color-bg-primary-pressed);color:var(--ids-comp-icon-button-filled-color-fg-primary-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-primary-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:disabled{background:var(--ids-comp-icon-button-filled-color-bg-primary-disabled);color:var(--ids-comp-icon-button-filled-color-fg-primary-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-primary-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary{color:var(--ids-comp-icon-button-filled-color-fg-secondary-enabled);background:var(--ids-comp-icon-button-filled-color-bg-secondary-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:hover{background:var(--ids-comp-icon-button-filled-color-bg-secondary-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:focus{background:var(--ids-comp-icon-button-filled-color-bg-secondary-focused);color:var(--ids-comp-icon-button-filled-color-fg-secondary-focused);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:active{background:var(--ids-comp-icon-button-filled-color-bg-secondary-pressed);color:var(--ids-comp-icon-button-filled-color-fg-secondary-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:disabled{background:var(--ids-comp-icon-button-filled-color-bg-secondary-disabled);color:var(--ids-comp-icon-button-filled-color-fg-secondary-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand{color:var(--ids-comp-icon-button-filled-color-fg-brand-enabled);background:var(--ids-comp-icon-button-filled-color-bg-brand-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-brand-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:hover{background:var(--ids-comp-icon-button-filled-color-bg-brand-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-brand-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:focus{background:var(--ids-comp-icon-button-filled-color-bg-brand-focused);color:var(--ids-comp-icon-button-filled-color-fg-brand-focused);border-color:var(--ids-comp-icon-button-filled-color-border-brand-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:active{background:var(--ids-comp-icon-button-filled-color-bg-brand-pressed);color:var(--ids-comp-icon-button-filled-color-fg-brand-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-brand-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:disabled{background:var(--ids-comp-icon-button-filled-color-bg-brand-disabled);color:var(--ids-comp-icon-button-filled-color-fg-brand-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-brand-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error{color:var(--ids-comp-icon-button-filled-color-fg-error-enabled);background:var(--ids-comp-icon-button-filled-color-bg-error-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-error-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error:hover{background:var(--ids-comp-icon-button-filled-color-bg-error-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-error-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error:focus{background:var(--ids-comp-icon-button-filled-color-bg-error-focused);color:var(--ids-comp-icon-button-filled-color-fg-error-focused);border-color:var(--ids-comp-icon-button-filled-color-border-error-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error:active{background:var(--ids-comp-icon-button-filled-color-bg-error-pressed);color:var(--ids-comp-icon-button-filled-color-fg-error-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-error-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error:disabled{background:var(--ids-comp-icon-button-filled-color-bg-error-disabled);color:var(--ids-comp-icon-button-filled-color-fg-error-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-error-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success{color:var(--ids-comp-icon-button-filled-color-fg-success-enabled);background:var(--ids-comp-icon-button-filled-color-bg-success-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-success-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success:hover{background:var(--ids-comp-icon-button-filled-color-bg-success-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-success-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success:focus{background:var(--ids-comp-icon-button-filled-color-bg-success-focused);color:var(--ids-comp-icon-button-filled-color-fg-success-focused);border-color:var(--ids-comp-icon-button-filled-color-border-success-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success:active{background:var(--ids-comp-icon-button-filled-color-bg-success-pressed);color:var(--ids-comp-icon-button-filled-color-fg-success-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-success-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success:disabled{background:var(--ids-comp-icon-button-filled-color-bg-success-disabled);color:var(--ids-comp-icon-button-filled-color-fg-success-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-success-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning{color:var(--ids-comp-icon-button-filled-color-fg-warning-enabled);background:var(--ids-comp-icon-button-filled-color-bg-warning-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-warning-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:hover{background:var(--ids-comp-icon-button-filled-color-bg-warning-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-warning-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:focus{background:var(--ids-comp-icon-button-filled-color-bg-warning-focused);color:var(--ids-comp-icon-button-filled-color-fg-warning-focused);border-color:var(--ids-comp-icon-button-filled-color-border-warning-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:active{background:var(--ids-comp-icon-button-filled-color-bg-warning-pressed);color:var(--ids-comp-icon-button-filled-color-fg-warning-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-warning-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:disabled{background:var(--ids-comp-icon-button-filled-color-bg-warning-disabled);color:var(--ids-comp-icon-button-filled-color-fg-warning-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-warning-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light{color:var(--ids-comp-icon-button-filled-color-fg-light-enabled);background:var(--ids-comp-icon-button-filled-color-bg-light-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-light-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:hover{background:var(--ids-comp-icon-button-filled-color-bg-light-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-light-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:focus{background:var(--ids-comp-icon-button-filled-color-bg-light-focused);color:var(--ids-comp-icon-button-filled-color-fg-light-focused);border-color:var(--ids-comp-icon-button-filled-color-border-light-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:active{background:var(--ids-comp-icon-button-filled-color-bg-light-pressed);color:var(--ids-comp-icon-button-filled-color-fg-light-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-light-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:disabled{background:var(--ids-comp-icon-button-filled-color-bg-light-disabled);color:var(--ids-comp-icon-button-filled-color-fg-light-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-light-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark{color:var(--ids-comp-icon-button-filled-color-fg-dark-enabled);background:var(--ids-comp-icon-button-filled-color-bg-dark-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-dark-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:hover{background:var(--ids-comp-icon-button-filled-color-bg-dark-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-dark-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:focus{background:var(--ids-comp-icon-button-filled-color-bg-dark-focused);color:var(--ids-comp-icon-button-filled-color-fg-dark-focused);border-color:var(--ids-comp-icon-button-filled-color-border-dark-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:active{background:var(--ids-comp-icon-button-filled-color-bg-dark-pressed);color:var(--ids-comp-icon-button-filled-color-fg-dark-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-dark-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:disabled{background:var(--ids-comp-icon-button-filled-color-bg-dark-disabled);color:var(--ids-comp-icon-button-filled-color-fg-dark-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-dark-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface{color:var(--ids-comp-icon-button-filled-color-fg-surface-enabled);background:var(--ids-comp-icon-button-filled-color-bg-surface-enabled);border-color:var(--ids-comp-icon-button-filled-color-border-surface-enabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:hover{background:var(--ids-comp-icon-button-filled-color-bg-surface-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-surface-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:focus{background:var(--ids-comp-icon-button-filled-color-bg-surface-focused);color:var(--ids-comp-icon-button-filled-color-fg-surface-focused);border-color:var(--ids-comp-icon-button-filled-color-border-surface-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:active{background:var(--ids-comp-icon-button-filled-color-bg-surface-pressed);color:var(--ids-comp-icon-button-filled-color-fg-surface-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-surface-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:disabled{background:var(--ids-comp-icon-button-filled-color-bg-surface-disabled);color:var(--ids-comp-icon-button-filled-color-fg-surface-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-surface-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary{color:var(--ids-comp-icon-button-outlined-color-fg-primary-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-primary-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:hover{background:var(--ids-comp-icon-button-outlined-color-bg-primary-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:focus{background:var(--ids-comp-icon-button-outlined-color-bg-primary-focused);color:var(--ids-comp-icon-button-outlined-color-fg-primary-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:active{background:var(--ids-comp-icon-button-outlined-color-bg-primary-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-primary-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-primary-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-primary-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary{color:var(--ids-comp-icon-button-outlined-color-fg-secondary-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-secondary-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:hover{background:var(--ids-comp-icon-button-outlined-color-bg-secondary-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:focus{background:var(--ids-comp-icon-button-outlined-color-bg-secondary-focused);color:var(--ids-comp-icon-button-outlined-color-fg-secondary-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:active{background:var(--ids-comp-icon-button-outlined-color-bg-secondary-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-secondary-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-secondary-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-secondary-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand{color:var(--ids-comp-icon-button-outlined-color-fg-brand-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-brand-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:hover{background:var(--ids-comp-icon-button-outlined-color-bg-brand-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:focus{background:var(--ids-comp-icon-button-outlined-color-bg-brand-focused);color:var(--ids-comp-icon-button-outlined-color-fg-brand-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:active{background:var(--ids-comp-icon-button-outlined-color-bg-brand-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-brand-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-brand-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-brand-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error{color:var(--ids-comp-icon-button-outlined-color-fg-error-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-error-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-error-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:hover{background:var(--ids-comp-icon-button-outlined-color-bg-error-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-error-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:focus{background:var(--ids-comp-icon-button-outlined-color-bg-error-focused);color:var(--ids-comp-icon-button-outlined-color-fg-error-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-error-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:active{background:var(--ids-comp-icon-button-outlined-color-bg-error-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-error-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-error-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-error-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-error-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-error-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success{color:var(--ids-comp-icon-button-outlined-color-fg-success-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-success-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-success-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:hover{background:var(--ids-comp-icon-button-outlined-color-bg-success-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-success-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:focus{background:var(--ids-comp-icon-button-outlined-color-bg-success-focused);color:var(--ids-comp-icon-button-outlined-color-fg-success-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-success-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:active{background:var(--ids-comp-icon-button-outlined-color-bg-success-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-success-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-success-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-success-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-success-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-success-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning{color:var(--ids-comp-icon-button-outlined-color-fg-warning-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-warning-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:hover{background:var(--ids-comp-icon-button-outlined-color-bg-warning-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:focus{background:var(--ids-comp-icon-button-outlined-color-bg-warning-focused);color:var(--ids-comp-icon-button-outlined-color-fg-warning-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:active{background:var(--ids-comp-icon-button-outlined-color-bg-warning-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-warning-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-warning-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-warning-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light{color:var(--ids-comp-icon-button-outlined-color-fg-light-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-light-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-light-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:hover{background:var(--ids-comp-icon-button-outlined-color-bg-light-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-light-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:focus{background:var(--ids-comp-icon-button-outlined-color-bg-light-focused);color:var(--ids-comp-icon-button-outlined-color-fg-light-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-light-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:active{background:var(--ids-comp-icon-button-outlined-color-bg-light-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-light-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-light-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-light-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-light-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-light-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark{color:var(--ids-comp-icon-button-outlined-color-fg-dark-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-dark-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:hover{background:var(--ids-comp-icon-button-outlined-color-bg-dark-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:focus{background:var(--ids-comp-icon-button-outlined-color-bg-dark-focused);color:var(--ids-comp-icon-button-outlined-color-fg-dark-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:active{background:var(--ids-comp-icon-button-outlined-color-bg-dark-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-dark-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-dark-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-dark-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface{color:var(--ids-comp-icon-button-outlined-color-fg-surface-enabled);background:var(--ids-comp-icon-button-outlined-color-bg-surface-enabled);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-enabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:hover{background:var(--ids-comp-icon-button-outlined-color-bg-surface-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:focus{background:var(--ids-comp-icon-button-outlined-color-bg-surface-focused);color:var(--ids-comp-icon-button-outlined-color-fg-surface-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:active{background:var(--ids-comp-icon-button-outlined-color-bg-surface-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-surface-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-surface-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-surface-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-disabled)}.ids-icon-button.ids-icon-button-standard{border:none}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary{color:var(--ids-comp-icon-button-standard-color-fg-primary-enabled);background:var(--ids-comp-icon-button-standard-color-bg-primary-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:hover{background:var(--ids-comp-icon-button-standard-color-bg-primary-hovered);color:var(--ids-comp-icon-button-standard-color-fg-primary-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:focus{background:var(--ids-comp-icon-button-standard-color-bg-primary-focused);color:var(--ids-comp-icon-button-standard-color-fg-primary-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:active{background:var(--ids-comp-icon-button-standard-color-bg-primary-pressed);color:var(--ids-comp-icon-button-standard-color-fg-primary-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:disabled{background:var(--ids-comp-icon-button-standard-color-bg-primary-disabled);color:var(--ids-comp-icon-button-standard-color-fg-primary-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary{color:var(--ids-comp-icon-button-standard-color-fg-secondary-enabled);background:var(--ids-comp-icon-button-standard-color-bg-secondary-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:hover{background:var(--ids-comp-icon-button-standard-color-bg-secondary-hovered);color:var(--ids-comp-icon-button-standard-color-fg-secondary-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:focus{background:var(--ids-comp-icon-button-standard-color-bg-secondary-focused);color:var(--ids-comp-icon-button-standard-color-fg-secondary-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:active{background:var(--ids-comp-icon-button-standard-color-bg-secondary-pressed);color:var(--ids-comp-icon-button-standard-color-fg-secondary-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:disabled{background:var(--ids-comp-icon-button-standard-color-bg-secondary-disabled);color:var(--ids-comp-icon-button-standard-color-fg-secondary-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand{color:var(--ids-comp-icon-button-standard-color-fg-brand-enabled);background:var(--ids-comp-icon-button-standard-color-bg-brand-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:hover{background:var(--ids-comp-icon-button-standard-color-bg-brand-hovered);color:var(--ids-comp-icon-button-standard-color-fg-brand-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:focus{background:var(--ids-comp-icon-button-standard-color-bg-brand-focused);color:var(--ids-comp-icon-button-standard-color-fg-brand-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:active{background:var(--ids-comp-icon-button-standard-color-bg-brand-pressed);color:var(--ids-comp-icon-button-standard-color-fg-brand-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:disabled{background:var(--ids-comp-icon-button-standard-color-bg-brand-disabled);color:var(--ids-comp-icon-button-standard-color-fg-brand-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error{color:var(--ids-comp-icon-button-standard-color-fg-error-enabled);background:var(--ids-comp-icon-button-standard-color-bg-error-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error:hover{background:var(--ids-comp-icon-button-standard-color-bg-error-hovered);color:var(--ids-comp-icon-button-standard-color-fg-error-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error:focus{background:var(--ids-comp-icon-button-standard-color-bg-error-focused);color:var(--ids-comp-icon-button-standard-color-fg-error-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error:active{background:var(--ids-comp-icon-button-standard-color-bg-error-pressed);color:var(--ids-comp-icon-button-standard-color-fg-error-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error:disabled{background:var(--ids-comp-icon-button-standard-color-bg-error-disabled);color:var(--ids-comp-icon-button-standard-color-fg-error-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success{color:var(--ids-comp-icon-button-standard-color-fg-success-enabled);background:var(--ids-comp-icon-button-standard-color-bg-success-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success:hover{background:var(--ids-comp-icon-button-standard-color-bg-success-hovered);color:var(--ids-comp-icon-button-standard-color-fg-success-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success:focus{background:var(--ids-comp-icon-button-standard-color-bg-success-focused);color:var(--ids-comp-icon-button-standard-color-fg-success-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success:active{background:var(--ids-comp-icon-button-standard-color-bg-success-pressed);color:var(--ids-comp-icon-button-standard-color-fg-success-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success:disabled{background:var(--ids-comp-icon-button-standard-color-bg-success-disabled);color:var(--ids-comp-icon-button-standard-color-fg-success-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning{color:var(--ids-comp-icon-button-standard-color-fg-warning-enabled);background:var(--ids-comp-icon-button-standard-color-bg-warning-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:hover{background:var(--ids-comp-icon-button-standard-color-bg-warning-hovered);color:var(--ids-comp-icon-button-standard-color-fg-warning-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:focus{background:var(--ids-comp-icon-button-standard-color-bg-warning-focused);color:var(--ids-comp-icon-button-standard-color-fg-warning-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:active{background:var(--ids-comp-icon-button-standard-color-bg-warning-pressed);color:var(--ids-comp-icon-button-standard-color-fg-warning-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:disabled{background:var(--ids-comp-icon-button-standard-color-bg-warning-disabled);color:var(--ids-comp-icon-button-standard-color-fg-warning-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light{color:var(--ids-comp-icon-button-standard-color-fg-light-enabled);background:var(--ids-comp-icon-button-standard-color-bg-light-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:hover{background:var(--ids-comp-icon-button-standard-color-bg-light-hovered);color:var(--ids-comp-icon-button-standard-color-fg-light-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:focus{background:var(--ids-comp-icon-button-standard-color-bg-light-focused);color:var(--ids-comp-icon-button-standard-color-fg-light-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:active{background:var(--ids-comp-icon-button-standard-color-bg-light-pressed);color:var(--ids-comp-icon-button-standard-color-fg-light-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:disabled{background:var(--ids-comp-icon-button-standard-color-bg-light-disabled);color:var(--ids-comp-icon-button-standard-color-fg-light-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark{color:var(--ids-comp-icon-button-standard-color-fg-dark-enabled);background:var(--ids-comp-icon-button-standard-color-bg-dark-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:hover{background:var(--ids-comp-icon-button-standard-color-bg-dark-hovered);color:var(--ids-comp-icon-button-standard-color-fg-dark-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:focus{background:var(--ids-comp-icon-button-standard-color-bg-dark-focused);color:var(--ids-comp-icon-button-standard-color-fg-dark-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:active{background:var(--ids-comp-icon-button-standard-color-bg-dark-pressed);color:var(--ids-comp-icon-button-standard-color-fg-dark-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:disabled{background:var(--ids-comp-icon-button-standard-color-bg-dark-disabled);color:var(--ids-comp-icon-button-standard-color-fg-dark-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface{color:var(--ids-comp-icon-button-standard-color-fg-surface-enabled);background:var(--ids-comp-icon-button-standard-color-bg-surface-enabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:hover{background:var(--ids-comp-icon-button-standard-color-bg-surface-hovered);color:var(--ids-comp-icon-button-standard-color-fg-surface-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:focus{background:var(--ids-comp-icon-button-standard-color-bg-surface-focused);color:var(--ids-comp-icon-button-standard-color-fg-surface-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:active{background:var(--ids-comp-icon-button-standard-color-bg-surface-pressed);color:var(--ids-comp-icon-button-standard-color-fg-surface-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:disabled{background:var(--ids-comp-icon-button-standard-color-bg-surface-disabled);color:var(--ids-comp-icon-button-standard-color-fg-surface-disabled)}
1
+ .ids-icon-button{padding:0px;display:flex;flex-shrink:0;align-items:center;justify-content:center;border-style:solid}.ids-icon-button:focus{outline-offset:2px;outline:var(--ids-comp-icon-button-focused-outline-size-outline) solid var(--ids-comp-icon-button-focused-outline-color-dark-focused)}.ids-icon-button:focus.ids-icon-button-light{outline-color:var(--ids-comp-icon-button-focused-outline-color-light-focused)}.ids-icon-button:active{outline:none}.ids-icon-button.ids-icon-button-compact{padding:var(--ids-comp-icon-button-size-padding-y-compact) var(--ids-comp-icon-button-size-padding-x-compact);width:var(--ids-comp-icon-button-size-width-compact);height:var(--ids-comp-icon-button-size-height-compact);border-radius:var(--ids-comp-icon-button-size-border-radius-compact);border-width:var(--ids-comp-icon-button-size-border-compact)}.ids-icon-button.ids-icon-button-compact *[icon]{width:var(--ids-comp-icon-button-size-icon-compact);height:var(--ids-comp-icon-button-size-icon-compact)}.ids-icon-button.ids-icon-button-comfortable{padding:var(--ids-comp-icon-button-size-padding-y-comfortable) var(--ids-comp-icon-button-size-padding-x-comfortable);width:var(--ids-comp-icon-button-size-width-comfortable);height:var(--ids-comp-icon-button-size-height-comfortable);border-radius:var(--ids-comp-icon-button-size-border-radius-comfortable);border-width:var(--ids-comp-icon-button-size-border-comfortable)}.ids-icon-button.ids-icon-button-comfortable *[icon]{width:var(--ids-comp-icon-button-size-icon-comfortable);height:var(--ids-comp-icon-button-size-icon-comfortable)}.ids-icon-button.ids-icon-button-spacious{padding:var(--ids-comp-icon-button-size-padding-y-spacious) var(--ids-comp-icon-button-size-padding-x-spacious);width:var(--ids-comp-icon-button-size-width-spacious);height:var(--ids-comp-icon-button-size-height-spacious);border-radius:var(--ids-comp-icon-button-size-border-radius-spacious);border-width:var(--ids-comp-icon-button-size-border-spacious)}.ids-icon-button.ids-icon-button-spacious *[icon]{width:var(--ids-comp-icon-button-size-icon-spacious);height:var(--ids-comp-icon-button-size-icon-spacious)}.ids-icon-button.ids-icon-button-dense{padding:var(--ids-comp-icon-button-size-padding-y-dense) var(--ids-comp-icon-button-size-padding-x-dense);width:var(--ids-comp-icon-button-size-width-dense);height:var(--ids-comp-icon-button-size-height-dense);border-radius:var(--ids-comp-icon-button-size-border-radius-dense);border-width:var(--ids-comp-icon-button-size-border-dense)}.ids-icon-button.ids-icon-button-dense *[icon]{width:var(--ids-comp-icon-button-size-icon-dense);height:var(--ids-comp-icon-button-size-icon-dense)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary{color:var(--ids-comp-icon-button-filled-color-fg-primary-default);background:var(--ids-comp-icon-button-filled-color-bg-primary-default);border-color:var(--ids-comp-icon-button-filled-color-border-primary-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:hover{background:var(--ids-comp-icon-button-filled-color-bg-primary-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-primary-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:focus{background:var(--ids-comp-icon-button-filled-color-bg-primary-focused);color:var(--ids-comp-icon-button-filled-color-fg-primary-focused);border-color:var(--ids-comp-icon-button-filled-color-border-primary-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:active{background:var(--ids-comp-icon-button-filled-color-bg-primary-pressed);color:var(--ids-comp-icon-button-filled-color-fg-primary-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-primary-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-primary:disabled{background:var(--ids-comp-icon-button-filled-color-bg-primary-disabled);color:var(--ids-comp-icon-button-filled-color-fg-primary-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-primary-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary{color:var(--ids-comp-icon-button-filled-color-fg-secondary-default);background:var(--ids-comp-icon-button-filled-color-bg-secondary-default);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:hover{background:var(--ids-comp-icon-button-filled-color-bg-secondary-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:focus{background:var(--ids-comp-icon-button-filled-color-bg-secondary-focused);color:var(--ids-comp-icon-button-filled-color-fg-secondary-focused);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:active{background:var(--ids-comp-icon-button-filled-color-bg-secondary-pressed);color:var(--ids-comp-icon-button-filled-color-fg-secondary-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-secondary:disabled{background:var(--ids-comp-icon-button-filled-color-bg-secondary-disabled);color:var(--ids-comp-icon-button-filled-color-fg-secondary-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-secondary-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand{color:var(--ids-comp-icon-button-filled-color-fg-brand-default);background:var(--ids-comp-icon-button-filled-color-bg-brand-default);border-color:var(--ids-comp-icon-button-filled-color-border-brand-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:hover{background:var(--ids-comp-icon-button-filled-color-bg-brand-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-brand-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:focus{background:var(--ids-comp-icon-button-filled-color-bg-brand-focused);color:var(--ids-comp-icon-button-filled-color-fg-brand-focused);border-color:var(--ids-comp-icon-button-filled-color-border-brand-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:active{background:var(--ids-comp-icon-button-filled-color-bg-brand-pressed);color:var(--ids-comp-icon-button-filled-color-fg-brand-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-brand-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-brand:disabled{background:var(--ids-comp-icon-button-filled-color-bg-brand-disabled);color:var(--ids-comp-icon-button-filled-color-fg-brand-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-brand-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error{color:var(--ids-comp-icon-button-filled-color-fg-error-default);background:var(--ids-comp-icon-button-filled-color-bg-error-default);border-color:var(--ids-comp-icon-button-filled-color-border-error-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error:hover{background:var(--ids-comp-icon-button-filled-color-bg-error-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-error-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error:focus{background:var(--ids-comp-icon-button-filled-color-bg-error-focused);color:var(--ids-comp-icon-button-filled-color-fg-error-focused);border-color:var(--ids-comp-icon-button-filled-color-border-error-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error:active{background:var(--ids-comp-icon-button-filled-color-bg-error-pressed);color:var(--ids-comp-icon-button-filled-color-fg-error-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-error-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-error:disabled{border-color:var(--ids-comp-icon-button-filled-color-border-error-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success{color:var(--ids-comp-icon-button-filled-color-fg-success-default);background:var(--ids-comp-icon-button-filled-color-bg-success-default);border-color:var(--ids-comp-icon-button-filled-color-border-success-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success:hover{background:var(--ids-comp-icon-button-filled-color-bg-success-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-success-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success:focus{background:var(--ids-comp-icon-button-filled-color-bg-success-focused);color:var(--ids-comp-icon-button-filled-color-fg-success-focused);border-color:var(--ids-comp-icon-button-filled-color-border-success-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success:active{background:var(--ids-comp-icon-button-filled-color-bg-success-pressed);color:var(--ids-comp-icon-button-filled-color-fg-success-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-success-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-success:disabled{border-color:var(--ids-comp-icon-button-filled-color-border-success-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning{color:var(--ids-comp-icon-button-filled-color-fg-warning-default);background:var(--ids-comp-icon-button-filled-color-bg-warning-default);border-color:var(--ids-comp-icon-button-filled-color-border-warning-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:hover{background:var(--ids-comp-icon-button-filled-color-bg-warning-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-warning-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:focus{background:var(--ids-comp-icon-button-filled-color-bg-warning-focused);color:var(--ids-comp-icon-button-filled-color-fg-warning-focused);border-color:var(--ids-comp-icon-button-filled-color-border-warning-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:active{background:var(--ids-comp-icon-button-filled-color-bg-warning-pressed);color:var(--ids-comp-icon-button-filled-color-fg-warning-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-warning-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-warning:disabled{border-color:var(--ids-comp-icon-button-filled-color-border-warning-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light{color:var(--ids-comp-icon-button-filled-color-fg-light-default);background:var(--ids-comp-icon-button-filled-color-bg-light-default);border-color:var(--ids-comp-icon-button-filled-color-border-light-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:hover{background:var(--ids-comp-icon-button-filled-color-bg-light-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-light-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:focus{background:var(--ids-comp-icon-button-filled-color-bg-light-focused);color:var(--ids-comp-icon-button-filled-color-fg-light-focused);border-color:var(--ids-comp-icon-button-filled-color-border-light-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:active{background:var(--ids-comp-icon-button-filled-color-bg-light-pressed);color:var(--ids-comp-icon-button-filled-color-fg-light-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-light-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-light:disabled{background:var(--ids-comp-icon-button-filled-color-bg-light-disabled);color:var(--ids-comp-icon-button-filled-color-fg-light-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-light-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark{color:var(--ids-comp-icon-button-filled-color-fg-dark-default);background:var(--ids-comp-icon-button-filled-color-bg-dark-default);border-color:var(--ids-comp-icon-button-filled-color-border-dark-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:hover{background:var(--ids-comp-icon-button-filled-color-bg-dark-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-dark-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:focus{background:var(--ids-comp-icon-button-filled-color-bg-dark-focused);color:var(--ids-comp-icon-button-filled-color-fg-dark-focused);border-color:var(--ids-comp-icon-button-filled-color-border-dark-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:active{background:var(--ids-comp-icon-button-filled-color-bg-dark-pressed);color:var(--ids-comp-icon-button-filled-color-fg-dark-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-dark-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-dark:disabled{background:var(--ids-comp-icon-button-filled-color-bg-dark-disabled);color:var(--ids-comp-icon-button-filled-color-fg-dark-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-dark-disabled)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface{color:var(--ids-comp-icon-button-filled-color-fg-surface-default);background:var(--ids-comp-icon-button-filled-color-bg-surface-default);border-color:var(--ids-comp-icon-button-filled-color-border-surface-default)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:hover{background:var(--ids-comp-icon-button-filled-color-bg-surface-hovered);border-color:var(--ids-comp-icon-button-filled-color-border-surface-hovered)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:focus{background:var(--ids-comp-icon-button-filled-color-bg-surface-focused);color:var(--ids-comp-icon-button-filled-color-fg-surface-focused);border-color:var(--ids-comp-icon-button-filled-color-border-surface-focused)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:active{background:var(--ids-comp-icon-button-filled-color-bg-surface-pressed);color:var(--ids-comp-icon-button-filled-color-fg-surface-pressed);border-color:var(--ids-comp-icon-button-filled-color-border-surface-pressed)}.ids-icon-button.ids-icon-button-filled.ids-icon-button-surface:disabled{background:var(--ids-comp-icon-button-filled-color-bg-surface-disabled);color:var(--ids-comp-icon-button-filled-color-fg-surface-disabled);border-color:var(--ids-comp-icon-button-filled-color-border-surface-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary{color:var(--ids-comp-icon-button-outlined-color-fg-primary-default);background:var(--ids-comp-icon-button-outlined-color-bg-primary-default);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:hover{background:var(--ids-comp-icon-button-outlined-color-bg-primary-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:focus{background:var(--ids-comp-icon-button-outlined-color-bg-primary-focused);color:var(--ids-comp-icon-button-outlined-color-fg-primary-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:active{background:var(--ids-comp-icon-button-outlined-color-bg-primary-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-primary-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-primary:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-primary-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-primary-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-primary-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary{color:var(--ids-comp-icon-button-outlined-color-fg-secondary-default);background:var(--ids-comp-icon-button-outlined-color-bg-secondary-default);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:hover{background:var(--ids-comp-icon-button-outlined-color-bg-secondary-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:focus{background:var(--ids-comp-icon-button-outlined-color-bg-secondary-focused);color:var(--ids-comp-icon-button-outlined-color-fg-secondary-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:active{background:var(--ids-comp-icon-button-outlined-color-bg-secondary-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-secondary-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-secondary:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-secondary-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-secondary-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-secondary-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand{color:var(--ids-comp-icon-button-outlined-color-fg-brand-default);background:var(--ids-comp-icon-button-outlined-color-bg-brand-default);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:hover{background:var(--ids-comp-icon-button-outlined-color-bg-brand-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:focus{background:var(--ids-comp-icon-button-outlined-color-bg-brand-focused);color:var(--ids-comp-icon-button-outlined-color-fg-brand-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:active{background:var(--ids-comp-icon-button-outlined-color-bg-brand-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-brand-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-brand:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-brand-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-brand-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-brand-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error{color:var(--ids-comp-icon-button-outlined-color-fg-error-default);background:var(--ids-comp-icon-button-outlined-color-bg-error-default);border-color:var(--ids-comp-icon-button-outlined-color-border-error-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:hover{background:var(--ids-comp-icon-button-outlined-color-bg-error-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-error-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:focus{background:var(--ids-comp-icon-button-outlined-color-bg-error-focused);color:var(--ids-comp-icon-button-outlined-color-fg-error-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-error-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:active{background:var(--ids-comp-icon-button-outlined-color-bg-error-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-error-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-error-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-error:disabled{border-color:var(--ids-comp-icon-button-outlined-color-border-error-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success{color:var(--ids-comp-icon-button-outlined-color-fg-success-default);background:var(--ids-comp-icon-button-outlined-color-bg-success-default);border-color:var(--ids-comp-icon-button-outlined-color-border-success-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:hover{background:var(--ids-comp-icon-button-outlined-color-bg-success-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-success-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:focus{background:var(--ids-comp-icon-button-outlined-color-bg-success-focused);color:var(--ids-comp-icon-button-outlined-color-fg-success-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-success-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:active{background:var(--ids-comp-icon-button-outlined-color-bg-success-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-success-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-success-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-success:disabled{border-color:var(--ids-comp-icon-button-outlined-color-border-success-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning{color:var(--ids-comp-icon-button-outlined-color-fg-warning-default);background:var(--ids-comp-icon-button-outlined-color-bg-warning-default);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:hover{background:var(--ids-comp-icon-button-outlined-color-bg-warning-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:focus{background:var(--ids-comp-icon-button-outlined-color-bg-warning-focused);color:var(--ids-comp-icon-button-outlined-color-fg-warning-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:active{background:var(--ids-comp-icon-button-outlined-color-bg-warning-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-warning-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-warning-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-warning:disabled{border-color:var(--ids-comp-icon-button-outlined-color-border-warning-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light{color:var(--ids-comp-icon-button-outlined-color-fg-light-default);background:var(--ids-comp-icon-button-outlined-color-bg-light-default);border-color:var(--ids-comp-icon-button-outlined-color-border-light-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:hover{background:var(--ids-comp-icon-button-outlined-color-bg-light-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-light-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:focus{background:var(--ids-comp-icon-button-outlined-color-bg-light-focused);color:var(--ids-comp-icon-button-outlined-color-fg-light-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-light-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:active{background:var(--ids-comp-icon-button-outlined-color-bg-light-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-light-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-light-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-light:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-light-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-light-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-light-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark{color:var(--ids-comp-icon-button-outlined-color-fg-dark-default);background:var(--ids-comp-icon-button-outlined-color-bg-dark-default);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:hover{background:var(--ids-comp-icon-button-outlined-color-bg-dark-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:focus{background:var(--ids-comp-icon-button-outlined-color-bg-dark-focused);color:var(--ids-comp-icon-button-outlined-color-fg-dark-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:active{background:var(--ids-comp-icon-button-outlined-color-bg-dark-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-dark-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-dark:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-dark-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-dark-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-dark-disabled)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface{color:var(--ids-comp-icon-button-outlined-color-fg-surface-default);background:var(--ids-comp-icon-button-outlined-color-bg-surface-default);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-default)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:hover{background:var(--ids-comp-icon-button-outlined-color-bg-surface-hovered);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-hovered)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:focus{background:var(--ids-comp-icon-button-outlined-color-bg-surface-focused);color:var(--ids-comp-icon-button-outlined-color-fg-surface-focused);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-focused)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:active{background:var(--ids-comp-icon-button-outlined-color-bg-surface-pressed);color:var(--ids-comp-icon-button-outlined-color-fg-surface-pressed);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-pressed)}.ids-icon-button.ids-icon-button-outlined.ids-icon-button-surface:disabled{background:var(--ids-comp-icon-button-outlined-color-bg-surface-disabled);color:var(--ids-comp-icon-button-outlined-color-fg-surface-disabled);border-color:var(--ids-comp-icon-button-outlined-color-border-surface-disabled)}.ids-icon-button.ids-icon-button-standard{border:none}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary{color:var(--ids-comp-icon-button-standard-color-fg-primary-default);background:var(--ids-comp-icon-button-standard-color-bg-primary-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:hover{background:var(--ids-comp-icon-button-standard-color-bg-primary-hovered);color:var(--ids-comp-icon-button-standard-color-fg-primary-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:focus{background:var(--ids-comp-icon-button-standard-color-bg-primary-focused);color:var(--ids-comp-icon-button-standard-color-fg-primary-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:active{background:var(--ids-comp-icon-button-standard-color-bg-primary-pressed);color:var(--ids-comp-icon-button-standard-color-fg-primary-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-primary:disabled{background:var(--ids-comp-icon-button-standard-color-bg-primary-disabled);color:var(--ids-comp-icon-button-standard-color-fg-primary-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary{color:var(--ids-comp-icon-button-standard-color-fg-secondary-default);background:var(--ids-comp-icon-button-standard-color-bg-secondary-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:hover{background:var(--ids-comp-icon-button-standard-color-bg-secondary-hovered);color:var(--ids-comp-icon-button-standard-color-fg-secondary-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:focus{background:var(--ids-comp-icon-button-standard-color-bg-secondary-focused);color:var(--ids-comp-icon-button-standard-color-fg-secondary-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:active{background:var(--ids-comp-icon-button-standard-color-bg-secondary-pressed);color:var(--ids-comp-icon-button-standard-color-fg-secondary-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-secondary:disabled{background:var(--ids-comp-icon-button-standard-color-bg-secondary-disabled);color:var(--ids-comp-icon-button-standard-color-fg-secondary-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand{color:var(--ids-comp-icon-button-standard-color-fg-brand-default);background:var(--ids-comp-icon-button-standard-color-bg-brand-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:hover{background:var(--ids-comp-icon-button-standard-color-bg-brand-hovered);color:var(--ids-comp-icon-button-standard-color-fg-brand-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:focus{background:var(--ids-comp-icon-button-standard-color-bg-brand-focused);color:var(--ids-comp-icon-button-standard-color-fg-brand-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:active{background:var(--ids-comp-icon-button-standard-color-bg-brand-pressed);color:var(--ids-comp-icon-button-standard-color-fg-brand-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-brand:disabled{background:var(--ids-comp-icon-button-standard-color-bg-brand-disabled);color:var(--ids-comp-icon-button-standard-color-fg-brand-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error{color:var(--ids-comp-icon-button-standard-color-fg-error-default);background:var(--ids-comp-icon-button-standard-color-bg-error-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error:hover{background:var(--ids-comp-icon-button-standard-color-bg-error-hovered);color:var(--ids-comp-icon-button-standard-color-fg-error-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error:focus{background:var(--ids-comp-icon-button-standard-color-bg-error-focused);color:var(--ids-comp-icon-button-standard-color-fg-error-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-error:active{background:var(--ids-comp-icon-button-standard-color-bg-error-pressed);color:var(--ids-comp-icon-button-standard-color-fg-error-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success{color:var(--ids-comp-icon-button-standard-color-fg-success-default);background:var(--ids-comp-icon-button-standard-color-bg-success-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success:hover{background:var(--ids-comp-icon-button-standard-color-bg-success-hovered);color:var(--ids-comp-icon-button-standard-color-fg-success-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success:focus{background:var(--ids-comp-icon-button-standard-color-bg-success-focused);color:var(--ids-comp-icon-button-standard-color-fg-success-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-success:active{background:var(--ids-comp-icon-button-standard-color-bg-success-pressed);color:var(--ids-comp-icon-button-standard-color-fg-success-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning{color:var(--ids-comp-icon-button-standard-color-fg-warning-default);background:var(--ids-comp-icon-button-standard-color-bg-warning-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:hover{background:var(--ids-comp-icon-button-standard-color-bg-warning-hovered);color:var(--ids-comp-icon-button-standard-color-fg-warning-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:focus{background:var(--ids-comp-icon-button-standard-color-bg-warning-focused);color:var(--ids-comp-icon-button-standard-color-fg-warning-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-warning:active{background:var(--ids-comp-icon-button-standard-color-bg-warning-pressed);color:var(--ids-comp-icon-button-standard-color-fg-warning-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light{color:var(--ids-comp-icon-button-standard-color-fg-light-default);background:var(--ids-comp-icon-button-standard-color-bg-light-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:hover{background:var(--ids-comp-icon-button-standard-color-bg-light-hovered);color:var(--ids-comp-icon-button-standard-color-fg-light-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:focus{background:var(--ids-comp-icon-button-standard-color-bg-light-focused);color:var(--ids-comp-icon-button-standard-color-fg-light-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:active{background:var(--ids-comp-icon-button-standard-color-bg-light-pressed);color:var(--ids-comp-icon-button-standard-color-fg-light-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-light:disabled{background:var(--ids-comp-icon-button-standard-color-bg-light-disabled);color:var(--ids-comp-icon-button-standard-color-fg-light-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark{color:var(--ids-comp-icon-button-standard-color-fg-dark-default);background:var(--ids-comp-icon-button-standard-color-bg-dark-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:hover{background:var(--ids-comp-icon-button-standard-color-bg-dark-hovered);color:var(--ids-comp-icon-button-standard-color-fg-dark-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:focus{background:var(--ids-comp-icon-button-standard-color-bg-dark-focused);color:var(--ids-comp-icon-button-standard-color-fg-dark-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:active{background:var(--ids-comp-icon-button-standard-color-bg-dark-pressed);color:var(--ids-comp-icon-button-standard-color-fg-dark-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-dark:disabled{background:var(--ids-comp-icon-button-standard-color-bg-dark-disabled);color:var(--ids-comp-icon-button-standard-color-fg-dark-disabled)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface{color:var(--ids-comp-icon-button-standard-color-fg-surface-default);background:var(--ids-comp-icon-button-standard-color-bg-surface-default)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:hover{background:var(--ids-comp-icon-button-standard-color-bg-surface-hovered);color:var(--ids-comp-icon-button-standard-color-fg-surface-hovered)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:focus{background:var(--ids-comp-icon-button-standard-color-bg-surface-focused);color:var(--ids-comp-icon-button-standard-color-fg-surface-focused)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:active{background:var(--ids-comp-icon-button-standard-color-bg-surface-pressed);color:var(--ids-comp-icon-button-standard-color-fg-surface-pressed)}.ids-icon-button.ids-icon-button-standard.ids-icon-button-surface:disabled{background:var(--ids-comp-icon-button-standard-color-bg-surface-disabled);color:var(--ids-comp-icon-button-standard-color-fg-surface-disabled)}