@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/card/card.plugin.js CHANGED
@@ -2,7 +2,7 @@
2
2
  module.exports = function CardPlugin() {
3
3
  return function ({ addComponents }) {
4
4
  const cssObj = {
5
- '.ids-card': { display: 'flex', borderStyle: 'solid' },
5
+ '.ids-card': { display: 'flex', borderStyle: 'solid', boxSizing: 'border-box' },
6
6
  '.ids-card.ids-card-clickable': { pointerEvents: 'auto', cursor: 'pointer' },
7
7
  '.ids-card.ids-card-clickable:focus': {
8
8
  outlineOffset: '2px',
@@ -67,185 +67,181 @@ module.exports = function CardPlugin() {
67
67
  },
68
68
  '.ids-card.ids-card-compact.ids-card-horizontal': {
69
69
  padding:
70
- 'var(--ids-comp-size-card-container-horizontal-size-padding-y-compact) var(--ids-comp-size-card-container-horizontal-size-padding-x-compact)',
71
- gap: 'var(--ids-comp-size-card-container-horizontal-size-gap-compact)',
72
- borderRadius: 'var(--ids-comp-size-card-container-horizontal-size-border-radius-compact)',
70
+ 'var(--ids-comp-card-container-horizontal-size-padding-y-compact) var(--ids-comp-card-container-horizontal-size-padding-x-compact)',
71
+ gap: 'var(--ids-comp-card-container-horizontal-size-gap-compact)',
72
+ borderRadius: 'var(--ids-comp-card-container-horizontal-size-border-radius-compact)',
73
73
  },
74
74
  '.ids-card.ids-card-compact.ids-card-horizontal.ids-card-outlined': {
75
- borderWidth: 'var(--ids-comp-size-card-container-horizontal-size-border-width-compact)',
75
+ borderWidth: 'var(--ids-comp-card-container-horizontal-size-border-width-compact)',
76
76
  },
77
77
  '.ids-card.ids-card-compact.ids-card-vertical': {
78
78
  padding:
79
- 'var(--ids-comp-size-card-container-vertical-size-padding-y-compact) var(--ids-comp-size-card-container-vertical-size-padding-x-compact)',
80
- gap: 'var(--ids-comp-size-card-container-vertical-size-gap-compact)',
81
- borderRadius: 'var(--ids-comp-size-card-container-vertical-size-border-radius-compact)',
79
+ 'var(--ids-comp-card-container-vertical-size-padding-y-compact) var(--ids-comp-card-container-vertical-size-padding-x-compact)',
80
+ gap: 'var(--ids-comp-card-container-vertical-size-gap-compact)',
81
+ borderRadius: 'var(--ids-comp-card-container-vertical-size-border-radius-compact)',
82
82
  },
83
83
  '.ids-card.ids-card-compact.ids-card-vertical.ids-card-outlined': {
84
- borderWidth: 'var(--ids-comp-size-card-container-vertical-size-border-width-compact)',
84
+ borderWidth: 'var(--ids-comp-card-container-vertical-size-border-width-compact)',
85
85
  },
86
- '.ids-card.ids-card-compact.ids-card-clickable:focus': { outlineWidth: 'var(--ids-comp-size-card-focused-outline-outline-compact)' },
86
+ '.ids-card.ids-card-compact.ids-card-clickable:focus': { outlineWidth: 'var(--ids-comp-card-focused-outline-outline-compact)' },
87
87
  '.ids-card.ids-card-compact .ids-card-header-headline': {
88
- gap: 'var(--ids-comp-size-card-header-headline-gap-compact)',
89
- padding: 'var(--ids-comp-size-card-header-headline-padding-y-compact) var(--ids-comp-size-card-header-headline-padding-x-compact)',
88
+ gap: 'var(--ids-comp-card-header-headline-gap-compact)',
89
+ padding: 'var(--ids-comp-card-header-headline-padding-y-compact) var(--ids-comp-card-header-headline-padding-x-compact)',
90
90
  },
91
91
  '.ids-card.ids-card-compact.ids-card-vertical .ids-card-section:not(.ids-card-media):first-child': {
92
- paddingTop: 'var(--ids-comp-size-card-slot-size-padding-top-compact)',
92
+ paddingTop: 'var(--ids-comp-card-slot-size-padding-top-compact)',
93
93
  },
94
94
  '.ids-card.ids-card-compact.ids-card-vertical .ids-card-section:not(.ids-card-media):last-child': {
95
- paddingBottom: 'var(--ids-comp-size-card-slot-size-padding-bottom-compact)',
95
+ paddingBottom: 'var(--ids-comp-card-slot-size-padding-bottom-compact)',
96
96
  },
97
97
  '.ids-card.ids-card-compact.ids-card-vertical .ids-card-section.ids-card-section-padded': {
98
- paddingLeft: 'var(--ids-comp-size-card-slot-size-padding-x-compact)',
99
- paddingRight: 'var(--ids-comp-size-card-slot-size-padding-x-compact)',
98
+ paddingLeft: 'var(--ids-comp-card-slot-size-padding-x-compact)',
99
+ paddingRight: 'var(--ids-comp-card-slot-size-padding-x-compact)',
100
100
  },
101
101
  '.ids-card.ids-card-compact.ids-card-horizontal .ids-card-section:not(.ids-card-media):first-child': {
102
- paddingLeft: 'var(--ids-comp-size-card-slot-size-padding-top-compact)',
102
+ paddingLeft: 'var(--ids-comp-card-slot-size-padding-top-compact)',
103
103
  },
104
104
  '.ids-card.ids-card-compact.ids-card-horizontal .ids-card-section:not(.ids-card-media):last-child': {
105
- paddingRight: 'var(--ids-comp-size-card-slot-size-padding-bottom-compact)',
105
+ paddingRight: 'var(--ids-comp-card-slot-size-padding-bottom-compact)',
106
106
  },
107
107
  '.ids-card.ids-card-compact.ids-card-horizontal .ids-card-section.ids-card-section-padded': {
108
- paddingTop: 'var(--ids-comp-size-card-slot-size-padding-x-compact)',
109
- paddingBottom: 'var(--ids-comp-size-card-slot-size-padding-x-compact)',
108
+ paddingTop: 'var(--ids-comp-card-slot-size-padding-x-compact)',
109
+ paddingBottom: 'var(--ids-comp-card-slot-size-padding-x-compact)',
110
110
  },
111
111
  '.ids-card.ids-card-comfortable.ids-card-horizontal': {
112
112
  padding:
113
- 'var(--ids-comp-size-card-container-horizontal-size-padding-y-comfortable) var(--ids-comp-size-card-container-horizontal-size-padding-x-comfortable)',
114
- gap: 'var(--ids-comp-size-card-container-horizontal-size-gap-comfortable)',
115
- borderRadius: 'var(--ids-comp-size-card-container-horizontal-size-border-radius-comfortable)',
113
+ 'var(--ids-comp-card-container-horizontal-size-padding-y-comfortable) var(--ids-comp-card-container-horizontal-size-padding-x-comfortable)',
114
+ gap: 'var(--ids-comp-card-container-horizontal-size-gap-comfortable)',
115
+ borderRadius: 'var(--ids-comp-card-container-horizontal-size-border-radius-comfortable)',
116
116
  },
117
117
  '.ids-card.ids-card-comfortable.ids-card-horizontal.ids-card-outlined': {
118
- borderWidth: 'var(--ids-comp-size-card-container-horizontal-size-border-width-comfortable)',
118
+ borderWidth: 'var(--ids-comp-card-container-horizontal-size-border-width-comfortable)',
119
119
  },
120
120
  '.ids-card.ids-card-comfortable.ids-card-vertical': {
121
121
  padding:
122
- 'var(--ids-comp-size-card-container-vertical-size-padding-y-comfortable) var(--ids-comp-size-card-container-vertical-size-padding-x-comfortable)',
123
- gap: 'var(--ids-comp-size-card-container-vertical-size-gap-comfortable)',
124
- borderRadius: 'var(--ids-comp-size-card-container-vertical-size-border-radius-comfortable)',
122
+ 'var(--ids-comp-card-container-vertical-size-padding-y-comfortable) var(--ids-comp-card-container-vertical-size-padding-x-comfortable)',
123
+ gap: 'var(--ids-comp-card-container-vertical-size-gap-comfortable)',
124
+ borderRadius: 'var(--ids-comp-card-container-vertical-size-border-radius-comfortable)',
125
125
  },
126
126
  '.ids-card.ids-card-comfortable.ids-card-vertical.ids-card-outlined': {
127
- borderWidth: 'var(--ids-comp-size-card-container-vertical-size-border-width-comfortable)',
127
+ borderWidth: 'var(--ids-comp-card-container-vertical-size-border-width-comfortable)',
128
128
  },
129
129
  '.ids-card.ids-card-comfortable.ids-card-clickable:focus': {
130
- outlineWidth: 'var(--ids-comp-size-card-focused-outline-outline-comfortable)',
130
+ outlineWidth: 'var(--ids-comp-card-focused-outline-outline-comfortable)',
131
131
  },
132
132
  '.ids-card.ids-card-comfortable .ids-card-header-headline': {
133
- gap: 'var(--ids-comp-size-card-header-headline-gap-comfortable)',
134
- padding:
135
- 'var(--ids-comp-size-card-header-headline-padding-y-comfortable) var(--ids-comp-size-card-header-headline-padding-x-comfortable)',
133
+ gap: 'var(--ids-comp-card-header-headline-gap-comfortable)',
134
+ padding: 'var(--ids-comp-card-header-headline-padding-y-comfortable) var(--ids-comp-card-header-headline-padding-x-comfortable)',
136
135
  },
137
136
  '.ids-card.ids-card-comfortable.ids-card-vertical .ids-card-section:not(.ids-card-media):first-child': {
138
- paddingTop: 'var(--ids-comp-size-card-slot-size-padding-top-comfortable)',
137
+ paddingTop: 'var(--ids-comp-card-slot-size-padding-top-comfortable)',
139
138
  },
140
139
  '.ids-card.ids-card-comfortable.ids-card-vertical .ids-card-section:not(.ids-card-media):last-child': {
141
- paddingBottom: 'var(--ids-comp-size-card-slot-size-padding-bottom-comfortable)',
140
+ paddingBottom: 'var(--ids-comp-card-slot-size-padding-bottom-comfortable)',
142
141
  },
143
142
  '.ids-card.ids-card-comfortable.ids-card-vertical .ids-card-section.ids-card-section-padded': {
144
- paddingLeft: 'var(--ids-comp-size-card-slot-size-padding-x-comfortable)',
145
- paddingRight: 'var(--ids-comp-size-card-slot-size-padding-x-comfortable)',
143
+ paddingLeft: 'var(--ids-comp-card-slot-size-padding-x-comfortable)',
144
+ paddingRight: 'var(--ids-comp-card-slot-size-padding-x-comfortable)',
146
145
  },
147
146
  '.ids-card.ids-card-comfortable.ids-card-horizontal .ids-card-section:not(.ids-card-media):first-child': {
148
- paddingLeft: 'var(--ids-comp-size-card-slot-size-padding-top-comfortable)',
147
+ paddingLeft: 'var(--ids-comp-card-slot-size-padding-top-comfortable)',
149
148
  },
150
149
  '.ids-card.ids-card-comfortable.ids-card-horizontal .ids-card-section:not(.ids-card-media):last-child': {
151
- paddingRight: 'var(--ids-comp-size-card-slot-size-padding-bottom-comfortable)',
150
+ paddingRight: 'var(--ids-comp-card-slot-size-padding-bottom-comfortable)',
152
151
  },
153
152
  '.ids-card.ids-card-comfortable.ids-card-horizontal .ids-card-section.ids-card-section-padded': {
154
- paddingTop: 'var(--ids-comp-size-card-slot-size-padding-x-comfortable)',
155
- paddingBottom: 'var(--ids-comp-size-card-slot-size-padding-x-comfortable)',
153
+ paddingTop: 'var(--ids-comp-card-slot-size-padding-x-comfortable)',
154
+ paddingBottom: 'var(--ids-comp-card-slot-size-padding-x-comfortable)',
156
155
  },
157
156
  '.ids-card.ids-card-spacious.ids-card-horizontal': {
158
157
  padding:
159
- 'var(--ids-comp-size-card-container-horizontal-size-padding-y-spacious) var(--ids-comp-size-card-container-horizontal-size-padding-x-spacious)',
160
- gap: 'var(--ids-comp-size-card-container-horizontal-size-gap-spacious)',
161
- borderRadius: 'var(--ids-comp-size-card-container-horizontal-size-border-radius-spacious)',
158
+ 'var(--ids-comp-card-container-horizontal-size-padding-y-spacious) var(--ids-comp-card-container-horizontal-size-padding-x-spacious)',
159
+ gap: 'var(--ids-comp-card-container-horizontal-size-gap-spacious)',
160
+ borderRadius: 'var(--ids-comp-card-container-horizontal-size-border-radius-spacious)',
162
161
  },
163
162
  '.ids-card.ids-card-spacious.ids-card-horizontal.ids-card-outlined': {
164
- borderWidth: 'var(--ids-comp-size-card-container-horizontal-size-border-width-spacious)',
163
+ borderWidth: 'var(--ids-comp-card-container-horizontal-size-border-width-spacious)',
165
164
  },
166
165
  '.ids-card.ids-card-spacious.ids-card-vertical': {
167
166
  padding:
168
- 'var(--ids-comp-size-card-container-vertical-size-padding-y-spacious) var(--ids-comp-size-card-container-vertical-size-padding-x-spacious)',
169
- gap: 'var(--ids-comp-size-card-container-vertical-size-gap-spacious)',
170
- borderRadius: 'var(--ids-comp-size-card-container-vertical-size-border-radius-spacious)',
167
+ 'var(--ids-comp-card-container-vertical-size-padding-y-spacious) var(--ids-comp-card-container-vertical-size-padding-x-spacious)',
168
+ gap: 'var(--ids-comp-card-container-vertical-size-gap-spacious)',
169
+ borderRadius: 'var(--ids-comp-card-container-vertical-size-border-radius-spacious)',
171
170
  },
172
171
  '.ids-card.ids-card-spacious.ids-card-vertical.ids-card-outlined': {
173
- borderWidth: 'var(--ids-comp-size-card-container-vertical-size-border-width-spacious)',
174
- },
175
- '.ids-card.ids-card-spacious.ids-card-clickable:focus': {
176
- outlineWidth: 'var(--ids-comp-size-card-focused-outline-outline-spacious)',
172
+ borderWidth: 'var(--ids-comp-card-container-vertical-size-border-width-spacious)',
177
173
  },
174
+ '.ids-card.ids-card-spacious.ids-card-clickable:focus': { outlineWidth: 'var(--ids-comp-card-focused-outline-outline-spacious)' },
178
175
  '.ids-card.ids-card-spacious .ids-card-header-headline': {
179
- gap: 'var(--ids-comp-size-card-header-headline-gap-spacious)',
180
- padding:
181
- 'var(--ids-comp-size-card-header-headline-padding-y-spacious) var(--ids-comp-size-card-header-headline-padding-x-spacious)',
176
+ gap: 'var(--ids-comp-card-header-headline-gap-spacious)',
177
+ padding: 'var(--ids-comp-card-header-headline-padding-y-spacious) var(--ids-comp-card-header-headline-padding-x-spacious)',
182
178
  },
183
179
  '.ids-card.ids-card-spacious.ids-card-vertical .ids-card-section:not(.ids-card-media):first-child': {
184
- paddingTop: 'var(--ids-comp-size-card-slot-size-padding-top-spacious)',
180
+ paddingTop: 'var(--ids-comp-card-slot-size-padding-top-spacious)',
185
181
  },
186
182
  '.ids-card.ids-card-spacious.ids-card-vertical .ids-card-section:not(.ids-card-media):last-child': {
187
- paddingBottom: 'var(--ids-comp-size-card-slot-size-padding-bottom-spacious)',
183
+ paddingBottom: 'var(--ids-comp-card-slot-size-padding-bottom-spacious)',
188
184
  },
189
185
  '.ids-card.ids-card-spacious.ids-card-vertical .ids-card-section.ids-card-section-padded': {
190
- paddingLeft: 'var(--ids-comp-size-card-slot-size-padding-x-spacious)',
191
- paddingRight: 'var(--ids-comp-size-card-slot-size-padding-x-spacious)',
186
+ paddingLeft: 'var(--ids-comp-card-slot-size-padding-x-spacious)',
187
+ paddingRight: 'var(--ids-comp-card-slot-size-padding-x-spacious)',
192
188
  },
193
189
  '.ids-card.ids-card-spacious.ids-card-horizontal .ids-card-section:not(.ids-card-media):first-child': {
194
- paddingLeft: 'var(--ids-comp-size-card-slot-size-padding-top-spacious)',
190
+ paddingLeft: 'var(--ids-comp-card-slot-size-padding-top-spacious)',
195
191
  },
196
192
  '.ids-card.ids-card-spacious.ids-card-horizontal .ids-card-section:not(.ids-card-media):last-child': {
197
- paddingRight: 'var(--ids-comp-size-card-slot-size-padding-bottom-spacious)',
193
+ paddingRight: 'var(--ids-comp-card-slot-size-padding-bottom-spacious)',
198
194
  },
199
195
  '.ids-card.ids-card-spacious.ids-card-horizontal .ids-card-section.ids-card-section-padded': {
200
- paddingTop: 'var(--ids-comp-size-card-slot-size-padding-x-spacious)',
201
- paddingBottom: 'var(--ids-comp-size-card-slot-size-padding-x-spacious)',
196
+ paddingTop: 'var(--ids-comp-card-slot-size-padding-x-spacious)',
197
+ paddingBottom: 'var(--ids-comp-card-slot-size-padding-x-spacious)',
202
198
  },
203
199
  '.ids-card.ids-card-dense.ids-card-horizontal': {
204
200
  padding:
205
- 'var(--ids-comp-size-card-container-horizontal-size-padding-y-dense) var(--ids-comp-size-card-container-horizontal-size-padding-x-dense)',
206
- gap: 'var(--ids-comp-size-card-container-horizontal-size-gap-dense)',
207
- borderRadius: 'var(--ids-comp-size-card-container-horizontal-size-border-radius-dense)',
201
+ 'var(--ids-comp-card-container-horizontal-size-padding-y-dense) var(--ids-comp-card-container-horizontal-size-padding-x-dense)',
202
+ gap: 'var(--ids-comp-card-container-horizontal-size-gap-dense)',
203
+ borderRadius: 'var(--ids-comp-card-container-horizontal-size-border-radius-dense)',
208
204
  },
209
205
  '.ids-card.ids-card-dense.ids-card-horizontal.ids-card-outlined': {
210
- borderWidth: 'var(--ids-comp-size-card-container-horizontal-size-border-width-dense)',
206
+ borderWidth: 'var(--ids-comp-card-container-horizontal-size-border-width-dense)',
211
207
  },
212
208
  '.ids-card.ids-card-dense.ids-card-vertical': {
213
209
  padding:
214
- 'var(--ids-comp-size-card-container-vertical-size-padding-y-dense) var(--ids-comp-size-card-container-vertical-size-padding-x-dense)',
215
- gap: 'var(--ids-comp-size-card-container-vertical-size-gap-dense)',
216
- borderRadius: 'var(--ids-comp-size-card-container-vertical-size-border-radius-dense)',
210
+ 'var(--ids-comp-card-container-vertical-size-padding-y-dense) var(--ids-comp-card-container-vertical-size-padding-x-dense)',
211
+ gap: 'var(--ids-comp-card-container-vertical-size-gap-dense)',
212
+ borderRadius: 'var(--ids-comp-card-container-vertical-size-border-radius-dense)',
217
213
  },
218
214
  '.ids-card.ids-card-dense.ids-card-vertical.ids-card-outlined': {
219
- borderWidth: 'var(--ids-comp-size-card-container-vertical-size-border-width-dense)',
215
+ borderWidth: 'var(--ids-comp-card-container-vertical-size-border-width-dense)',
220
216
  },
221
- '.ids-card.ids-card-dense.ids-card-clickable:focus': { outlineWidth: 'var(--ids-comp-size-card-focused-outline-outline-dense)' },
217
+ '.ids-card.ids-card-dense.ids-card-clickable:focus': { outlineWidth: 'var(--ids-comp-card-focused-outline-outline-dense)' },
222
218
  '.ids-card.ids-card-dense .ids-card-header-headline': {
223
- gap: 'var(--ids-comp-size-card-header-headline-gap-dense)',
224
- padding: 'var(--ids-comp-size-card-header-headline-padding-y-dense) var(--ids-comp-size-card-header-headline-padding-x-dense)',
219
+ gap: 'var(--ids-comp-card-header-headline-gap-dense)',
220
+ padding: 'var(--ids-comp-card-header-headline-padding-y-dense) var(--ids-comp-card-header-headline-padding-x-dense)',
225
221
  },
226
222
  '.ids-card.ids-card-dense.ids-card-vertical .ids-card-section:not(.ids-card-media):first-child': {
227
- paddingTop: 'var(--ids-comp-size-card-slot-size-padding-top-dense)',
223
+ paddingTop: 'var(--ids-comp-card-slot-size-padding-top-dense)',
228
224
  },
229
225
  '.ids-card.ids-card-dense.ids-card-vertical .ids-card-section:not(.ids-card-media):last-child': {
230
- paddingBottom: 'var(--ids-comp-size-card-slot-size-padding-bottom-dense)',
226
+ paddingBottom: 'var(--ids-comp-card-slot-size-padding-bottom-dense)',
231
227
  },
232
228
  '.ids-card.ids-card-dense.ids-card-vertical .ids-card-section.ids-card-section-padded': {
233
- paddingLeft: 'var(--ids-comp-size-card-slot-size-padding-x-dense)',
234
- paddingRight: 'var(--ids-comp-size-card-slot-size-padding-x-dense)',
229
+ paddingLeft: 'var(--ids-comp-card-slot-size-padding-x-dense)',
230
+ paddingRight: 'var(--ids-comp-card-slot-size-padding-x-dense)',
235
231
  },
236
232
  '.ids-card.ids-card-dense.ids-card-horizontal .ids-card-section:not(.ids-card-media):first-child': {
237
- paddingLeft: 'var(--ids-comp-size-card-slot-size-padding-top-dense)',
233
+ paddingLeft: 'var(--ids-comp-card-slot-size-padding-top-dense)',
238
234
  },
239
235
  '.ids-card.ids-card-dense.ids-card-horizontal .ids-card-section:not(.ids-card-media):last-child': {
240
- paddingRight: 'var(--ids-comp-size-card-slot-size-padding-bottom-dense)',
236
+ paddingRight: 'var(--ids-comp-card-slot-size-padding-bottom-dense)',
241
237
  },
242
238
  '.ids-card.ids-card-dense.ids-card-horizontal .ids-card-section.ids-card-section-padded': {
243
- paddingTop: 'var(--ids-comp-size-card-slot-size-padding-x-dense)',
244
- paddingBottom: 'var(--ids-comp-size-card-slot-size-padding-x-dense)',
239
+ paddingTop: 'var(--ids-comp-card-slot-size-padding-x-dense)',
240
+ paddingBottom: 'var(--ids-comp-card-slot-size-padding-x-dense)',
245
241
  },
246
242
  '.ids-card.ids-card-filled.ids-card-primary': {
247
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-primary-enabled)',
248
- borderColor: 'var(--ids-comp-card-filled-color-border-primary-enabled)',
243
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-primary-default)',
244
+ borderColor: 'var(--ids-comp-card-filled-color-border-primary-default)',
249
245
  },
250
246
  '.ids-card.ids-card-filled.ids-card-primary.ids-card-clickable:hover': {
251
247
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-primary-hovered)',
@@ -264,8 +260,8 @@ module.exports = function CardPlugin() {
264
260
  borderColor: 'var(--ids-comp-card-filled-color-border-primary-disabled)',
265
261
  },
266
262
  '.ids-card.ids-card-filled.ids-card-secondary': {
267
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-secondary-enabled)',
268
- borderColor: 'var(--ids-comp-card-filled-color-border-secondary-enabled)',
263
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-secondary-default)',
264
+ borderColor: 'var(--ids-comp-card-filled-color-border-secondary-default)',
269
265
  },
