@i-cell/ids-styles 0.0.66 → 0.0.67

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 (10) hide show
  1. package/dist/accordion/accordion.css +44 -43
  2. package/dist/accordion/accordion.min.css +1 -1
  3. package/dist/accordion/accordion.plugin.js +84 -79
  4. package/dist/components.css +52 -43
  5. package/dist/components.min.css +1 -1
  6. package/dist/components.plugin.js +113 -86
  7. package/dist/notification/notification.css +8 -0
  8. package/dist/notification/notification.min.css +1 -1
  9. package/dist/notification/notification.plugin.js +29 -7
  10. package/package.json +1 -1
package/dist/accordion/accordion.css CHANGED
@@ -21,33 +21,34 @@
21
21
  align-items: flex-start;
22
22
  align-self: stretch;
23
23
  }
24
- .ids-accordion > .ids-accordion-item {
25
- display: flex;
24
+ .ids-accordion > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) {
26
25
  width: 100%;
26
+ display: flex;
27
27
  flex-direction: column;
28
28
  align-items: flex-start;
29
- flex-shrink: 0;
29
+ align-self: stretch;
30
30
  }
31
- .ids-accordion > .ids-accordion-item > .ids-accordion-item-summary {
31
+ .ids-accordion > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
32
32
  display: flex;
33
33
  align-items: center;
34
34
  width: 100%;
35
35
  flex: 1 0 0;
36
36
  border-style: solid;
37
37
  cursor: pointer;
38
+ text-align: left;
38
39
  }
39
- .ids-accordion > .ids-accordion-item > .ids-accordion-item-summary:focus, .ids-accordion > .ids-accordion-item > .ids-accordion-item-summary:focus-visible {
40
+ .ids-accordion > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus, .ids-accordion > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible {
40
41
  outline-offset: 2px;
41
42
  outline-style: solid;
42
43
  z-index: 1;
43
44
  }
44
- .ids-accordion > .ids-accordion-item > .ids-accordion-item-summary > .ids-accordion-item-title {
45
+ .ids-accordion > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-accordion-item-title {
45
46
  flex: 1 0 0;
46
47
  white-space: nowrap;
47
48
  overflow: hidden;
48
49
  text-overflow: ellipsis;
49
50
  }
50
- .ids-accordion > .ids-accordion-item.ids-accordion-item-disabled > .ids-accordion-item-summary {
51
+ .ids-accordion > .ids-accordion-item.ids-accordion-item-disabled > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
51
52
  pointer-events: none;
52
53
  user-select: none;
53
54
  }
@@ -71,25 +72,25 @@
71
72
  padding: var(--ids-comp-accordion-item-size-padding-y-compact) var(--ids-comp-accordion-item-size-padding-x-compact);
72
73
  gap: var(--ids-comp-accordion-item-size-gap-compact);
73
74
  }
74
- .ids-accordion.ids-accordion-compact > .ids-accordion-item > .ids-accordion-item-summary {
75
+ .ids-accordion.ids-accordion-compact > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
75
76
  height: var(--ids-comp-accordion-summary-size-height-compact);
76
77
  padding: var(--ids-comp-accordion-summary-size-padding-y-compact) var(--ids-comp-accordion-summary-size-padding-x-compact);
77
78
  gap: var(--ids-comp-accordion-summary-size-gap-compact);
78
79
  border-radius: var(--ids-comp-accordion-summary-size-border-radius-compact);
79
80
  border-width: var(--ids-comp-accordion-summary-size-border-width-compact);
80
81
  }
81
- .ids-accordion.ids-accordion-compact > .ids-accordion-item > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-compact > .ids-accordion-item > .ids-accordion-item-summary:focus-visible {
82
+ .ids-accordion.ids-accordion-compact > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-compact > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible {
82
83
  outline-width: var(--ids-comp-accordion-summary-focused-outline-size-outline-compact);
83
84
  outline-color: var(--ids-comp-accordion-summary-focused-outline-color-dark-focused);
84
85
  }
85
- .ids-accordion.ids-accordion-compact > .ids-accordion-item > .ids-accordion-item-summary > .ids-accordion-item-title {
86
+ .ids-accordion.ids-accordion-compact > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-accordion-item-title {
86
87
  font-family: var(--ids-comp-accordion-summary-typography-font-family-compact);
87
88
  font-size: var(--ids-comp-accordion-summary-typography-font-size-compact);
88
89
  font-weight: var(--ids-comp-accordion-summary-typography-font-weight-compact);
89
90
  letter-spacing: var(--ids-comp-accordion-summary-typography-letter-spacing-compact);
90
91
  line-height: var(--ids-comp-accordion-summary-typography-line-height-compact);
91
92
  }
92
- .ids-accordion.ids-accordion-compact > .ids-accordion-item > .ids-accordion-item-summary > .ids-icon {
93
+ .ids-accordion.ids-accordion-compact > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-icon {
93
94
  font-size: var(--ids-comp-accordion-summary-icon-typography-font-size-compact);
94
95
  font-weight: var(--ids-comp-accordion-summary-icon-typography-font-weight-compact);
95
96
  line-height: var(--ids-comp-accordion-summary-icon-typography-line-height-compact);
@@ -114,25 +115,25 @@
114
115
  padding: var(--ids-comp-accordion-item-size-padding-y-comfortable) var(--ids-comp-accordion-item-size-padding-x-comfortable);
115
116
  gap: var(--ids-comp-accordion-item-size-gap-comfortable);
116
117
  }
117
- .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > .ids-accordion-item-summary {
118
+ .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
118
119
  height: var(--ids-comp-accordion-summary-size-height-comfortable);
119
120
  padding: var(--ids-comp-accordion-summary-size-padding-y-comfortable) var(--ids-comp-accordion-summary-size-padding-x-comfortable);
120
121
  gap: var(--ids-comp-accordion-summary-size-gap-comfortable);
121
122
  border-radius: var(--ids-comp-accordion-summary-size-border-radius-comfortable);
122
123
  border-width: var(--ids-comp-accordion-summary-size-border-width-comfortable);
123
124
  }
124
- .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > .ids-accordion-item-summary:focus-visible {
125
+ .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible {
125
126
  outline-width: var(--ids-comp-accordion-summary-focused-outline-size-outline-comfortable);
126
127
  outline-color: var(--ids-comp-accordion-summary-focused-outline-color-dark-focused);
127
128
  }
128
- .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > .ids-accordion-item-summary > .ids-accordion-item-title {
129
+ .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-accordion-item-title {
129
130
  font-family: var(--ids-comp-accordion-summary-typography-font-family-comfortable);
130
131
  font-size: var(--ids-comp-accordion-summary-typography-font-size-comfortable);
131
132
  font-weight: var(--ids-comp-accordion-summary-typography-font-weight-comfortable);
132
133
  letter-spacing: var(--ids-comp-accordion-summary-typography-letter-spacing-comfortable);
133
134
  line-height: var(--ids-comp-accordion-summary-typography-line-height-comfortable);
134
135
  }
135
- .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > .ids-accordion-item-summary > .ids-icon {
136
+ .ids-accordion.ids-accordion-comfortable > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-icon {
136
137
  font-size: var(--ids-comp-accordion-summary-icon-typography-font-size-comfortable);
137
138
  font-weight: var(--ids-comp-accordion-summary-icon-typography-font-weight-comfortable);
138
139
  line-height: var(--ids-comp-accordion-summary-icon-typography-line-height-comfortable);
@@ -157,25 +158,25 @@
157
158
  padding: var(--ids-comp-accordion-item-size-padding-y-spacious) var(--ids-comp-accordion-item-size-padding-x-spacious);
158
159
  gap: var(--ids-comp-accordion-item-size-gap-spacious);
159
160
  }
160
- .ids-accordion.ids-accordion-spacious > .ids-accordion-item > .ids-accordion-item-summary {
161
+ .ids-accordion.ids-accordion-spacious > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
161
162
  height: var(--ids-comp-accordion-summary-size-height-spacious);
162
163
  padding: var(--ids-comp-accordion-summary-size-padding-y-spacious) var(--ids-comp-accordion-summary-size-padding-x-spacious);
163
164
  gap: var(--ids-comp-accordion-summary-size-gap-spacious);
164
165
  border-radius: var(--ids-comp-accordion-summary-size-border-radius-spacious);
165
166
  border-width: var(--ids-comp-accordion-summary-size-border-width-spacious);
166
167
  }
167
- .ids-accordion.ids-accordion-spacious > .ids-accordion-item > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-spacious > .ids-accordion-item > .ids-accordion-item-summary:focus-visible {
168
+ .ids-accordion.ids-accordion-spacious > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-spacious > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible {
168
169
  outline-width: var(--ids-comp-accordion-summary-focused-outline-size-outline-spacious);
169
170
  outline-color: var(--ids-comp-accordion-summary-focused-outline-color-dark-focused);
170
171
  }
171
- .ids-accordion.ids-accordion-spacious > .ids-accordion-item > .ids-accordion-item-summary > .ids-accordion-item-title {
172
+ .ids-accordion.ids-accordion-spacious > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-accordion-item-title {
172
173
  font-family: var(--ids-comp-accordion-summary-typography-font-family-spacious);
173
174
  font-size: var(--ids-comp-accordion-summary-typography-font-size-spacious);
174
175
  font-weight: var(--ids-comp-accordion-summary-typography-font-weight-spacious);
175
176
  letter-spacing: var(--ids-comp-accordion-summary-typography-letter-spacing-spacious);
176
177
  line-height: var(--ids-comp-accordion-summary-typography-line-height-spacious);
177
178
  }
178
- .ids-accordion.ids-accordion-spacious > .ids-accordion-item > .ids-accordion-item-summary > .ids-icon {
179
+ .ids-accordion.ids-accordion-spacious > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-icon {
179
180
  font-size: var(--ids-comp-accordion-summary-icon-typography-font-size-spacious);
180
181
  font-weight: var(--ids-comp-accordion-summary-icon-typography-font-weight-spacious);
181
182
  line-height: var(--ids-comp-accordion-summary-icon-typography-line-height-spacious);
@@ -200,25 +201,25 @@
200
201
  padding: var(--ids-comp-accordion-item-size-padding-y-dense) var(--ids-comp-accordion-item-size-padding-x-dense);
201
202
  gap: var(--ids-comp-accordion-item-size-gap-dense);
202
203
  }
203
- .ids-accordion.ids-accordion-dense > .ids-accordion-item > .ids-accordion-item-summary {
204
+ .ids-accordion.ids-accordion-dense > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
204
205
  height: var(--ids-comp-accordion-summary-size-height-dense);
205
206
  padding: var(--ids-comp-accordion-summary-size-padding-y-dense) var(--ids-comp-accordion-summary-size-padding-x-dense);
206
207
  gap: var(--ids-comp-accordion-summary-size-gap-dense);
207
208
  border-radius: var(--ids-comp-accordion-summary-size-border-radius-dense);
208
209
  border-width: var(--ids-comp-accordion-summary-size-border-width-dense);
209
210
  }
210
- .ids-accordion.ids-accordion-dense > .ids-accordion-item > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-dense > .ids-accordion-item > .ids-accordion-item-summary:focus-visible {
211
+ .ids-accordion.ids-accordion-dense > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-dense > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible {
211
212
  outline-width: var(--ids-comp-accordion-summary-focused-outline-size-outline-dense);
212
213
  outline-color: var(--ids-comp-accordion-summary-focused-outline-color-dark-focused);
213
214
  }
214
- .ids-accordion.ids-accordion-dense > .ids-accordion-item > .ids-accordion-item-summary > .ids-accordion-item-title {
215
+ .ids-accordion.ids-accordion-dense > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-accordion-item-title {
215
216
  font-family: var(--ids-comp-accordion-summary-typography-font-family-dense);
216
217
  font-size: var(--ids-comp-accordion-summary-typography-font-size-dense);
217
218
  font-weight: var(--ids-comp-accordion-summary-typography-font-weight-dense);
218
219
  letter-spacing: var(--ids-comp-accordion-summary-typography-letter-spacing-dense);
219
220
  line-height: var(--ids-comp-accordion-summary-typography-line-height-dense);
220
221
  }
221
- .ids-accordion.ids-accordion-dense > .ids-accordion-item > .ids-accordion-item-summary > .ids-icon {
222
+ .ids-accordion.ids-accordion-dense > .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-icon {
222
223
  font-size: var(--ids-comp-accordion-summary-icon-typography-font-size-dense);
223
224
  font-weight: var(--ids-comp-accordion-summary-icon-typography-font-weight-dense);
224
225
  line-height: var(--ids-comp-accordion-summary-icon-typography-line-height-dense);
@@ -233,87 +234,87 @@
233
234
  border-color: var(--ids-comp-accordion-container-color-border-default);
234
235
  background-color: var(--ids-comp-accordion-container-color-bg-default);
235
236
  }
236
- .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary {
237
+ .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
237
238
  background: var(--ids-comp-accordion-summary-text-color-bg-default);
238
239
  border-color: var(--ids-comp-accordion-summary-text-color-border-default);
239
240
  color: var(--ids-comp-accordion-summary-text-color-fg-label-default);
240
241
  }
241
- .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary > .ids-icon {
242
+ .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-icon {
242
243
  color: var(--ids-comp-accordion-summary-text-color-fg-icon-default);
243
244
  }
244
- .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary:hover {
245
+ .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:hover {
245
246
  background: var(--ids-comp-accordion-summary-text-color-bg-hovered);
246
247
  border-color: var(--ids-comp-accordion-summary-text-color-border-hovered);
247
248
  color: var(--ids-comp-accordion-summary-text-color-fg-label-hovered);
248
249
  }
249
- .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary:hover > .ids-icon {
250
+ .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:hover > .ids-icon {
250
251
  color: var(--ids-comp-accordion-summary-text-color-fg-icon-hovered);
251
252
  }
252
- .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary:focus-visible {
253
+ .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible {
253
254
  background: var(--ids-comp-accordion-summary-text-color-bg-focused);
254
255
  border-color: var(--ids-comp-accordion-summary-text-color-border-focused);
255
256
  color: var(--ids-comp-accordion-summary-text-color-fg-label-focused);
256
257
  }
257
- .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary:focus > .ids-icon, .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary:focus-visible > .ids-icon {
258
+ .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus > .ids-icon, .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible > .ids-icon {
258
259
  color: var(--ids-comp-accordion-summary-text-color-fg-icon-focused);
259
260
  }
260
- .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary:active {
261
+ .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:active {
261
262
  background: var(--ids-comp-accordion-summary-text-color-bg-pressed);
262
263
  border-color: var(--ids-comp-accordion-summary-text-color-border-pressed);
263
264
  color: var(--ids-comp-accordion-summary-text-color-fg-label-pressed);
264
265
  }
265
- .ids-accordion.ids-accordion-text .ids-accordion-item > .ids-accordion-item-summary:active > .ids-icon {
266
+ .ids-accordion.ids-accordion-text .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:active > .ids-icon {
266
267
  color: var(--ids-comp-accordion-summary-text-color-fg-icon-pressed);
267
268
  }
268
- .ids-accordion.ids-accordion-text .ids-accordion-item.ids-accordion-item-disabled > .ids-accordion-item-summary {
269
+ .ids-accordion.ids-accordion-text .ids-accordion-item.ids-accordion-item-disabled > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
269
270
  background: var(--ids-comp-accordion-summary-text-color-bg-disabled);
270
271
  border-color: var(--ids-comp-accordion-summary-text-color-border-disabled);
271
272
  color: var(--ids-comp-accordion-summary-text-color-fg-label-disabled);
272
273
  }
273
- .ids-accordion.ids-accordion-text .ids-accordion-item.ids-accordion-item-disabled > .ids-accordion-item-summary > .ids-icon {
274
+ .ids-accordion.ids-accordion-text .ids-accordion-item.ids-accordion-item-disabled > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-icon {
274
275
  color: var(--ids-comp-accordion-summary-text-color-fg-icon-disabled);
275
276
  }
276
277
  .ids-accordion.ids-accordion-filled {
277
278
  border-color: var(--ids-comp-accordion-container-color-border-default);
278
279
  background-color: var(--ids-comp-accordion-container-color-bg-default);
279
280
  }
280
- .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary {
281
+ .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
281
282
  background: var(--ids-comp-accordion-summary-filled-color-bg-default);
282
283
  border-color: var(--ids-comp-accordion-summary-filled-color-border-default);
283
284
  color: var(--ids-comp-accordion-summary-filled-color-fg-label-default);
284
285
  }
285
- .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary > .ids-icon {
286
+ .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-icon {
286
287
  color: var(--ids-comp-accordion-summary-filled-color-fg-icon-default);
287
288
  }
288
- .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary:hover {
289
+ .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:hover {
289
290
  background: var(--ids-comp-accordion-summary-filled-color-bg-hovered);
290
291
  border-color: var(--ids-comp-accordion-summary-filled-color-border-hovered);
291
292
  color: var(--ids-comp-accordion-summary-filled-color-fg-label-hovered);
292
293
  }
293
- .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary:hover > .ids-icon {
294
+ .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:hover > .ids-icon {
294
295
  color: var(--ids-comp-accordion-summary-filled-color-fg-icon-hovered);
295
296
  }
296
- .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary:focus-visible {
297
+ .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus, .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible {
297
298
  background: var(--ids-comp-accordion-summary-filled-color-bg-focused);
298
299
  border-color: var(--ids-comp-accordion-summary-filled-color-border-focused);
299
300
  color: var(--ids-comp-accordion-summary-filled-color-fg-label-focused);
300
301
  }
301
- .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary:focus > .ids-icon, .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary:focus-visible > .ids-icon {
302
+ .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus > .ids-icon, .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:focus-visible > .ids-icon {
302
303
  color: var(--ids-comp-accordion-summary-filled-color-fg-icon-focused);
303
304
  }
304
- .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary:active {
305
+ .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:active {
305
306
  background: var(--ids-comp-accordion-summary-filled-color-bg-pressed);
306
307
  border-color: var(--ids-comp-accordion-summary-filled-color-border-pressed);
307
308
  color: var(--ids-comp-accordion-summary-filled-color-fg-label-pressed);
308
309
  }
309
- .ids-accordion.ids-accordion-filled .ids-accordion-item > .ids-accordion-item-summary:active > .ids-icon {
310
+ .ids-accordion.ids-accordion-filled .ids-accordion-item > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary:active > .ids-icon {
310
311
  color: var(--ids-comp-accordion-summary-filled-color-fg-icon-pressed);
311
312
  }
312
- .ids-accordion.ids-accordion-filled .ids-accordion-item.ids-accordion-item-disabled > .ids-accordion-item-summary {
313
+ .ids-accordion.ids-accordion-filled .ids-accordion-item.ids-accordion-item-disabled > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary {
313
314
  background: var(--ids-comp-accordion-summary-filled-color-bg-disabled);
314
315
  border-color: var(--ids-comp-accordion-summary-filled-color-border-disabled);
315
316
  color: var(--ids-comp-accordion-summary-filled-color-fg-label-disabled);
316
317
  }
317
- .ids-accordion.ids-accordion-filled .ids-accordion-item.ids-accordion-item-disabled > .ids-accordion-item-summary > .ids-icon {
318
+ .ids-accordion.ids-accordion-filled .ids-accordion-item.ids-accordion-item-disabled > :is(h1, h2, h3, h4, h5, h6) > .ids-accordion-item-summary > .ids-icon {
318
319
  color: var(--ids-comp-accordion-summary-filled-color-fg-icon-disabled);
319
320
  }
package/dist/accordion/accordion.min.css CHANGED
@@ -1 +1 @@
1
- .ids-accordion{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5;display:flex;width:100%;flex-direction:column;align-items:flex-start;border-style:solid}.ids-accordion::before,.ids-accordion::after,.ids-accordion *,.ids-accordion ::before,.ids-accordion ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-accordion>.ids-accordion-controls{display:flex;align-items:flex-start;align-self:stretch}.ids-accordion>.ids-accordion-item{display:flex;width:100%;flex-direction:column;align-items:flex-start;flex-shrink:0}.ids-accordion>.ids-accordion-item>.ids-accordion-item-summary{display:flex;align-items:center;width:100%;flex:1 0 0;border-style:solid;cursor:pointer}.ids-accordion>.ids-accordion-item>.ids-accordion-item-summary:focus,.ids-accordion>.ids-accordion-item>.ids-accordion-item-summary:focus-visible{outline-offset:2px;outline-style:solid;z-index:1}.ids-accordion>.ids-accordion-item>.ids-accordion-item-summary>.ids-accordion-item-title{flex:1 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ids-accordion>.ids-accordion-item.ids-accordion-item-disabled>.ids-accordion-item-summary{pointer-events:none;user-select:none}.ids-accordion>.ids-accordion-item>.ids-accordion-item-content{display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}.ids-accordion.ids-accordion-compact{padding:var(--ids-comp-accordion-container-size-padding-y-compact) var(--ids-comp-accordion-container-size-padding-x-compact);gap:var(--ids-comp-accordion-container-size-gap-compact);border-radius:var(--ids-comp-accordion-container-size-border-radius-compact);border-width:var(--ids-comp-accordion-container-size-border-width-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-controls{padding:var(--ids-comp-accordion-controls-size-padding-y-compact) var(--ids-comp-accordion-controls-size-padding-x-compact);gap:var(--ids-comp-accordion-controls-size-gap-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item{padding:var(--ids-comp-accordion-item-size-padding-y-compact) var(--ids-comp-accordion-item-size-padding-x-compact);gap:var(--ids-comp-accordion-item-size-gap-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>.ids-accordion-item-summary{height:var(--ids-comp-accordion-summary-size-height-compact);padding:var(--ids-comp-accordion-summary-size-padding-y-compact) var(--ids-comp-accordion-summary-size-padding-x-compact);gap:var(--ids-comp-accordion-summary-size-gap-compact);border-radius:var(--ids-comp-accordion-summary-size-border-radius-compact);border-width:var(--ids-comp-accordion-summary-size-border-width-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-compact>.ids-accordion-item>.ids-accordion-item-summary:focus-visible{outline-width:var(--ids-comp-accordion-summary-focused-outline-size-outline-compact);outline-color:var(--ids-comp-accordion-summary-focused-outline-color-dark-focused)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>.ids-accordion-item-summary>.ids-accordion-item-title{font-family:var(--ids-comp-accordion-summary-typography-font-family-compact);font-size:var(--ids-comp-accordion-summary-typography-font-size-compact);font-weight:var(--ids-comp-accordion-summary-typography-font-weight-compact);letter-spacing:var(--ids-comp-accordion-summary-typography-letter-spacing-compact);line-height:var(--ids-comp-accordion-summary-typography-line-height-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>.ids-accordion-item-summary>.ids-icon{font-size:var(--ids-comp-accordion-summary-icon-typography-font-size-compact);font-weight:var(--ids-comp-accordion-summary-icon-typography-font-weight-compact);line-height:var(--ids-comp-accordion-summary-icon-typography-line-height-compact);width:var(--ids-comp-accordion-summary-size-icon-compact);height:var(--ids-comp-accordion-summary-size-icon-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>.ids-accordion-item-content{padding:var(--ids-comp-accordion-details-size-padding-y-compact) var(--ids-comp-accordion-details-size-padding-x-compact);gap:var(--ids-comp-accordion-details-size-gap-compact)}.ids-accordion.ids-accordion-comfortable{padding:var(--ids-comp-accordion-container-size-padding-y-comfortable) var(--ids-comp-accordion-container-size-padding-x-comfortable);gap:var(--ids-comp-accordion-container-size-gap-comfortable);border-radius:var(--ids-comp-accordion-container-size-border-radius-comfortable);border-width:var(--ids-comp-accordion-container-size-border-width-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-controls{padding:var(--ids-comp-accordion-controls-size-padding-y-comfortable) var(--ids-comp-accordion-controls-size-padding-x-comfortable);gap:var(--ids-comp-accordion-controls-size-gap-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item{padding:var(--ids-comp-accordion-item-size-padding-y-comfortable) var(--ids-comp-accordion-item-size-padding-x-comfortable);gap:var(--ids-comp-accordion-item-size-gap-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>.ids-accordion-item-summary{height:var(--ids-comp-accordion-summary-size-height-comfortable);padding:var(--ids-comp-accordion-summary-size-padding-y-comfortable) var(--ids-comp-accordion-summary-size-padding-x-comfortable);gap:var(--ids-comp-accordion-summary-size-gap-comfortable);border-radius:var(--ids-comp-accordion-summary-size-border-radius-comfortable);border-width:var(--ids-comp-accordion-summary-size-border-width-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>.ids-accordion-item-summary:focus-visible{outline-width:var(--ids-comp-accordion-summary-focused-outline-size-outline-comfortable);outline-color:var(--ids-comp-accordion-summary-focused-outline-color-dark-focused)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>.ids-accordion-item-summary>.ids-accordion-item-title{font-family:var(--ids-comp-accordion-summary-typography-font-family-comfortable);font-size:var(--ids-comp-accordion-summary-typography-font-size-comfortable);font-weight:var(--ids-comp-accordion-summary-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-accordion-summary-typography-letter-spacing-comfortable);line-height:var(--ids-comp-accordion-summary-typography-line-height-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>.ids-accordion-item-summary>.ids-icon{font-size:var(--ids-comp-accordion-summary-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-accordion-summary-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-accordion-summary-icon-typography-line-height-comfortable);width:var(--ids-comp-accordion-summary-size-icon-comfortable);height:var(--ids-comp-accordion-summary-size-icon-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>.ids-accordion-item-content{padding:var(--ids-comp-accordion-details-size-padding-y-comfortable) var(--ids-comp-accordion-details-size-padding-x-comfortable);gap:var(--ids-comp-accordion-details-size-gap-comfortable)}.ids-accordion.ids-accordion-spacious{padding:var(--ids-comp-accordion-container-size-padding-y-spacious) var(--ids-comp-accordion-container-size-padding-x-spacious);gap:var(--ids-comp-accordion-container-size-gap-spacious);border-radius:var(--ids-comp-accordion-container-size-border-radius-spacious);border-width:var(--ids-comp-accordion-container-size-border-width-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-controls{padding:var(--ids-comp-accordion-controls-size-padding-y-spacious) var(--ids-comp-accordion-controls-size-padding-x-spacious);gap:var(--ids-comp-accordion-controls-size-gap-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item{padding:var(--ids-comp-accordion-item-size-padding-y-spacious) var(--ids-comp-accordion-item-size-padding-x-spacious);gap:var(--ids-comp-accordion-item-size-gap-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>.ids-accordion-item-summary{height:var(--ids-comp-accordion-summary-size-height-spacious);padding:var(--ids-comp-accordion-summary-size-padding-y-spacious) var(--ids-comp-accordion-summary-size-padding-x-spacious);gap:var(--ids-comp-accordion-summary-size-gap-spacious);border-radius:var(--ids-comp-accordion-summary-size-border-radius-spacious);border-width:var(--ids-comp-accordion-summary-size-border-width-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-spacious>.ids-accordion-item>.ids-accordion-item-summary:focus-visible{outline-width:var(--ids-comp-accordion-summary-focused-outline-size-outline-spacious);outline-color:var(--ids-comp-accordion-summary-focused-outline-color-dark-focused)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>.ids-accordion-item-summary>.ids-accordion-item-title{font-family:var(--ids-comp-accordion-summary-typography-font-family-spacious);font-size:var(--ids-comp-accordion-summary-typography-font-size-spacious);font-weight:var(--ids-comp-accordion-summary-typography-font-weight-spacious);letter-spacing:var(--ids-comp-accordion-summary-typography-letter-spacing-spacious);line-height:var(--ids-comp-accordion-summary-typography-line-height-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>.ids-accordion-item-summary>.ids-icon{font-size:var(--ids-comp-accordion-summary-icon-typography-font-size-spacious);font-weight:var(--ids-comp-accordion-summary-icon-typography-font-weight-spacious);line-height:var(--ids-comp-accordion-summary-icon-typography-line-height-spacious);width:var(--ids-comp-accordion-summary-size-icon-spacious);height:var(--ids-comp-accordion-summary-size-icon-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>.ids-accordion-item-content{padding:var(--ids-comp-accordion-details-size-padding-y-spacious) var(--ids-comp-accordion-details-size-padding-x-spacious);gap:var(--ids-comp-accordion-details-size-gap-spacious)}.ids-accordion.ids-accordion-dense{padding:var(--ids-comp-accordion-container-size-padding-y-dense) var(--ids-comp-accordion-container-size-padding-x-dense);gap:var(--ids-comp-accordion-container-size-gap-dense);border-radius:var(--ids-comp-accordion-container-size-border-radius-dense);border-width:var(--ids-comp-accordion-container-size-border-width-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-controls{padding:var(--ids-comp-accordion-controls-size-padding-y-dense) var(--ids-comp-accordion-controls-size-padding-x-dense);gap:var(--ids-comp-accordion-controls-size-gap-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item{padding:var(--ids-comp-accordion-item-size-padding-y-dense) var(--ids-comp-accordion-item-size-padding-x-dense);gap:var(--ids-comp-accordion-item-size-gap-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>.ids-accordion-item-summary{height:var(--ids-comp-accordion-summary-size-height-dense);padding:var(--ids-comp-accordion-summary-size-padding-y-dense) var(--ids-comp-accordion-summary-size-padding-x-dense);gap:var(--ids-comp-accordion-summary-size-gap-dense);border-radius:var(--ids-comp-accordion-summary-size-border-radius-dense);border-width:var(--ids-comp-accordion-summary-size-border-width-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-dense>.ids-accordion-item>.ids-accordion-item-summary:focus-visible{outline-width:var(--ids-comp-accordion-summary-focused-outline-size-outline-dense);outline-color:var(--ids-comp-accordion-summary-focused-outline-color-dark-focused)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>.ids-accordion-item-summary>.ids-accordion-item-title{font-family:var(--ids-comp-accordion-summary-typography-font-family-dense);font-size:var(--ids-comp-accordion-summary-typography-font-size-dense);font-weight:var(--ids-comp-accordion-summary-typography-font-weight-dense);letter-spacing:var(--ids-comp-accordion-summary-typography-letter-spacing-dense);line-height:var(--ids-comp-accordion-summary-typography-line-height-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>.ids-accordion-item-summary>.ids-icon{font-size:var(--ids-comp-accordion-summary-icon-typography-font-size-dense);font-weight:var(--ids-comp-accordion-summary-icon-typography-font-weight-dense);line-height:var(--ids-comp-accordion-summary-icon-typography-line-height-dense);width:var(--ids-comp-accordion-summary-size-icon-dense);height:var(--ids-comp-accordion-summary-size-icon-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>.ids-accordion-item-content{padding:var(--ids-comp-accordion-details-size-padding-y-dense) var(--ids-comp-accordion-details-size-padding-x-dense);gap:var(--ids-comp-accordion-details-size-gap-dense)}.ids-accordion.ids-accordion-text{border-color:var(--ids-comp-accordion-container-color-border-default);background-color:var(--ids-comp-accordion-container-color-bg-default)}.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary{background:var(--ids-comp-accordion-summary-text-color-bg-default);border-color:var(--ids-comp-accordion-summary-text-color-border-default);color:var(--ids-comp-accordion-summary-text-color-fg-label-default)}.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-default)}.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary:hover{background:var(--ids-comp-accordion-summary-text-color-bg-hovered);border-color:var(--ids-comp-accordion-summary-text-color-border-hovered);color:var(--ids-comp-accordion-summary-text-color-fg-label-hovered)}.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary:hover>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-hovered)}.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary:focus-visible{background:var(--ids-comp-accordion-summary-text-color-bg-focused);border-color:var(--ids-comp-accordion-summary-text-color-border-focused);color:var(--ids-comp-accordion-summary-text-color-fg-label-focused)}.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary:focus>.ids-icon,.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary:focus-visible>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-focused)}.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary:active{background:var(--ids-comp-accordion-summary-text-color-bg-pressed);border-color:var(--ids-comp-accordion-summary-text-color-border-pressed);color:var(--ids-comp-accordion-summary-text-color-fg-label-pressed)}.ids-accordion.ids-accordion-text .ids-accordion-item>.ids-accordion-item-summary:active>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-pressed)}.ids-accordion.ids-accordion-text .ids-accordion-item.ids-accordion-item-disabled>.ids-accordion-item-summary{background:var(--ids-comp-accordion-summary-text-color-bg-disabled);border-color:var(--ids-comp-accordion-summary-text-color-border-disabled);color:var(--ids-comp-accordion-summary-text-color-fg-label-disabled)}.ids-accordion.ids-accordion-text .ids-accordion-item.ids-accordion-item-disabled>.ids-accordion-item-summary>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-disabled)}.ids-accordion.ids-accordion-filled{border-color:var(--ids-comp-accordion-container-color-border-default);background-color:var(--ids-comp-accordion-container-color-bg-default)}.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary{background:var(--ids-comp-accordion-summary-filled-color-bg-default);border-color:var(--ids-comp-accordion-summary-filled-color-border-default);color:var(--ids-comp-accordion-summary-filled-color-fg-label-default)}.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-default)}.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary:hover{background:var(--ids-comp-accordion-summary-filled-color-bg-hovered);border-color:var(--ids-comp-accordion-summary-filled-color-border-hovered);color:var(--ids-comp-accordion-summary-filled-color-fg-label-hovered)}.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary:hover>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-hovered)}.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary:focus-visible{background:var(--ids-comp-accordion-summary-filled-color-bg-focused);border-color:var(--ids-comp-accordion-summary-filled-color-border-focused);color:var(--ids-comp-accordion-summary-filled-color-fg-label-focused)}.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary:focus>.ids-icon,.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary:focus-visible>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-focused)}.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary:active{background:var(--ids-comp-accordion-summary-filled-color-bg-pressed);border-color:var(--ids-comp-accordion-summary-filled-color-border-pressed);color:var(--ids-comp-accordion-summary-filled-color-fg-label-pressed)}.ids-accordion.ids-accordion-filled .ids-accordion-item>.ids-accordion-item-summary:active>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-pressed)}.ids-accordion.ids-accordion-filled .ids-accordion-item.ids-accordion-item-disabled>.ids-accordion-item-summary{background:var(--ids-comp-accordion-summary-filled-color-bg-disabled);border-color:var(--ids-comp-accordion-summary-filled-color-border-disabled);color:var(--ids-comp-accordion-summary-filled-color-fg-label-disabled)}.ids-accordion.ids-accordion-filled .ids-accordion-item.ids-accordion-item-disabled>.ids-accordion-item-summary>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-disabled)}
1
+ .ids-accordion{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5;display:flex;width:100%;flex-direction:column;align-items:flex-start;border-style:solid}.ids-accordion::before,.ids-accordion::after,.ids-accordion *,.ids-accordion ::before,.ids-accordion ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-accordion>.ids-accordion-controls{display:flex;align-items:flex-start;align-self:stretch}.ids-accordion>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6){width:100%;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}.ids-accordion>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{display:flex;align-items:center;width:100%;flex:1 0 0;border-style:solid;cursor:pointer;text-align:left}.ids-accordion>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus,.ids-accordion>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible{outline-offset:2px;outline-style:solid;z-index:1}.ids-accordion>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-accordion-item-title{flex:1 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ids-accordion>.ids-accordion-item.ids-accordion-item-disabled>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{pointer-events:none;user-select:none}.ids-accordion>.ids-accordion-item>.ids-accordion-item-content{display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}.ids-accordion.ids-accordion-compact{padding:var(--ids-comp-accordion-container-size-padding-y-compact) var(--ids-comp-accordion-container-size-padding-x-compact);gap:var(--ids-comp-accordion-container-size-gap-compact);border-radius:var(--ids-comp-accordion-container-size-border-radius-compact);border-width:var(--ids-comp-accordion-container-size-border-width-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-controls{padding:var(--ids-comp-accordion-controls-size-padding-y-compact) var(--ids-comp-accordion-controls-size-padding-x-compact);gap:var(--ids-comp-accordion-controls-size-gap-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item{padding:var(--ids-comp-accordion-item-size-padding-y-compact) var(--ids-comp-accordion-item-size-padding-x-compact);gap:var(--ids-comp-accordion-item-size-gap-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{height:var(--ids-comp-accordion-summary-size-height-compact);padding:var(--ids-comp-accordion-summary-size-padding-y-compact) var(--ids-comp-accordion-summary-size-padding-x-compact);gap:var(--ids-comp-accordion-summary-size-gap-compact);border-radius:var(--ids-comp-accordion-summary-size-border-radius-compact);border-width:var(--ids-comp-accordion-summary-size-border-width-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-compact>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible{outline-width:var(--ids-comp-accordion-summary-focused-outline-size-outline-compact);outline-color:var(--ids-comp-accordion-summary-focused-outline-color-dark-focused)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-accordion-item-title{font-family:var(--ids-comp-accordion-summary-typography-font-family-compact);font-size:var(--ids-comp-accordion-summary-typography-font-size-compact);font-weight:var(--ids-comp-accordion-summary-typography-font-weight-compact);letter-spacing:var(--ids-comp-accordion-summary-typography-letter-spacing-compact);line-height:var(--ids-comp-accordion-summary-typography-line-height-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-icon{font-size:var(--ids-comp-accordion-summary-icon-typography-font-size-compact);font-weight:var(--ids-comp-accordion-summary-icon-typography-font-weight-compact);line-height:var(--ids-comp-accordion-summary-icon-typography-line-height-compact);width:var(--ids-comp-accordion-summary-size-icon-compact);height:var(--ids-comp-accordion-summary-size-icon-compact)}.ids-accordion.ids-accordion-compact>.ids-accordion-item>.ids-accordion-item-content{padding:var(--ids-comp-accordion-details-size-padding-y-compact) var(--ids-comp-accordion-details-size-padding-x-compact);gap:var(--ids-comp-accordion-details-size-gap-compact)}.ids-accordion.ids-accordion-comfortable{padding:var(--ids-comp-accordion-container-size-padding-y-comfortable) var(--ids-comp-accordion-container-size-padding-x-comfortable);gap:var(--ids-comp-accordion-container-size-gap-comfortable);border-radius:var(--ids-comp-accordion-container-size-border-radius-comfortable);border-width:var(--ids-comp-accordion-container-size-border-width-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-controls{padding:var(--ids-comp-accordion-controls-size-padding-y-comfortable) var(--ids-comp-accordion-controls-size-padding-x-comfortable);gap:var(--ids-comp-accordion-controls-size-gap-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item{padding:var(--ids-comp-accordion-item-size-padding-y-comfortable) var(--ids-comp-accordion-item-size-padding-x-comfortable);gap:var(--ids-comp-accordion-item-size-gap-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{height:var(--ids-comp-accordion-summary-size-height-comfortable);padding:var(--ids-comp-accordion-summary-size-padding-y-comfortable) var(--ids-comp-accordion-summary-size-padding-x-comfortable);gap:var(--ids-comp-accordion-summary-size-gap-comfortable);border-radius:var(--ids-comp-accordion-summary-size-border-radius-comfortable);border-width:var(--ids-comp-accordion-summary-size-border-width-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible{outline-width:var(--ids-comp-accordion-summary-focused-outline-size-outline-comfortable);outline-color:var(--ids-comp-accordion-summary-focused-outline-color-dark-focused)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-accordion-item-title{font-family:var(--ids-comp-accordion-summary-typography-font-family-comfortable);font-size:var(--ids-comp-accordion-summary-typography-font-size-comfortable);font-weight:var(--ids-comp-accordion-summary-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-accordion-summary-typography-letter-spacing-comfortable);line-height:var(--ids-comp-accordion-summary-typography-line-height-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-icon{font-size:var(--ids-comp-accordion-summary-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-accordion-summary-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-accordion-summary-icon-typography-line-height-comfortable);width:var(--ids-comp-accordion-summary-size-icon-comfortable);height:var(--ids-comp-accordion-summary-size-icon-comfortable)}.ids-accordion.ids-accordion-comfortable>.ids-accordion-item>.ids-accordion-item-content{padding:var(--ids-comp-accordion-details-size-padding-y-comfortable) var(--ids-comp-accordion-details-size-padding-x-comfortable);gap:var(--ids-comp-accordion-details-size-gap-comfortable)}.ids-accordion.ids-accordion-spacious{padding:var(--ids-comp-accordion-container-size-padding-y-spacious) var(--ids-comp-accordion-container-size-padding-x-spacious);gap:var(--ids-comp-accordion-container-size-gap-spacious);border-radius:var(--ids-comp-accordion-container-size-border-radius-spacious);border-width:var(--ids-comp-accordion-container-size-border-width-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-controls{padding:var(--ids-comp-accordion-controls-size-padding-y-spacious) var(--ids-comp-accordion-controls-size-padding-x-spacious);gap:var(--ids-comp-accordion-controls-size-gap-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item{padding:var(--ids-comp-accordion-item-size-padding-y-spacious) var(--ids-comp-accordion-item-size-padding-x-spacious);gap:var(--ids-comp-accordion-item-size-gap-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{height:var(--ids-comp-accordion-summary-size-height-spacious);padding:var(--ids-comp-accordion-summary-size-padding-y-spacious) var(--ids-comp-accordion-summary-size-padding-x-spacious);gap:var(--ids-comp-accordion-summary-size-gap-spacious);border-radius:var(--ids-comp-accordion-summary-size-border-radius-spacious);border-width:var(--ids-comp-accordion-summary-size-border-width-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-spacious>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible{outline-width:var(--ids-comp-accordion-summary-focused-outline-size-outline-spacious);outline-color:var(--ids-comp-accordion-summary-focused-outline-color-dark-focused)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-accordion-item-title{font-family:var(--ids-comp-accordion-summary-typography-font-family-spacious);font-size:var(--ids-comp-accordion-summary-typography-font-size-spacious);font-weight:var(--ids-comp-accordion-summary-typography-font-weight-spacious);letter-spacing:var(--ids-comp-accordion-summary-typography-letter-spacing-spacious);line-height:var(--ids-comp-accordion-summary-typography-line-height-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-icon{font-size:var(--ids-comp-accordion-summary-icon-typography-font-size-spacious);font-weight:var(--ids-comp-accordion-summary-icon-typography-font-weight-spacious);line-height:var(--ids-comp-accordion-summary-icon-typography-line-height-spacious);width:var(--ids-comp-accordion-summary-size-icon-spacious);height:var(--ids-comp-accordion-summary-size-icon-spacious)}.ids-accordion.ids-accordion-spacious>.ids-accordion-item>.ids-accordion-item-content{padding:var(--ids-comp-accordion-details-size-padding-y-spacious) var(--ids-comp-accordion-details-size-padding-x-spacious);gap:var(--ids-comp-accordion-details-size-gap-spacious)}.ids-accordion.ids-accordion-dense{padding:var(--ids-comp-accordion-container-size-padding-y-dense) var(--ids-comp-accordion-container-size-padding-x-dense);gap:var(--ids-comp-accordion-container-size-gap-dense);border-radius:var(--ids-comp-accordion-container-size-border-radius-dense);border-width:var(--ids-comp-accordion-container-size-border-width-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-controls{padding:var(--ids-comp-accordion-controls-size-padding-y-dense) var(--ids-comp-accordion-controls-size-padding-x-dense);gap:var(--ids-comp-accordion-controls-size-gap-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item{padding:var(--ids-comp-accordion-item-size-padding-y-dense) var(--ids-comp-accordion-item-size-padding-x-dense);gap:var(--ids-comp-accordion-item-size-gap-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{height:var(--ids-comp-accordion-summary-size-height-dense);padding:var(--ids-comp-accordion-summary-size-padding-y-dense) var(--ids-comp-accordion-summary-size-padding-x-dense);gap:var(--ids-comp-accordion-summary-size-gap-dense);border-radius:var(--ids-comp-accordion-summary-size-border-radius-dense);border-width:var(--ids-comp-accordion-summary-size-border-width-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-dense>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible{outline-width:var(--ids-comp-accordion-summary-focused-outline-size-outline-dense);outline-color:var(--ids-comp-accordion-summary-focused-outline-color-dark-focused)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-accordion-item-title{font-family:var(--ids-comp-accordion-summary-typography-font-family-dense);font-size:var(--ids-comp-accordion-summary-typography-font-size-dense);font-weight:var(--ids-comp-accordion-summary-typography-font-weight-dense);letter-spacing:var(--ids-comp-accordion-summary-typography-letter-spacing-dense);line-height:var(--ids-comp-accordion-summary-typography-line-height-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-icon{font-size:var(--ids-comp-accordion-summary-icon-typography-font-size-dense);font-weight:var(--ids-comp-accordion-summary-icon-typography-font-weight-dense);line-height:var(--ids-comp-accordion-summary-icon-typography-line-height-dense);width:var(--ids-comp-accordion-summary-size-icon-dense);height:var(--ids-comp-accordion-summary-size-icon-dense)}.ids-accordion.ids-accordion-dense>.ids-accordion-item>.ids-accordion-item-content{padding:var(--ids-comp-accordion-details-size-padding-y-dense) var(--ids-comp-accordion-details-size-padding-x-dense);gap:var(--ids-comp-accordion-details-size-gap-dense)}.ids-accordion.ids-accordion-text{border-color:var(--ids-comp-accordion-container-color-border-default);background-color:var(--ids-comp-accordion-container-color-bg-default)}.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{background:var(--ids-comp-accordion-summary-text-color-bg-default);border-color:var(--ids-comp-accordion-summary-text-color-border-default);color:var(--ids-comp-accordion-summary-text-color-fg-label-default)}.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-default)}.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:hover{background:var(--ids-comp-accordion-summary-text-color-bg-hovered);border-color:var(--ids-comp-accordion-summary-text-color-border-hovered);color:var(--ids-comp-accordion-summary-text-color-fg-label-hovered)}.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:hover>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-hovered)}.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible{background:var(--ids-comp-accordion-summary-text-color-bg-focused);border-color:var(--ids-comp-accordion-summary-text-color-border-focused);color:var(--ids-comp-accordion-summary-text-color-fg-label-focused)}.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus>.ids-icon,.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-focused)}.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:active{background:var(--ids-comp-accordion-summary-text-color-bg-pressed);border-color:var(--ids-comp-accordion-summary-text-color-border-pressed);color:var(--ids-comp-accordion-summary-text-color-fg-label-pressed)}.ids-accordion.ids-accordion-text .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:active>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-pressed)}.ids-accordion.ids-accordion-text .ids-accordion-item.ids-accordion-item-disabled>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{background:var(--ids-comp-accordion-summary-text-color-bg-disabled);border-color:var(--ids-comp-accordion-summary-text-color-border-disabled);color:var(--ids-comp-accordion-summary-text-color-fg-label-disabled)}.ids-accordion.ids-accordion-text .ids-accordion-item.ids-accordion-item-disabled>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-icon{color:var(--ids-comp-accordion-summary-text-color-fg-icon-disabled)}.ids-accordion.ids-accordion-filled{border-color:var(--ids-comp-accordion-container-color-border-default);background-color:var(--ids-comp-accordion-container-color-bg-default)}.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{background:var(--ids-comp-accordion-summary-filled-color-bg-default);border-color:var(--ids-comp-accordion-summary-filled-color-border-default);color:var(--ids-comp-accordion-summary-filled-color-fg-label-default)}.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-default)}.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:hover{background:var(--ids-comp-accordion-summary-filled-color-bg-hovered);border-color:var(--ids-comp-accordion-summary-filled-color-border-hovered);color:var(--ids-comp-accordion-summary-filled-color-fg-label-hovered)}.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:hover>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-hovered)}.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus,.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible{background:var(--ids-comp-accordion-summary-filled-color-bg-focused);border-color:var(--ids-comp-accordion-summary-filled-color-border-focused);color:var(--ids-comp-accordion-summary-filled-color-fg-label-focused)}.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus>.ids-icon,.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:focus-visible>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-focused)}.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:active{background:var(--ids-comp-accordion-summary-filled-color-bg-pressed);border-color:var(--ids-comp-accordion-summary-filled-color-border-pressed);color:var(--ids-comp-accordion-summary-filled-color-fg-label-pressed)}.ids-accordion.ids-accordion-filled .ids-accordion-item>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary:active>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-pressed)}.ids-accordion.ids-accordion-filled .ids-accordion-item.ids-accordion-item-disabled>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary{background:var(--ids-comp-accordion-summary-filled-color-bg-disabled);border-color:var(--ids-comp-accordion-summary-filled-color-border-disabled);color:var(--ids-comp-accordion-summary-filled-color-fg-label-disabled)}.ids-accordion.ids-accordion-filled .ids-accordion-item.ids-accordion-item-disabled>:is(h1,h2,h3,h4,h5,h6)>.ids-accordion-item-summary>.ids-icon{color:var(--ids-comp-accordion-summary-filled-color-fg-icon-disabled)}