270
266
  '.ids-card.ids-card-filled.ids-card-secondary.ids-card-clickable:hover': {
271
267
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-secondary-hovered)',
@@ -284,8 +280,8 @@ module.exports = function CardPlugin() {
284
280
  borderColor: 'var(--ids-comp-card-filled-color-border-secondary-disabled)',
285
281
  },
286
282
  '.ids-card.ids-card-filled.ids-card-brand': {
287
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-brand-enabled)',
288
- borderColor: 'var(--ids-comp-card-filled-color-border-brand-enabled)',
283
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-brand-default)',
284
+ borderColor: 'var(--ids-comp-card-filled-color-border-brand-default)',
289
285
  },
290
286
  '.ids-card.ids-card-filled.ids-card-brand.ids-card-clickable:hover': {
291
287
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-brand-hovered)',
@@ -304,8 +300,8 @@ module.exports = function CardPlugin() {
304
300
  borderColor: 'var(--ids-comp-card-filled-color-border-brand-disabled)',
305
301
  },
306
302
  '.ids-card.ids-card-filled.ids-card-error': {
307
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-error-enabled)',
308
- borderColor: 'var(--ids-comp-card-filled-color-border-error-enabled)',
303
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-error-default)',
304
+ borderColor: 'var(--ids-comp-card-filled-color-border-error-default)',
309
305
  },
310
306
  '.ids-card.ids-card-filled.ids-card-error.ids-card-clickable:hover': {
311
307
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-error-hovered)',
@@ -319,13 +315,9 @@ module.exports = function CardPlugin() {
319
315
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-error-pressed)',
320
316
  borderColor: 'var(--ids-comp-card-filled-color-border-error-pressed)',
321
317
  },
322
- '.ids-card.ids-card-filled.ids-card-error.ids-card-clickable.ids-card-disabled': {
323
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-error-disabled)',
324
- borderColor: 'var(--ids-comp-card-filled-color-border-error-disabled)',
325
- },
326
318
  '.ids-card.ids-card-filled.ids-card-success': {
327
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-success-enabled)',
328
- borderColor: 'var(--ids-comp-card-filled-color-border-success-enabled)',
319
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-success-default)',
320
+ borderColor: 'var(--ids-comp-card-filled-color-border-success-default)',
329
321
  },
330
322
  '.ids-card.ids-card-filled.ids-card-success.ids-card-clickable:hover': {
331
323
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-success-hovered)',
@@ -339,13 +331,9 @@ module.exports = function CardPlugin() {
339
331
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-success-pressed)',
340
332
  borderColor: 'var(--ids-comp-card-filled-color-border-success-pressed)',
341
333
  },
342
- '.ids-card.ids-card-filled.ids-card-success.ids-card-clickable.ids-card-disabled': {
343
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-success-disabled)',
344
- borderColor: 'var(--ids-comp-card-filled-color-border-success-disabled)',
345
- },
346
334
  '.ids-card.ids-card-filled.ids-card-warning': {
347
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-warning-enabled)',
348
- borderColor: 'var(--ids-comp-card-filled-color-border-warning-enabled)',
335
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-warning-default)',
336
+ borderColor: 'var(--ids-comp-card-filled-color-border-warning-default)',
349
337
  },
350
338
  '.ids-card.ids-card-filled.ids-card-warning.ids-card-clickable:hover': {
351
339
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-warning-hovered)',
@@ -359,13 +347,9 @@ module.exports = function CardPlugin() {
359
347
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-warning-pressed)',
360
348
  borderColor: 'var(--ids-comp-card-filled-color-border-warning-pressed)',
361
349
  },
362
- '.ids-card.ids-card-filled.ids-card-warning.ids-card-clickable.ids-card-disabled': {
363
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-warning-disabled)',
364
- borderColor: 'var(--ids-comp-card-filled-color-border-warning-disabled)',
365
- },
366
350
  '.ids-card.ids-card-filled.ids-card-info': {
367
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-info-enabled)',
368
- borderColor: 'var(--ids-comp-card-filled-color-border-info-enabled)',
351
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-info-default)',
352
+ borderColor: 'var(--ids-comp-card-filled-color-border-info-default)',
369
353
  },
370
354
  '.ids-card.ids-card-filled.ids-card-info.ids-card-clickable:hover': {
371
355
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-info-hovered)',
@@ -379,13 +363,9 @@ module.exports = function CardPlugin() {
379
363
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-info-pressed)',
380
364
  borderColor: 'var(--ids-comp-card-filled-color-border-info-pressed)',
381
365
  },
382
- '.ids-card.ids-card-filled.ids-card-info.ids-card-clickable.ids-card-disabled': {
383
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-info-disabled)',
384
- borderColor: 'var(--ids-comp-card-filled-color-border-info-disabled)',
385
- },
386
366
  '.ids-card.ids-card-filled.ids-card-light': {
387
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-light-enabled)',
388
- borderColor: 'var(--ids-comp-card-filled-color-border-light-enabled)',
367
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-light-default)',
368
+ borderColor: 'var(--ids-comp-card-filled-color-border-light-default)',
389
369
  },
390
370
  '.ids-card.ids-card-filled.ids-card-light.ids-card-clickable:hover': {
391
371
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-light-hovered)',
@@ -404,8 +384,8 @@ module.exports = function CardPlugin() {
404
384
  borderColor: 'var(--ids-comp-card-filled-color-border-light-disabled)',
405
385
  },
406
386
  '.ids-card.ids-card-filled.ids-card-dark': {
407
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-dark-enabled)',
408
- borderColor: 'var(--ids-comp-card-filled-color-border-dark-enabled)',
387
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-dark-default)',
388
+ borderColor: 'var(--ids-comp-card-filled-color-border-dark-default)',
409
389
  },
410
390
  '.ids-card.ids-card-filled.ids-card-dark.ids-card-clickable:hover': {
411
391
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-dark-hovered)',
@@ -424,8 +404,8 @@ module.exports = function CardPlugin() {
424
404
  borderColor: 'var(--ids-comp-card-filled-color-border-dark-disabled)',
425
405
  },
426
406
  '.ids-card.ids-card-filled.ids-card-surface': {
427
- backgroundColor: 'var(--ids-comp-card-filled-color-bg-surface-enabled)',
428
- borderColor: 'var(--ids-comp-card-filled-color-border-surface-enabled)',
407
+ backgroundColor: 'var(--ids-comp-card-filled-color-bg-surface-default)',
408
+ borderColor: 'var(--ids-comp-card-filled-color-border-surface-default)',
429
409
  },
430
410
  '.ids-card.ids-card-filled.ids-card-surface.ids-card-clickable:hover': {
431
411
  backgroundColor: 'var(--ids-comp-card-filled-color-bg-surface-hovered)',
@@ -444,8 +424,8 @@ module.exports = function CardPlugin() {
444
424
  borderColor: 'var(--ids-comp-card-filled-color-border-surface-disabled)',
445
425
  },
446
426
  '.ids-card.ids-card-outlined.ids-card-primary': {
447
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-primary-enabled)',
448
- borderColor: 'var(--ids-comp-card-outlined-color-border-primary-enabled)',
427
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-primary-default)',
428
+ borderColor: 'var(--ids-comp-card-outlined-color-border-primary-default)',
449
429
  },
450
430
  '.ids-card.ids-card-outlined.ids-card-primary.ids-card-clickable:hover': {
451
431
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-primary-hovered)',
@@ -464,8 +444,8 @@ module.exports = function CardPlugin() {
464
444
  borderColor: 'var(--ids-comp-card-outlined-color-border-primary-disabled)',
465
445
  },
466
446
  '.ids-card.ids-card-outlined.ids-card-secondary': {
467
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-secondary-enabled)',
468
- borderColor: 'var(--ids-comp-card-outlined-color-border-secondary-enabled)',
447
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-secondary-default)',
448
+ borderColor: 'var(--ids-comp-card-outlined-color-border-secondary-default)',
469
449
  },
470
450
  '.ids-card.ids-card-outlined.ids-card-secondary.ids-card-clickable:hover': {
471
451
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-secondary-hovered)',
@@ -484,8 +464,8 @@ module.exports = function CardPlugin() {
484
464
  borderColor: 'var(--ids-comp-card-outlined-color-border-secondary-disabled)',
485
465
  },
486
466
  '.ids-card.ids-card-outlined.ids-card-brand': {
487
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-brand-enabled)',
488
- borderColor: 'var(--ids-comp-card-outlined-color-border-brand-enabled)',
467
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-brand-default)',
468
+ borderColor: 'var(--ids-comp-card-outlined-color-border-brand-default)',
489
469
  },
490
470
  '.ids-card.ids-card-outlined.ids-card-brand.ids-card-clickable:hover': {
491
471
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-brand-hovered)',
@@ -504,8 +484,8 @@ module.exports = function CardPlugin() {
504
484
  borderColor: 'var(--ids-comp-card-outlined-color-border-brand-disabled)',
505
485
  },
506
486
  '.ids-card.ids-card-outlined.ids-card-error': {
507
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-error-enabled)',
508
- borderColor: 'var(--ids-comp-card-outlined-color-border-error-enabled)',
487
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-error-default)',
488
+ borderColor: 'var(--ids-comp-card-outlined-color-border-error-default)',
509
489
  },
510
490
  '.ids-card.ids-card-outlined.ids-card-error.ids-card-clickable:hover': {
511
491
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-error-hovered)',
@@ -519,13 +499,9 @@ module.exports = function CardPlugin() {
519
499
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-error-pressed)',
520
500
  borderColor: 'var(--ids-comp-card-outlined-color-border-error-pressed)',
521
501
  },
522
- '.ids-card.ids-card-outlined.ids-card-error.ids-card-clickable.ids-card-disabled': {
523
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-error-disabled)',
524
- borderColor: 'var(--ids-comp-card-outlined-color-border-error-disabled)',
525
- },
526
502
  '.ids-card.ids-card-outlined.ids-card-success': {
527
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-success-enabled)',
528
- borderColor: 'var(--ids-comp-card-outlined-color-border-success-enabled)',
503
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-success-default)',
504
+ borderColor: 'var(--ids-comp-card-outlined-color-border-success-default)',
529
505
  },
530
506
  '.ids-card.ids-card-outlined.ids-card-success.ids-card-clickable:hover': {
531
507
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-success-hovered)',
@@ -539,13 +515,9 @@ module.exports = function CardPlugin() {
539
515
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-success-pressed)',
540
516
  borderColor: 'var(--ids-comp-card-outlined-color-border-success-pressed)',
541
517
  },
542
- '.ids-card.ids-card-outlined.ids-card-success.ids-card-clickable.ids-card-disabled': {
543
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-success-disabled)',
544
- borderColor: 'var(--ids-comp-card-outlined-color-border-success-disabled)',
545
- },
546
518
  '.ids-card.ids-card-outlined.ids-card-warning': {
547
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-warning-enabled)',
548
- borderColor: 'var(--ids-comp-card-outlined-color-border-warning-enabled)',
519
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-warning-default)',
520
+ borderColor: 'var(--ids-comp-card-outlined-color-border-warning-default)',
549
521
  },
550
522
  '.ids-card.ids-card-outlined.ids-card-warning.ids-card-clickable:hover': {
551
523
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-warning-hovered)',
@@ -559,13 +531,9 @@ module.exports = function CardPlugin() {
559
531
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-warning-pressed)',
560
532
  borderColor: 'var(--ids-comp-card-outlined-color-border-warning-pressed)',
561
533
  },
562
- '.ids-card.ids-card-outlined.ids-card-warning.ids-card-clickable.ids-card-disabled': {
563
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-warning-disabled)',
564
- borderColor: 'var(--ids-comp-card-outlined-color-border-warning-disabled)',
565
- },
566
534
  '.ids-card.ids-card-outlined.ids-card-info': {
567
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-info-enabled)',
568
- borderColor: 'var(--ids-comp-card-outlined-color-border-info-enabled)',
535
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-info-default)',
536
+ borderColor: 'var(--ids-comp-card-outlined-color-border-info-default)',
569
537
  },
570
538
  '.ids-card.ids-card-outlined.ids-card-info.ids-card-clickable:hover': {
571
539
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-info-hovered)',
@@ -579,13 +547,9 @@ module.exports = function CardPlugin() {
579
547
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-info-pressed)',
580
548
  borderColor: 'var(--ids-comp-card-outlined-color-border-info-pressed)',
581
549
  },
582
- '.ids-card.ids-card-outlined.ids-card-info.ids-card-clickable.ids-card-disabled': {
583
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-info-disabled)',
584
- borderColor: 'var(--ids-comp-card-outlined-color-border-info-disabled)',
585
- },
586
550
  '.ids-card.ids-card-outlined.ids-card-light': {
587
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-light-enabled)',
588
- borderColor: 'var(--ids-comp-card-outlined-color-border-light-enabled)',
551
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-light-default)',
552
+ borderColor: 'var(--ids-comp-card-outlined-color-border-light-default)',
589
553
  },
590
554
  '.ids-card.ids-card-outlined.ids-card-light.ids-card-clickable:hover': {
591
555
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-light-hovered)',
@@ -604,8 +568,8 @@ module.exports = function CardPlugin() {
604
568
  borderColor: 'var(--ids-comp-card-outlined-color-border-light-disabled)',
605
569
  },
606
570
  '.ids-card.ids-card-outlined.ids-card-dark': {
607
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-dark-enabled)',
608
- borderColor: 'var(--ids-comp-card-outlined-color-border-dark-enabled)',
571
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-dark-default)',
572
+ borderColor: 'var(--ids-comp-card-outlined-color-border-dark-default)',
609
573
  },
610
574
  '.ids-card.ids-card-outlined.ids-card-dark.ids-card-clickable:hover': {
611
575
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-dark-hovered)',
@@ -624,8 +588,8 @@ module.exports = function CardPlugin() {
624
588
  borderColor: 'var(--ids-comp-card-outlined-color-border-dark-disabled)',
625
589
  },
626
590
  '.ids-card.ids-card-outlined.ids-card-surface': {
627
- backgroundColor: 'var(--ids-comp-card-outlined-color-bg-surface-enabled)',
628
- borderColor: 'var(--ids-comp-card-outlined-color-border-surface-enabled)',
591
+ backgroundColor: 'var(--ids-comp-card-outlined-color-bg-surface-default)',
592
+ borderColor: 'var(--ids-comp-card-outlined-color-border-surface-default)',
629
593
  },
630
594
  '.ids-card.ids-card-outlined.ids-card-surface.ids-card-clickable:hover': {
631
595
  backgroundColor: 'var(--ids-comp-card-outlined-color-bg-surface-hovered)',
@@ -644,8 +608,8 @@ module.exports = function CardPlugin() {
644
608
  borderColor: 'var(--ids-comp-card-outlined-color-border-surface-disabled)',
645
609
  },
646
610
  '.ids-card.ids-card-elevated.ids-card-primary': {
647
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-primary-enabled)',
648
- borderColor: 'var(--ids-comp-card-elevated-color-border-primary-enabled)',
611
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-primary-default)',
612
+ borderColor: 'var(--ids-comp-card-elevated-color-border-primary-default)',
649
613
  },
650
614
  '.ids-card.ids-card-elevated.ids-card-primary.ids-card-clickable:hover': {
651
615
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-primary-hovered)',
@@ -664,8 +628,8 @@ module.exports = function CardPlugin() {
664
628
  borderColor: 'var(--ids-comp-card-elevated-color-border-primary-disabled)',
665
629
  },
666
630
  '.ids-card.ids-card-elevated.ids-card-secondary': {
667
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-secondary-enabled)',
668
- borderColor: 'var(--ids-comp-card-elevated-color-border-secondary-enabled)',
631
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-secondary-default)',
632
+ borderColor: 'var(--ids-comp-card-elevated-color-border-secondary-default)',
669
633
  },
670
634
  '.ids-card.ids-card-elevated.ids-card-secondary.ids-card-clickable:hover': {
671
635
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-secondary-hovered)',
@@ -684,8 +648,8 @@ module.exports = function CardPlugin() {
684
648
  borderColor: 'var(--ids-comp-card-elevated-color-border-secondary-disabled)',
685
649
  },
686
650
  '.ids-card.ids-card-elevated.ids-card-brand': {
687
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-brand-enabled)',
688
- borderColor: 'var(--ids-comp-card-elevated-color-border-brand-enabled)',
651
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-brand-default)',
652
+ borderColor: 'var(--ids-comp-card-elevated-color-border-brand-default)',
689
653
  },
690
654
  '.ids-card.ids-card-elevated.ids-card-brand.ids-card-clickable:hover': {
691
655
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-brand-hovered)',
@@ -704,8 +668,8 @@ module.exports = function CardPlugin() {
704
668
  borderColor: 'var(--ids-comp-card-elevated-color-border-brand-disabled)',
705
669
  },
706
670
  '.ids-card.ids-card-elevated.ids-card-error': {
707
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-error-enabled)',
708
- borderColor: 'var(--ids-comp-card-elevated-color-border-error-enabled)',
671
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-error-default)',
672
+ borderColor: 'var(--ids-comp-card-elevated-color-border-error-default)',
709
673
  },
710
674
  '.ids-card.ids-card-elevated.ids-card-error.ids-card-clickable:hover': {
711
675
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-error-hovered)',
@@ -719,13 +683,9 @@ module.exports = function CardPlugin() {
719
683
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-error-pressed)',
720
684
  borderColor: 'var(--ids-comp-card-elevated-color-border-error-pressed)',
721
685
  },
722
- '.ids-card.ids-card-elevated.ids-card-error.ids-card-clickable.ids-card-disabled': {
723
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-error-disabled)',
724
- borderColor: 'var(--ids-comp-card-elevated-color-border-error-disabled)',
725
- },
726
686
  '.ids-card.ids-card-elevated.ids-card-success': {
727
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-success-enabled)',
728
- borderColor: 'var(--ids-comp-card-elevated-color-border-success-enabled)',
687
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-success-default)',
688
+ borderColor: 'var(--ids-comp-card-elevated-color-border-success-default)',
729
689
  },
730
690
  '.ids-card.ids-card-elevated.ids-card-success.ids-card-clickable:hover': {
731
691
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-success-hovered)',
@@ -739,13 +699,9 @@ module.exports = function CardPlugin() {
739
699
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-success-pressed)',
740
700
  borderColor: 'var(--ids-comp-card-elevated-color-border-success-pressed)',
741
701
  },
742
- '.ids-card.ids-card-elevated.ids-card-success.ids-card-clickable.ids-card-disabled': {
743
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-success-disabled)',
744
- borderColor: 'var(--ids-comp-card-elevated-color-border-success-disabled)',
745
- },
746
702
  '.ids-card.ids-card-elevated.ids-card-warning': {
747
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-warning-enabled)',
748
- borderColor: 'var(--ids-comp-card-elevated-color-border-warning-enabled)',
703
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-warning-default)',
704
+ borderColor: 'var(--ids-comp-card-elevated-color-border-warning-default)',
749
705
  },
750
706
  '.ids-card.ids-card-elevated.ids-card-warning.ids-card-clickable:hover': {
751
707
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-warning-hovered)',
@@ -759,13 +715,9 @@ module.exports = function CardPlugin() {
759
715
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-warning-pressed)',
760
716
  borderColor: 'var(--ids-comp-card-elevated-color-border-warning-pressed)',
761
717
  },
762
- '.ids-card.ids-card-elevated.ids-card-warning.ids-card-clickable.ids-card-disabled': {
763
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-warning-disabled)',
764
- borderColor: 'var(--ids-comp-card-elevated-color-border-warning-disabled)',
765
- },
766
718
  '.ids-card.ids-card-elevated.ids-card-info': {
767
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-info-enabled)',
768
- borderColor: 'var(--ids-comp-card-elevated-color-border-info-enabled)',
719
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-info-default)',
720
+ borderColor: 'var(--ids-comp-card-elevated-color-border-info-default)',
769
721
  },
770
722
  '.ids-card.ids-card-elevated.ids-card-info.ids-card-clickable:hover': {
771
723
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-info-hovered)',
@@ -779,13 +731,9 @@ module.exports = function CardPlugin() {
779
731
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-info-pressed)',
780
732
  borderColor: 'var(--ids-comp-card-elevated-color-border-info-pressed)',
781
733
  },
782
- '.ids-card.ids-card-elevated.ids-card-info.ids-card-clickable.ids-card-disabled': {
783
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-info-disabled)',
784
- borderColor: 'var(--ids-comp-card-elevated-color-border-info-disabled)',
785
- },
786
734
  '.ids-card.ids-card-elevated.ids-card-light': {
787
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-light-enabled)',
788
- borderColor: 'var(--ids-comp-card-elevated-color-border-light-enabled)',
735
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-light-default)',
736
+ borderColor: 'var(--ids-comp-card-elevated-color-border-light-default)',
789
737
  },
790
738
  '.ids-card.ids-card-elevated.ids-card-light.ids-card-clickable:hover': {
791
739
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-light-hovered)',
@@ -804,8 +752,8 @@ module.exports = function CardPlugin() {
804
752
  borderColor: 'var(--ids-comp-card-elevated-color-border-light-disabled)',
805
753
  },
806
754
  '.ids-card.ids-card-elevated.ids-card-dark': {
807
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-dark-enabled)',
808
- borderColor: 'var(--ids-comp-card-elevated-color-border-dark-enabled)',
755
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-dark-default)',
756
+ borderColor: 'var(--ids-comp-card-elevated-color-border-dark-default)',
809
757
  },
810
758
  '.ids-card.ids-card-elevated.ids-card-dark.ids-card-clickable:hover': {
811
759
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-dark-hovered)',
@@ -824,8 +772,8 @@ module.exports = function CardPlugin() {
824
772
  borderColor: 'var(--ids-comp-card-elevated-color-border-dark-disabled)',
825
773
  },
826
774
  '.ids-card.ids-card-elevated.ids-card-surface': {
827
- backgroundColor: 'var(--ids-comp-card-elevated-color-bg-surface-enabled)',
828
- borderColor: 'var(--ids-comp-card-elevated-color-border-surface-enabled)',
775
+ backgroundColor: 'var(--ids-comp-card-elevated-color-bg-surface-default)',
776
+ borderColor: 'var(--ids-comp-card-elevated-color-border-surface-default)',
829
777
  },
830
778
  '.ids-card.ids-card-elevated.ids-card-surface.ids-card-clickable:hover': {
831
779
  backgroundColor: 'var(--ids-comp-card-elevated-color-bg-surface-hovered)',