@i-cell/ids-styles 0.0.71 → 0.0.73

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 (19) hide show
  1. package/dist/components.css +53 -39
  2. package/dist/components.min.css +1 -1
  3. package/dist/components.plugin.js +50 -12
  4. package/dist/datepicker/datepicker.css +31 -2
  5. package/dist/datepicker/datepicker.min.css +1 -1
  6. package/dist/datepicker/datepicker.plugin.js +32 -2
  7. package/dist/dialog/dialog.css +0 -1
  8. package/dist/dialog/dialog.min.css +1 -1
  9. package/dist/dialog/dialog.plugin.js +0 -1
  10. package/dist/divider/divider.css +1 -0
  11. package/dist/divider/divider.min.css +1 -1
  12. package/dist/divider/divider.plugin.js +1 -0
  13. package/dist/radio/radio.css +1 -0
  14. package/dist/radio/radio.min.css +1 -1
  15. package/dist/radio/radio.plugin.js +1 -1
  16. package/dist/side-nav/side-nav.css +20 -36
  17. package/dist/side-nav/side-nav.min.css +1 -1
  18. package/dist/side-nav/side-nav.plugin.js +16 -8
  19. package/package.json +1 -1
package/dist/components.plugin.js CHANGED
@@ -5336,11 +5336,10 @@ module.exports = function ComponentsPlugin() {
5336
5336
  boxSizing: 'border-box',
5337
5337
  borderWidth: '1px',
5338
5338
  borderStyle: 'solid',
5339
- borderColor: '#d3d3d3',
5339
+ borderColor: 'rgba(0,0,0,0)',
5340
5340
  lineHeight: 1.5,
5341
5341
  display: 'flex',
5342
5342
  flexDirection: 'column',
5343
- backgroundColor: '#fff',
5344
5343
  },
5345
5344
  '.ids-calendar::before,.ids-calendar::after,.ids-calendar *,.ids-calendar ::before,.ids-calendar ::after': {
5346
5345
  boxSizing: 'border-box',
@@ -5362,6 +5361,7 @@ module.exports = function ComponentsPlugin() {
5362
5361
  '.ids-calendar.ids-calendar-compact': {
5363
5362
  gap: 'var(--ids-comp-date-picker-size-gap-compact)',
5364
5363
  padding: 'var(--ids-comp-date-picker-size-padding-y-compact) var(--ids-comp-date-picker-size-padding-x-compact)',
5364
+ borderRadius: 'var(--ids-comp-overlay-panel-size-border-radius-compact)',
5365
5365
  },
5366
5366
  '.ids-calendar.ids-calendar-compact .ids-calendar-grid': {
5367
5367
  columnGap: 'var(--ids-comp-date-picker-calendar-size-column-gap-compact)',
@@ -5402,6 +5402,7 @@ module.exports = function ComponentsPlugin() {
5402
5402
  '.ids-calendar.ids-calendar-comfortable': {
5403
5403
  gap: 'var(--ids-comp-date-picker-size-gap-comfortable)',
5404
5404
  padding: 'var(--ids-comp-date-picker-size-padding-y-comfortable) var(--ids-comp-date-picker-size-padding-x-comfortable)',
5405
+ borderRadius: 'var(--ids-comp-overlay-panel-size-border-radius-comfortable)',
5405
5406
  },
5406
5407
  '.ids-calendar.ids-calendar-comfortable .ids-calendar-grid': {
5407
5408
  columnGap: 'var(--ids-comp-date-picker-calendar-size-column-gap-comfortable)',
@@ -5443,6 +5444,7 @@ module.exports = function ComponentsPlugin() {
5443
5444
  '.ids-calendar.ids-calendar-spacious': {
5444
5445
  gap: 'var(--ids-comp-date-picker-size-gap-spacious)',
5445
5446
  padding: 'var(--ids-comp-date-picker-size-padding-y-spacious) var(--ids-comp-date-picker-size-padding-x-spacious)',
5447
+ borderRadius: 'var(--ids-comp-overlay-panel-size-border-radius-spacious)',
5446
5448
  },
5447
5449
  '.ids-calendar.ids-calendar-spacious .ids-calendar-grid': {
5448
5450
  columnGap: 'var(--ids-comp-date-picker-calendar-size-column-gap-spacious)',
@@ -5484,6 +5486,7 @@ module.exports = function ComponentsPlugin() {
5484
5486
  '.ids-calendar.ids-calendar-dense': {
5485
5487
  gap: 'var(--ids-comp-date-picker-size-gap-dense)',
5486
5488
  padding: 'var(--ids-comp-date-picker-size-padding-y-dense) var(--ids-comp-date-picker-size-padding-x-dense)',
5489
+ borderRadius: 'var(--ids-comp-overlay-panel-size-border-radius-dense)',
5487
5490
  },
5488
5491
  '.ids-calendar.ids-calendar-dense .ids-calendar-grid': {
5489
5492
  columnGap: 'var(--ids-comp-date-picker-calendar-size-column-gap-dense)',
@@ -5521,6 +5524,15 @@ module.exports = function ComponentsPlugin() {
5521
5524
  '.ids-calendar.ids-calendar-dense .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible)': {
5522
5525
  outlineWidth: 'var(--ids-comp-date-picker-focused-outline-size-outline-dense)',
5523
5526
  },
5527
+ '.ids-calendar.ids-calendar-filled': { boxShadow: 'none' },
5528
+ '.ids-calendar.ids-calendar-outlined': {
5529
+ boxShadow:
5530
+ 'var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxs) var(--ids-smc-reference-container-effects-shadow-blur-xxs) var(--ids-smc-reference-container-effects-shadow-spread-none) var(--ids-smc-reference-container-effects-shadow-color-dark-lighter)',
5531
+ },
5532
+ '.ids-calendar.ids-calendar-elevated': {
5533
+ boxShadow:
5534
+ 'var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxl) var(--ids-smc-reference-container-effects-shadow-blur-xxxl) var(--ids-smc-reference-container-effects-shadow-spread-xxs) var(--ids-smc-reference-container-effects-shadow-color-dark-default)',
5535
+ },
5524
5536
  '.ids-calendar.ids-calendar-surface .ids-calendar-cell': {
5525
5537
  backgroundColor: 'var(--ids-comp-date-picker-cell-unselected-color-bg-surface-default)',
5526
5538
  borderColor: 'var(--ids-comp-date-picker-cell-unselected-color-border-surface-default)',
@@ -5597,6 +5609,24 @@ module.exports = function ComponentsPlugin() {
5597
5609
  '.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible)': {
5598
5610
  outlineColor: 'var(--ids-comp-date-picker-focused-outline-color-dark)',
5599
5611
  },
5612
+ '.ids-calendar.ids-calendar-filled.ids-calendar-surface': {
5613
+ background: 'var(--ids-comp-overlay-panel-filled-color-bg-surface-default)',
5614
+ },
5615
+ '.ids-calendar.ids-calendar-filled.ids-calendar-surface.ids-calendar-outlined': {
5616
+ borderColor: 'var(--ids-comp-overlay-panel-filled-color-border-surface-default)',
5617
+ },
5618
+ '.ids-calendar.ids-calendar-outlined.ids-calendar-surface': {
5619
+ background: 'var(--ids-comp-overlay-panel-outlined-color-bg-surface-default)',
5620
+ },
5621
+ '.ids-calendar.ids-calendar-outlined.ids-calendar-surface.ids-calendar-outlined': {
5622
+ borderColor: 'var(--ids-comp-overlay-panel-outlined-color-border-surface-default)',
5623
+ },
5624
+ '.ids-calendar.ids-calendar-elevated.ids-calendar-surface': {
5625
+ background: 'var(--ids-comp-overlay-panel-elevated-color-bg-surface-default)',
5626
+ },
5627
+ '.ids-calendar.ids-calendar-elevated.ids-calendar-surface.ids-calendar-outlined': {
5628
+ borderColor: 'var(--ids-comp-overlay-panel-elevated-color-border-surface-default)',
5629
+ },
5600
5630
  '.ids-year-selector>.ids-year-selector__years-grid': {
5601
5631
  display: 'grid',
5602
5632
  gridTemplateColumns: 'repeat(4, 1fr)',
@@ -5642,7 +5672,6 @@ module.exports = function ComponentsPlugin() {
5642
5672
  },
5643
5673
  '.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content': { display: 'grid' },
5644
5674
  '.ids-dialog .ids-dialog-container .ids-dialog-content': {
5645
- display: 'flex',
5646
5675
  overflowY: 'auto',
5647
5676
  background: 'var(--ids-comp-dialog-content-color-bg-default)',
5648
5677
  },
@@ -5845,6 +5874,7 @@ module.exports = function ComponentsPlugin() {
5845
5874
  borderColor: 'rgba(0,0,0,0)',
5846
5875
  lineHeight: 1.5,
5847
5876
  display: 'flex',
5877
+ flexShrink: 0,
5848
5878
  alignItems: 'center',
5849
5879
  justifyContent: 'center',
5850
5880
  },
@@ -9788,7 +9818,7 @@ module.exports = function ComponentsPlugin() {
9788
9818
  '.ids-radio-group>.ids-radio-group__legend>.ids-radio-group__legend-container>.ids-radio-group__legend-label': {
9789
9819
  fontStyle: 'normal',
9790
9820
  },
9791
- '.ids-radio-group>.ids-radio-group__list': { display: 'flex' },
9821
+ '.ids-radio-group>.ids-radio-group__list': { display: 'flex', width: 'inherit' },
9792
9822
  '.ids-radio-group.ids-radio-group-horizontal>.ids-radio-group__list': { flexDirection: 'row', alignItems: 'center' },
9793
9823
  '.ids-radio-group.ids-radio-group-horizontal.ids-radio-group-top>.ids-radio-group__list': { alignItems: 'flex-end' },
9794
9824
  '.ids-radio-group.ids-radio-group-horizontal.ids-radio-group-bottom>.ids-radio-group__list': { alignItems: 'flex-start' },
@@ -11675,9 +11705,11 @@ module.exports = function ComponentsPlugin() {
11675
11705
  marginRight: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-compact)*-1)',
11676
11706
  },
11677
11707
  '.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded': {
11708
+ '--submenu-items-gap-count': 'max(calc(var(--submenu-items-count) - 1), 0)',
11678
11709
  '--submenu-item-height':
11679
- 'calc( max( var(--ids-comp-sidenav-navitem-single-size-height-compact), var(--ids-comp-sidenav-navitem-expandable-summary-size-height-compact) ) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-compact) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-compact) + calc(var(--ids-comp-sidenav-navitem-expandable-submenu-gap-compact) * var(--submenu-items-count)) )',
11680
- maxHeight: 'calc(var(--submenu-items-count)*var(--submenu-item-height))',
11710
+ 'max( var(--ids-comp-sidenav-navitem-single-size-height-compact), var(--ids-comp-sidenav-navitem-expandable-summary-size-height-compact) )',
11711
+ maxHeight:
11712
+ 'calc(var(--submenu-items-count)*var(--submenu-item-height) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-compact) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-compact) + var(--submenu-items-gap-count)*(var(--ids-comp-sidenav-navitem-expandable-submenu-gap-compact) + var(--ids-comp-sidenav-section-list-size-gap-compact)))',
11681
11713
  gap: 'var(--ids-comp-sidenav-navitem-expandable-submenu-gap-compact)',
11682
11714
  padding:
11683
11715
  'var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-compact) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-right-compact) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-compact) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-compact)',
@@ -11787,9 +11819,11 @@ module.exports = function ComponentsPlugin() {
11787
11819
  marginRight: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-comfortable)*-1)',
11788
11820
  },
11789
11821
  '.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded': {
11822
+ '--submenu-items-gap-count': 'max(calc(var(--submenu-items-count) - 1), 0)',
11790
11823
  '--submenu-item-height':
11791
- 'calc( max( var(--ids-comp-sidenav-navitem-single-size-height-comfortable), var(--ids-comp-sidenav-navitem-expandable-summary-size-height-comfortable) ) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-comfortable) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-comfortable) + calc(var(--ids-comp-sidenav-navitem-expandable-submenu-gap-comfortable) * var(--submenu-items-count)) )',
11792
- maxHeight: 'calc(var(--submenu-items-count)*var(--submenu-item-height))',
11824
+ 'max( var(--ids-comp-sidenav-navitem-single-size-height-comfortable), var(--ids-comp-sidenav-navitem-expandable-summary-size-height-comfortable) )',
11825
+ maxHeight:
11826
+ 'calc(var(--submenu-items-count)*var(--submenu-item-height) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-comfortable) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-comfortable) + var(--submenu-items-gap-count)*(var(--ids-comp-sidenav-navitem-expandable-submenu-gap-comfortable) + var(--ids-comp-sidenav-section-list-size-gap-comfortable)))',
11793
11827
  gap: 'var(--ids-comp-sidenav-navitem-expandable-submenu-gap-comfortable)',
11794
11828
  padding:
11795
11829
  'var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-comfortable) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-right-comfortable) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-comfortable) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-comfortable)',
@@ -11899,9 +11933,11 @@ module.exports = function ComponentsPlugin() {
11899
11933
  marginRight: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-spacious)*-1)',
11900
11934
  },
11901
11935
  '.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded': {
11936
+ '--submenu-items-gap-count': 'max(calc(var(--submenu-items-count) - 1), 0)',
11902
11937
  '--submenu-item-height':
11903
- 'calc( max( var(--ids-comp-sidenav-navitem-single-size-height-spacious), var(--ids-comp-sidenav-navitem-expandable-summary-size-height-spacious) ) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-spacious) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-spacious) + calc(var(--ids-comp-sidenav-navitem-expandable-submenu-gap-spacious) * var(--submenu-items-count)) )',
11904
- maxHeight: 'calc(var(--submenu-items-count)*var(--submenu-item-height))',
11938
+ 'max( var(--ids-comp-sidenav-navitem-single-size-height-spacious), var(--ids-comp-sidenav-navitem-expandable-summary-size-height-spacious) )',
11939
+ maxHeight:
11940
+ 'calc(var(--submenu-items-count)*var(--submenu-item-height) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-spacious) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-spacious) + var(--submenu-items-gap-count)*(var(--ids-comp-sidenav-navitem-expandable-submenu-gap-spacious) + var(--ids-comp-sidenav-section-list-size-gap-spacious)))',
11905
11941
  gap: 'var(--ids-comp-sidenav-navitem-expandable-submenu-gap-spacious)',
11906
11942
  padding:
11907
11943
  'var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-spacious) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-right-spacious) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-spacious) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-spacious)',
@@ -12009,9 +12045,11 @@ module.exports = function ComponentsPlugin() {
12009
12045
  marginRight: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-dense)*-1)',
12010
12046
  },
12011
12047
  '.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded': {
12048
+ '--submenu-items-gap-count': 'max(calc(var(--submenu-items-count) - 1), 0)',
12012
12049
  '--submenu-item-height':
12013
- 'calc( max( var(--ids-comp-sidenav-navitem-single-size-height-dense), var(--ids-comp-sidenav-navitem-expandable-summary-size-height-dense) ) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-dense) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-dense) + calc(var(--ids-comp-sidenav-navitem-expandable-submenu-gap-dense) * var(--submenu-items-count)) )',
12014
- maxHeight: 'calc(var(--submenu-items-count)*var(--submenu-item-height))',
12050
+ 'max( var(--ids-comp-sidenav-navitem-single-size-height-dense), var(--ids-comp-sidenav-navitem-expandable-summary-size-height-dense) )',
12051
+ maxHeight:
12052
+ 'calc(var(--submenu-items-count)*var(--submenu-item-height) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-dense) + var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-dense) + var(--submenu-items-gap-count)*(var(--ids-comp-sidenav-navitem-expandable-submenu-gap-dense) + var(--ids-comp-sidenav-section-list-size-gap-dense)))',
12015
12053
  gap: 'var(--ids-comp-sidenav-navitem-expandable-submenu-gap-dense)',
12016
12054
  padding:
12017
12055
  'var(--ids-comp-sidenav-navitem-expandable-submenu-padding-top-dense) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-right-dense) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-bottom-dense) var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-dense)',
package/dist/datepicker/datepicker.css CHANGED
@@ -15,10 +15,8 @@
15
15
  .ids-calendar {
16
16
  display: flex;
17
17
  flex-direction: column;
18
- background-color: white;
19
18
  border-width: 1px;
20
19
  border-style: solid;
21
- border-color: lightgrey;
22
20
  }
23
21
  .ids-calendar > .ids-calendar__header {
24
22
  display: flex;
@@ -49,6 +47,7 @@
49
47
  .ids-calendar.ids-calendar-compact {
50
48
  gap: var(--ids-comp-date-picker-size-gap-compact);
51
49
  padding: var(--ids-comp-date-picker-size-padding-y-compact) var(--ids-comp-date-picker-size-padding-x-compact);
50
+ border-radius: var(--ids-comp-overlay-panel-size-border-radius-compact);
52
51
  }
53
52
  .ids-calendar.ids-calendar-compact .ids-calendar-grid {
54
53
  column-gap: var(--ids-comp-date-picker-calendar-size-column-gap-compact);
@@ -88,6 +87,7 @@
88
87
  .ids-calendar.ids-calendar-comfortable {
89
88
  gap: var(--ids-comp-date-picker-size-gap-comfortable);
90
89
  padding: var(--ids-comp-date-picker-size-padding-y-comfortable) var(--ids-comp-date-picker-size-padding-x-comfortable);
90
+ border-radius: var(--ids-comp-overlay-panel-size-border-radius-comfortable);
91
91
  }
92
92
  .ids-calendar.ids-calendar-comfortable .ids-calendar-grid {
93
93
  column-gap: var(--ids-comp-date-picker-calendar-size-column-gap-comfortable);
@@ -127,6 +127,7 @@
127
127
  .ids-calendar.ids-calendar-spacious {
128
128
  gap: var(--ids-comp-date-picker-size-gap-spacious);
129
129
  padding: var(--ids-comp-date-picker-size-padding-y-spacious) var(--ids-comp-date-picker-size-padding-x-spacious);
130
+ border-radius: var(--ids-comp-overlay-panel-size-border-radius-spacious);
130
131
  }
131
132
  .ids-calendar.ids-calendar-spacious .ids-calendar-grid {
132
133
  column-gap: var(--ids-comp-date-picker-calendar-size-column-gap-spacious);
@@ -166,6 +167,7 @@
166
167
  .ids-calendar.ids-calendar-dense {
167
168
  gap: var(--ids-comp-date-picker-size-gap-dense);
168
169
  padding: var(--ids-comp-date-picker-size-padding-y-dense) var(--ids-comp-date-picker-size-padding-x-dense);
170
+ border-radius: var(--ids-comp-overlay-panel-size-border-radius-dense);
169
171
  }
170
172
  .ids-calendar.ids-calendar-dense .ids-calendar-grid {
171
173
  column-gap: var(--ids-comp-date-picker-calendar-size-column-gap-dense);
@@ -202,6 +204,15 @@
202
204
  .ids-calendar.ids-calendar-dense .ids-calendar-cell > .ids-calendar-button:is(:focus, :focus-visible) {
203
205
  outline-width: var(--ids-comp-date-picker-focused-outline-size-outline-dense);
204
206
  }
207
+ .ids-calendar.ids-calendar-filled {
208
+ box-shadow: none;
209
+ }
210
+ .ids-calendar.ids-calendar-outlined {
211
+ box-shadow: var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxs) var(--ids-smc-reference-container-effects-shadow-blur-xxs) var(--ids-smc-reference-container-effects-shadow-spread-none) var(--ids-smc-reference-container-effects-shadow-color-dark-lighter);
212
+ }
213
+ .ids-calendar.ids-calendar-elevated {
214
+ box-shadow: var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxl) var(--ids-smc-reference-container-effects-shadow-blur-xxxl) var(--ids-smc-reference-container-effects-shadow-spread-xxs) var(--ids-smc-reference-container-effects-shadow-color-dark-default);
215
+ }
205
216
  .ids-calendar.ids-calendar-surface .ids-calendar-cell {
206
217
  background-color: var(--ids-comp-date-picker-cell-unselected-color-bg-surface-default);
207
218
  border-color: var(--ids-comp-date-picker-cell-unselected-color-border-surface-default);
@@ -278,6 +289,24 @@
278
289
  .ids-calendar.ids-calendar-surface .ids-calendar-cell > .ids-calendar-button:is(:focus, :focus-visible) {
279
290
  outline-color: var(--ids-comp-date-picker-focused-outline-color-dark);
280
291
  }
292
+ .ids-calendar.ids-calendar-filled.ids-calendar-surface {
293
+ background: var(--ids-comp-overlay-panel-filled-color-bg-surface-default);
294
+ }
295
+ .ids-calendar.ids-calendar-filled.ids-calendar-surface.ids-calendar-outlined {
296
+ border-color: var(--ids-comp-overlay-panel-filled-color-border-surface-default);
297
+ }
298
+ .ids-calendar.ids-calendar-outlined.ids-calendar-surface {
299
+ background: var(--ids-comp-overlay-panel-outlined-color-bg-surface-default);
300
+ }
301
+ .ids-calendar.ids-calendar-outlined.ids-calendar-surface.ids-calendar-outlined {
302
+ border-color: var(--ids-comp-overlay-panel-outlined-color-border-surface-default);
303
+ }
304
+ .ids-calendar.ids-calendar-elevated.ids-calendar-surface {
305
+ background: var(--ids-comp-overlay-panel-elevated-color-bg-surface-default);
306
+ }
307
+ .ids-calendar.ids-calendar-elevated.ids-calendar-surface.ids-calendar-outlined {
308
+ border-color: var(--ids-comp-overlay-panel-elevated-color-border-surface-default);
309
+ }
281
310
 
282
311
  .ids-year-selector > .ids-year-selector__years-grid {
283
312
  display: grid;
package/dist/datepicker/datepicker.min.css CHANGED
@@ -1 +1 @@
1
- .ids-calendar{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5}.ids-calendar::before,.ids-calendar::after,.ids-calendar *,.ids-calendar ::before,.ids-calendar ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-calendar{display:flex;flex-direction:column;background-color:#fff;border-width:1px;border-style:solid;border-color:#d3d3d3}.ids-calendar>.ids-calendar__header{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.ids-calendar .ids-calendar-cell{display:flex;flex-direction:row;align-items:center;justify-content:center}.ids-calendar .ids-calendar-cell>.ids-calendar-button{cursor:pointer;outline-style:none}.ids-calendar .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today{border-style:solid}.ids-calendar .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-style:solid;outline-offset:2px}.ids-calendar .ids-calendar-cell>.ids-calendar-button:disabled{cursor:default}.ids-calendar.ids-calendar-compact{gap:var(--ids-comp-date-picker-size-gap-compact);padding:var(--ids-comp-date-picker-size-padding-y-compact) var(--ids-comp-date-picker-size-padding-x-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-grid{column-gap:var(--ids-comp-date-picker-calendar-size-column-gap-compact);row-gap:var(--ids-comp-date-picker-calendar-size-row-gap-compact);padding:var(--ids-comp-date-picker-calendar-size-padding-y-compact) var(--ids-comp-date-picker-calendar-size-padding-x-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-cell{border-radius:var(--ids-comp-date-picker-calendar-cell-size-border-radius-compact);border-width:var(--ids-comp-date-picker-calendar-cell-size-border-width-compact);min-height:var(--ids-comp-date-picker-calendar-cell-size-min-height-compact);min-width:var(--ids-comp-date-picker-calendar-cell-size-min-width-compact);padding:var(--ids-comp-date-picker-calendar-cell-size-padding-y-compact) var(--ids-comp-date-picker-calendar-cell-size-padding-x-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-cell>.ids-calendar-weekday-label{font-family:var(--ids-comp-date-picker-calendar-days-typography-font-family-compact);font-size:var(--ids-comp-date-picker-calendar-days-typography-font-size-compact);font-weight:var(--ids-comp-date-picker-calendar-days-typography-font-weight-compact);letter-spacing:var(--ids-comp-date-picker-calendar-days-typography-letter-spacing-compact);line-height:var(--ids-comp-date-picker-calendar-days-typography-line-height-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-cell>.ids-calendar-button{border-width:var(--ids-comp-date-picker-calendar-button-size-border-width-compact);border-radius:var(--ids-comp-date-picker-calendar-button-size-border-radius-compact);min-width:var(--ids-comp-date-picker-calendar-button-size-min-width-compact);height:var(--ids-comp-date-picker-calendar-button-size-height-compact);padding-left:var(--ids-comp-date-picker-calendar-button-size-padding-x-compact);padding-right:var(--ids-comp-date-picker-calendar-button-size-padding-x-compact);font-family:var(--ids-comp-date-picker-calendar-button-typography-font-family-compact);font-size:var(--ids-comp-date-picker-calendar-button-typography-font-size-compact);font-weight:var(--ids-comp-date-picker-calendar-button-typography-font-weight-compact);letter-spacing:var(--ids-comp-date-picker-calendar-button-typography-letter-spacing-compact);line-height:var(--ids-comp-date-picker-calendar-button-typography-line-height-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-width:var(--ids-comp-date-picker-focused-outline-size-outline-compact)}.ids-calendar.ids-calendar-comfortable{gap:var(--ids-comp-date-picker-size-gap-comfortable);padding:var(--ids-comp-date-picker-size-padding-y-comfortable) var(--ids-comp-date-picker-size-padding-x-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-grid{column-gap:var(--ids-comp-date-picker-calendar-size-column-gap-comfortable);row-gap:var(--ids-comp-date-picker-calendar-size-row-gap-comfortable);padding:var(--ids-comp-date-picker-calendar-size-padding-y-comfortable) var(--ids-comp-date-picker-calendar-size-padding-x-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-cell{border-radius:var(--ids-comp-date-picker-calendar-cell-size-border-radius-comfortable);border-width:var(--ids-comp-date-picker-calendar-cell-size-border-width-comfortable);min-height:var(--ids-comp-date-picker-calendar-cell-size-min-height-comfortable);min-width:var(--ids-comp-date-picker-calendar-cell-size-min-width-comfortable);padding:var(--ids-comp-date-picker-calendar-cell-size-padding-y-comfortable) var(--ids-comp-date-picker-calendar-cell-size-padding-x-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-cell>.ids-calendar-weekday-label{font-family:var(--ids-comp-date-picker-calendar-days-typography-font-family-comfortable);font-size:var(--ids-comp-date-picker-calendar-days-typography-font-size-comfortable);font-weight:var(--ids-comp-date-picker-calendar-days-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-date-picker-calendar-days-typography-letter-spacing-comfortable);line-height:var(--ids-comp-date-picker-calendar-days-typography-line-height-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-cell>.ids-calendar-button{border-width:var(--ids-comp-date-picker-calendar-button-size-border-width-comfortable);border-radius:var(--ids-comp-date-picker-calendar-button-size-border-radius-comfortable);min-width:var(--ids-comp-date-picker-calendar-button-size-min-width-comfortable);height:var(--ids-comp-date-picker-calendar-button-size-height-comfortable);padding-left:var(--ids-comp-date-picker-calendar-button-size-padding-x-comfortable);padding-right:var(--ids-comp-date-picker-calendar-button-size-padding-x-comfortable);font-family:var(--ids-comp-date-picker-calendar-button-typography-font-family-comfortable);font-size:var(--ids-comp-date-picker-calendar-button-typography-font-size-comfortable);font-weight:var(--ids-comp-date-picker-calendar-button-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-date-picker-calendar-button-typography-letter-spacing-comfortable);line-height:var(--ids-comp-date-picker-calendar-button-typography-line-height-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-width:var(--ids-comp-date-picker-focused-outline-size-outline-comfortable)}.ids-calendar.ids-calendar-spacious{gap:var(--ids-comp-date-picker-size-gap-spacious);padding:var(--ids-comp-date-picker-size-padding-y-spacious) var(--ids-comp-date-picker-size-padding-x-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-grid{column-gap:var(--ids-comp-date-picker-calendar-size-column-gap-spacious);row-gap:var(--ids-comp-date-picker-calendar-size-row-gap-spacious);padding:var(--ids-comp-date-picker-calendar-size-padding-y-spacious) var(--ids-comp-date-picker-calendar-size-padding-x-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-cell{border-radius:var(--ids-comp-date-picker-calendar-cell-size-border-radius-spacious);border-width:var(--ids-comp-date-picker-calendar-cell-size-border-width-spacious);min-height:var(--ids-comp-date-picker-calendar-cell-size-min-height-spacious);min-width:var(--ids-comp-date-picker-calendar-cell-size-min-width-spacious);padding:var(--ids-comp-date-picker-calendar-cell-size-padding-y-spacious) var(--ids-comp-date-picker-calendar-cell-size-padding-x-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-cell>.ids-calendar-weekday-label{font-family:var(--ids-comp-date-picker-calendar-days-typography-font-family-spacious);font-size:var(--ids-comp-date-picker-calendar-days-typography-font-size-spacious);font-weight:var(--ids-comp-date-picker-calendar-days-typography-font-weight-spacious);letter-spacing:var(--ids-comp-date-picker-calendar-days-typography-letter-spacing-spacious);line-height:var(--ids-comp-date-picker-calendar-days-typography-line-height-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-cell>.ids-calendar-button{border-width:var(--ids-comp-date-picker-calendar-button-size-border-width-spacious);border-radius:var(--ids-comp-date-picker-calendar-button-size-border-radius-spacious);min-width:var(--ids-comp-date-picker-calendar-button-size-min-width-spacious);height:var(--ids-comp-date-picker-calendar-button-size-height-spacious);padding-left:var(--ids-comp-date-picker-calendar-button-size-padding-x-spacious);padding-right:var(--ids-comp-date-picker-calendar-button-size-padding-x-spacious);font-family:var(--ids-comp-date-picker-calendar-button-typography-font-family-spacious);font-size:var(--ids-comp-date-picker-calendar-button-typography-font-size-spacious);font-weight:var(--ids-comp-date-picker-calendar-button-typography-font-weight-spacious);letter-spacing:var(--ids-comp-date-picker-calendar-button-typography-letter-spacing-spacious);line-height:var(--ids-comp-date-picker-calendar-button-typography-line-height-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-width:var(--ids-comp-date-picker-focused-outline-size-outline-spacious)}.ids-calendar.ids-calendar-dense{gap:var(--ids-comp-date-picker-size-gap-dense);padding:var(--ids-comp-date-picker-size-padding-y-dense) var(--ids-comp-date-picker-size-padding-x-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-grid{column-gap:var(--ids-comp-date-picker-calendar-size-column-gap-dense);row-gap:var(--ids-comp-date-picker-calendar-size-row-gap-dense);padding:var(--ids-comp-date-picker-calendar-size-padding-y-dense) var(--ids-comp-date-picker-calendar-size-padding-x-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-cell{border-radius:var(--ids-comp-date-picker-calendar-cell-size-border-radius-dense);border-width:var(--ids-comp-date-picker-calendar-cell-size-border-width-dense);min-height:var(--ids-comp-date-picker-calendar-cell-size-min-height-dense);min-width:var(--ids-comp-date-picker-calendar-cell-size-min-width-dense);padding:var(--ids-comp-date-picker-calendar-cell-size-padding-y-dense) var(--ids-comp-date-picker-calendar-cell-size-padding-x-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-cell>.ids-calendar-weekday-label{font-family:var(--ids-comp-date-picker-calendar-days-typography-font-family-dense);font-size:var(--ids-comp-date-picker-calendar-days-typography-font-size-dense);font-weight:var(--ids-comp-date-picker-calendar-days-typography-font-weight-dense);letter-spacing:var(--ids-comp-date-picker-calendar-days-typography-letter-spacing-dense);line-height:var(--ids-comp-date-picker-calendar-days-typography-line-height-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-cell>.ids-calendar-button{border-width:var(--ids-comp-date-picker-calendar-button-size-border-width-dense);border-radius:var(--ids-comp-date-picker-calendar-button-size-border-radius-dense);min-width:var(--ids-comp-date-picker-calendar-button-size-min-width-dense);height:var(--ids-comp-date-picker-calendar-button-size-height-dense);padding-left:var(--ids-comp-date-picker-calendar-button-size-padding-x-dense);padding-right:var(--ids-comp-date-picker-calendar-button-size-padding-x-dense);font-family:var(--ids-comp-date-picker-calendar-button-typography-font-family-dense);font-size:var(--ids-comp-date-picker-calendar-button-typography-font-size-dense);font-weight:var(--ids-comp-date-picker-calendar-button-typography-font-weight-dense);letter-spacing:var(--ids-comp-date-picker-calendar-button-typography-letter-spacing-dense);line-height:var(--ids-comp-date-picker-calendar-button-typography-line-height-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-width:var(--ids-comp-date-picker-focused-outline-size-outline-dense)}.ids-calendar.ids-calendar-surface .ids-calendar-cell{background-color:var(--ids-comp-date-picker-cell-unselected-color-bg-surface-default);border-color:var(--ids-comp-date-picker-cell-unselected-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell.ids-calendar-cell-selected{background-color:var(--ids-comp-date-picker-cell-selected-color-bg-surface-default);border-color:var(--ids-comp-date-picker-cell-selected-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-weekday-label{color:var(--ids-comp-date-picker-calendar-days-color-fg-surface-default);background-color:var(--ids-comp-date-picker-calendar-days-color-bg-surface-default);border-color:var(--ids-comp-date-picker-calendar-days-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button{color:var(--ids-comp-date-picker-calendar-button-unselected-color-fg-surface-default);background-color:var(--ids-comp-date-picker-calendar-button-unselected-color-bg-surface-default);border-color:var(--ids-comp-date-picker-calendar-button-unselected-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:hover{color:var(--ids-comp-date-picker-calendar-button-unselected-color-fg-surface-hovered);background-color:var(--ids-comp-date-picker-calendar-button-unselected-color-bg-surface-hovered);border-color:var(--ids-comp-date-picker-calendar-button-unselected-color-border-surface-hovered)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:active{color:var(--ids-comp-date-picker-calendar-button-unselected-color-fg-surface-pressed);background-color:var(--ids-comp-date-picker-calendar-button-unselected-color-bg-surface-pressed);border-color:var(--ids-comp-date-picker-calendar-button-unselected-color-border-surface-pressed)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:disabled{color:var(--ids-comp-date-picker-calendar-button-unselected-color-fg-surface-disabled);background-color:var(--ids-comp-date-picker-calendar-button-unselected-color-bg-surface-disabled);border-color:var(--ids-comp-date-picker-calendar-button-unselected-color-border-surface-disabled)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today{color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-fg-surface-default);background-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-bg-surface-default);border-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today:hover{color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-fg-surface-hovered);background-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-bg-surface-hovered);border-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-border-surface-hovered)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today:active{color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-fg-surface-pressed);background-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-bg-surface-pressed);border-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-border-surface-pressed)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today:disabled{color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-fg-surface-disabled);background-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-bg-surface-disabled);border-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-border-surface-disabled)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-selected{color:var(--ids-comp-date-picker-calendar-button-selected-color-fg-surface-default);background-color:var(--ids-comp-date-picker-calendar-button-selected-color-bg-surface-default);border-color:var(--ids-comp-date-picker-calendar-button-selected-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-selected:hover{color:var(--ids-comp-date-picker-calendar-button-selected-color-fg-surface-hovered);background-color:var(--ids-comp-date-picker-calendar-button-selected-color-bg-surface-hovered);border-color:var(--ids-comp-date-picker-calendar-button-selected-color-border-surface-hovered)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-selected:active{color:var(--ids-comp-date-picker-calendar-button-selected-color-fg-surface-pressed);background-color:var(--ids-comp-date-picker-calendar-button-selected-color-bg-surface-pressed);border-color:var(--ids-comp-date-picker-calendar-button-selected-color-border-surface-pressed)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-selected:disabled{color:var(--ids-comp-date-picker-calendar-button-selected-color-fg-surface-disabled);background-color:var(--ids-comp-date-picker-calendar-button-selected-color-bg-surface-disabled);border-color:var(--ids-comp-date-picker-calendar-button-selected-color-border-surface-disabled)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-color:var(--ids-comp-date-picker-focused-outline-color-dark)}.ids-year-selector>.ids-year-selector__years-grid{display:grid;grid-template-columns:repeat(4, 1fr);align-items:center;justify-items:center}.ids-month-selector>.ids-month-selector__months-grid{display:grid;grid-template-columns:repeat(4, 1fr);align-items:center;justify-items:center}.ids-day-selector>.ids-day-selector__days-grid{display:grid;grid-template-columns:repeat(7, 1fr)}
1
+ .ids-calendar{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5}.ids-calendar::before,.ids-calendar::after,.ids-calendar *,.ids-calendar ::before,.ids-calendar ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-calendar{display:flex;flex-direction:column;border-width:1px;border-style:solid}.ids-calendar>.ids-calendar__header{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.ids-calendar .ids-calendar-cell{display:flex;flex-direction:row;align-items:center;justify-content:center}.ids-calendar .ids-calendar-cell>.ids-calendar-button{cursor:pointer;outline-style:none}.ids-calendar .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today{border-style:solid}.ids-calendar .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-style:solid;outline-offset:2px}.ids-calendar .ids-calendar-cell>.ids-calendar-button:disabled{cursor:default}.ids-calendar.ids-calendar-compact{gap:var(--ids-comp-date-picker-size-gap-compact);padding:var(--ids-comp-date-picker-size-padding-y-compact) var(--ids-comp-date-picker-size-padding-x-compact);border-radius:var(--ids-comp-overlay-panel-size-border-radius-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-grid{column-gap:var(--ids-comp-date-picker-calendar-size-column-gap-compact);row-gap:var(--ids-comp-date-picker-calendar-size-row-gap-compact);padding:var(--ids-comp-date-picker-calendar-size-padding-y-compact) var(--ids-comp-date-picker-calendar-size-padding-x-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-cell{border-radius:var(--ids-comp-date-picker-calendar-cell-size-border-radius-compact);border-width:var(--ids-comp-date-picker-calendar-cell-size-border-width-compact);min-height:var(--ids-comp-date-picker-calendar-cell-size-min-height-compact);min-width:var(--ids-comp-date-picker-calendar-cell-size-min-width-compact);padding:var(--ids-comp-date-picker-calendar-cell-size-padding-y-compact) var(--ids-comp-date-picker-calendar-cell-size-padding-x-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-cell>.ids-calendar-weekday-label{font-family:var(--ids-comp-date-picker-calendar-days-typography-font-family-compact);font-size:var(--ids-comp-date-picker-calendar-days-typography-font-size-compact);font-weight:var(--ids-comp-date-picker-calendar-days-typography-font-weight-compact);letter-spacing:var(--ids-comp-date-picker-calendar-days-typography-letter-spacing-compact);line-height:var(--ids-comp-date-picker-calendar-days-typography-line-height-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-cell>.ids-calendar-button{border-width:var(--ids-comp-date-picker-calendar-button-size-border-width-compact);border-radius:var(--ids-comp-date-picker-calendar-button-size-border-radius-compact);min-width:var(--ids-comp-date-picker-calendar-button-size-min-width-compact);height:var(--ids-comp-date-picker-calendar-button-size-height-compact);padding-left:var(--ids-comp-date-picker-calendar-button-size-padding-x-compact);padding-right:var(--ids-comp-date-picker-calendar-button-size-padding-x-compact);font-family:var(--ids-comp-date-picker-calendar-button-typography-font-family-compact);font-size:var(--ids-comp-date-picker-calendar-button-typography-font-size-compact);font-weight:var(--ids-comp-date-picker-calendar-button-typography-font-weight-compact);letter-spacing:var(--ids-comp-date-picker-calendar-button-typography-letter-spacing-compact);line-height:var(--ids-comp-date-picker-calendar-button-typography-line-height-compact)}.ids-calendar.ids-calendar-compact .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-width:var(--ids-comp-date-picker-focused-outline-size-outline-compact)}.ids-calendar.ids-calendar-comfortable{gap:var(--ids-comp-date-picker-size-gap-comfortable);padding:var(--ids-comp-date-picker-size-padding-y-comfortable) var(--ids-comp-date-picker-size-padding-x-comfortable);border-radius:var(--ids-comp-overlay-panel-size-border-radius-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-grid{column-gap:var(--ids-comp-date-picker-calendar-size-column-gap-comfortable);row-gap:var(--ids-comp-date-picker-calendar-size-row-gap-comfortable);padding:var(--ids-comp-date-picker-calendar-size-padding-y-comfortable) var(--ids-comp-date-picker-calendar-size-padding-x-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-cell{border-radius:var(--ids-comp-date-picker-calendar-cell-size-border-radius-comfortable);border-width:var(--ids-comp-date-picker-calendar-cell-size-border-width-comfortable);min-height:var(--ids-comp-date-picker-calendar-cell-size-min-height-comfortable);min-width:var(--ids-comp-date-picker-calendar-cell-size-min-width-comfortable);padding:var(--ids-comp-date-picker-calendar-cell-size-padding-y-comfortable) var(--ids-comp-date-picker-calendar-cell-size-padding-x-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-cell>.ids-calendar-weekday-label{font-family:var(--ids-comp-date-picker-calendar-days-typography-font-family-comfortable);font-size:var(--ids-comp-date-picker-calendar-days-typography-font-size-comfortable);font-weight:var(--ids-comp-date-picker-calendar-days-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-date-picker-calendar-days-typography-letter-spacing-comfortable);line-height:var(--ids-comp-date-picker-calendar-days-typography-line-height-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-cell>.ids-calendar-button{border-width:var(--ids-comp-date-picker-calendar-button-size-border-width-comfortable);border-radius:var(--ids-comp-date-picker-calendar-button-size-border-radius-comfortable);min-width:var(--ids-comp-date-picker-calendar-button-size-min-width-comfortable);height:var(--ids-comp-date-picker-calendar-button-size-height-comfortable);padding-left:var(--ids-comp-date-picker-calendar-button-size-padding-x-comfortable);padding-right:var(--ids-comp-date-picker-calendar-button-size-padding-x-comfortable);font-family:var(--ids-comp-date-picker-calendar-button-typography-font-family-comfortable);font-size:var(--ids-comp-date-picker-calendar-button-typography-font-size-comfortable);font-weight:var(--ids-comp-date-picker-calendar-button-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-date-picker-calendar-button-typography-letter-spacing-comfortable);line-height:var(--ids-comp-date-picker-calendar-button-typography-line-height-comfortable)}.ids-calendar.ids-calendar-comfortable .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-width:var(--ids-comp-date-picker-focused-outline-size-outline-comfortable)}.ids-calendar.ids-calendar-spacious{gap:var(--ids-comp-date-picker-size-gap-spacious);padding:var(--ids-comp-date-picker-size-padding-y-spacious) var(--ids-comp-date-picker-size-padding-x-spacious);border-radius:var(--ids-comp-overlay-panel-size-border-radius-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-grid{column-gap:var(--ids-comp-date-picker-calendar-size-column-gap-spacious);row-gap:var(--ids-comp-date-picker-calendar-size-row-gap-spacious);padding:var(--ids-comp-date-picker-calendar-size-padding-y-spacious) var(--ids-comp-date-picker-calendar-size-padding-x-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-cell{border-radius:var(--ids-comp-date-picker-calendar-cell-size-border-radius-spacious);border-width:var(--ids-comp-date-picker-calendar-cell-size-border-width-spacious);min-height:var(--ids-comp-date-picker-calendar-cell-size-min-height-spacious);min-width:var(--ids-comp-date-picker-calendar-cell-size-min-width-spacious);padding:var(--ids-comp-date-picker-calendar-cell-size-padding-y-spacious) var(--ids-comp-date-picker-calendar-cell-size-padding-x-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-cell>.ids-calendar-weekday-label{font-family:var(--ids-comp-date-picker-calendar-days-typography-font-family-spacious);font-size:var(--ids-comp-date-picker-calendar-days-typography-font-size-spacious);font-weight:var(--ids-comp-date-picker-calendar-days-typography-font-weight-spacious);letter-spacing:var(--ids-comp-date-picker-calendar-days-typography-letter-spacing-spacious);line-height:var(--ids-comp-date-picker-calendar-days-typography-line-height-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-cell>.ids-calendar-button{border-width:var(--ids-comp-date-picker-calendar-button-size-border-width-spacious);border-radius:var(--ids-comp-date-picker-calendar-button-size-border-radius-spacious);min-width:var(--ids-comp-date-picker-calendar-button-size-min-width-spacious);height:var(--ids-comp-date-picker-calendar-button-size-height-spacious);padding-left:var(--ids-comp-date-picker-calendar-button-size-padding-x-spacious);padding-right:var(--ids-comp-date-picker-calendar-button-size-padding-x-spacious);font-family:var(--ids-comp-date-picker-calendar-button-typography-font-family-spacious);font-size:var(--ids-comp-date-picker-calendar-button-typography-font-size-spacious);font-weight:var(--ids-comp-date-picker-calendar-button-typography-font-weight-spacious);letter-spacing:var(--ids-comp-date-picker-calendar-button-typography-letter-spacing-spacious);line-height:var(--ids-comp-date-picker-calendar-button-typography-line-height-spacious)}.ids-calendar.ids-calendar-spacious .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-width:var(--ids-comp-date-picker-focused-outline-size-outline-spacious)}.ids-calendar.ids-calendar-dense{gap:var(--ids-comp-date-picker-size-gap-dense);padding:var(--ids-comp-date-picker-size-padding-y-dense) var(--ids-comp-date-picker-size-padding-x-dense);border-radius:var(--ids-comp-overlay-panel-size-border-radius-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-grid{column-gap:var(--ids-comp-date-picker-calendar-size-column-gap-dense);row-gap:var(--ids-comp-date-picker-calendar-size-row-gap-dense);padding:var(--ids-comp-date-picker-calendar-size-padding-y-dense) var(--ids-comp-date-picker-calendar-size-padding-x-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-cell{border-radius:var(--ids-comp-date-picker-calendar-cell-size-border-radius-dense);border-width:var(--ids-comp-date-picker-calendar-cell-size-border-width-dense);min-height:var(--ids-comp-date-picker-calendar-cell-size-min-height-dense);min-width:var(--ids-comp-date-picker-calendar-cell-size-min-width-dense);padding:var(--ids-comp-date-picker-calendar-cell-size-padding-y-dense) var(--ids-comp-date-picker-calendar-cell-size-padding-x-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-cell>.ids-calendar-weekday-label{font-family:var(--ids-comp-date-picker-calendar-days-typography-font-family-dense);font-size:var(--ids-comp-date-picker-calendar-days-typography-font-size-dense);font-weight:var(--ids-comp-date-picker-calendar-days-typography-font-weight-dense);letter-spacing:var(--ids-comp-date-picker-calendar-days-typography-letter-spacing-dense);line-height:var(--ids-comp-date-picker-calendar-days-typography-line-height-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-cell>.ids-calendar-button{border-width:var(--ids-comp-date-picker-calendar-button-size-border-width-dense);border-radius:var(--ids-comp-date-picker-calendar-button-size-border-radius-dense);min-width:var(--ids-comp-date-picker-calendar-button-size-min-width-dense);height:var(--ids-comp-date-picker-calendar-button-size-height-dense);padding-left:var(--ids-comp-date-picker-calendar-button-size-padding-x-dense);padding-right:var(--ids-comp-date-picker-calendar-button-size-padding-x-dense);font-family:var(--ids-comp-date-picker-calendar-button-typography-font-family-dense);font-size:var(--ids-comp-date-picker-calendar-button-typography-font-size-dense);font-weight:var(--ids-comp-date-picker-calendar-button-typography-font-weight-dense);letter-spacing:var(--ids-comp-date-picker-calendar-button-typography-letter-spacing-dense);line-height:var(--ids-comp-date-picker-calendar-button-typography-line-height-dense)}.ids-calendar.ids-calendar-dense .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-width:var(--ids-comp-date-picker-focused-outline-size-outline-dense)}.ids-calendar.ids-calendar-filled{box-shadow:none}.ids-calendar.ids-calendar-outlined{box-shadow:var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxs) var(--ids-smc-reference-container-effects-shadow-blur-xxs) var(--ids-smc-reference-container-effects-shadow-spread-none) var(--ids-smc-reference-container-effects-shadow-color-dark-lighter)}.ids-calendar.ids-calendar-elevated{box-shadow:var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxl) var(--ids-smc-reference-container-effects-shadow-blur-xxxl) var(--ids-smc-reference-container-effects-shadow-spread-xxs) var(--ids-smc-reference-container-effects-shadow-color-dark-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell{background-color:var(--ids-comp-date-picker-cell-unselected-color-bg-surface-default);border-color:var(--ids-comp-date-picker-cell-unselected-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell.ids-calendar-cell-selected{background-color:var(--ids-comp-date-picker-cell-selected-color-bg-surface-default);border-color:var(--ids-comp-date-picker-cell-selected-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-weekday-label{color:var(--ids-comp-date-picker-calendar-days-color-fg-surface-default);background-color:var(--ids-comp-date-picker-calendar-days-color-bg-surface-default);border-color:var(--ids-comp-date-picker-calendar-days-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button{color:var(--ids-comp-date-picker-calendar-button-unselected-color-fg-surface-default);background-color:var(--ids-comp-date-picker-calendar-button-unselected-color-bg-surface-default);border-color:var(--ids-comp-date-picker-calendar-button-unselected-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:hover{color:var(--ids-comp-date-picker-calendar-button-unselected-color-fg-surface-hovered);background-color:var(--ids-comp-date-picker-calendar-button-unselected-color-bg-surface-hovered);border-color:var(--ids-comp-date-picker-calendar-button-unselected-color-border-surface-hovered)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:active{color:var(--ids-comp-date-picker-calendar-button-unselected-color-fg-surface-pressed);background-color:var(--ids-comp-date-picker-calendar-button-unselected-color-bg-surface-pressed);border-color:var(--ids-comp-date-picker-calendar-button-unselected-color-border-surface-pressed)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:disabled{color:var(--ids-comp-date-picker-calendar-button-unselected-color-fg-surface-disabled);background-color:var(--ids-comp-date-picker-calendar-button-unselected-color-bg-surface-disabled);border-color:var(--ids-comp-date-picker-calendar-button-unselected-color-border-surface-disabled)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today{color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-fg-surface-default);background-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-bg-surface-default);border-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today:hover{color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-fg-surface-hovered);background-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-bg-surface-hovered);border-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-border-surface-hovered)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today:active{color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-fg-surface-pressed);background-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-bg-surface-pressed);border-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-border-surface-pressed)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-today:disabled{color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-fg-surface-disabled);background-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-bg-surface-disabled);border-color:var(--ids-comp-date-picker-calendar-button-unselected-current-date-color-border-surface-disabled)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-selected{color:var(--ids-comp-date-picker-calendar-button-selected-color-fg-surface-default);background-color:var(--ids-comp-date-picker-calendar-button-selected-color-bg-surface-default);border-color:var(--ids-comp-date-picker-calendar-button-selected-color-border-surface-default)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-selected:hover{color:var(--ids-comp-date-picker-calendar-button-selected-color-fg-surface-hovered);background-color:var(--ids-comp-date-picker-calendar-button-selected-color-bg-surface-hovered);border-color:var(--ids-comp-date-picker-calendar-button-selected-color-border-surface-hovered)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-selected:active{color:var(--ids-comp-date-picker-calendar-button-selected-color-fg-surface-pressed);background-color:var(--ids-comp-date-picker-calendar-button-selected-color-bg-surface-pressed);border-color:var(--ids-comp-date-picker-calendar-button-selected-color-border-surface-pressed)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button.ids-calendar-button-selected:disabled{color:var(--ids-comp-date-picker-calendar-button-selected-color-fg-surface-disabled);background-color:var(--ids-comp-date-picker-calendar-button-selected-color-bg-surface-disabled);border-color:var(--ids-comp-date-picker-calendar-button-selected-color-border-surface-disabled)}.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible){outline-color:var(--ids-comp-date-picker-focused-outline-color-dark)}.ids-calendar.ids-calendar-filled.ids-calendar-surface{background:var(--ids-comp-overlay-panel-filled-color-bg-surface-default)}.ids-calendar.ids-calendar-filled.ids-calendar-surface.ids-calendar-outlined{border-color:var(--ids-comp-overlay-panel-filled-color-border-surface-default)}.ids-calendar.ids-calendar-outlined.ids-calendar-surface{background:var(--ids-comp-overlay-panel-outlined-color-bg-surface-default)}.ids-calendar.ids-calendar-outlined.ids-calendar-surface.ids-calendar-outlined{border-color:var(--ids-comp-overlay-panel-outlined-color-border-surface-default)}.ids-calendar.ids-calendar-elevated.ids-calendar-surface{background:var(--ids-comp-overlay-panel-elevated-color-bg-surface-default)}.ids-calendar.ids-calendar-elevated.ids-calendar-surface.ids-calendar-outlined{border-color:var(--ids-comp-overlay-panel-elevated-color-border-surface-default)}.ids-year-selector>.ids-year-selector__years-grid{display:grid;grid-template-columns:repeat(4, 1fr);align-items:center;justify-items:center}.ids-month-selector>.ids-month-selector__months-grid{display:grid;grid-template-columns:repeat(4, 1fr);align-items:center;justify-items:center}.ids-day-selector>.ids-day-selector__days-grid{display:grid;grid-template-columns:repeat(7, 1fr)}
package/dist/datepicker/datepicker.plugin.js CHANGED
@@ -6,11 +6,10 @@ module.exports = function DatepickerPlugin() {
6
6
  boxSizing: 'border-box',
7
7
  borderWidth: '1px',
8
8
  borderStyle: 'solid',
9
- borderColor: '#d3d3d3',
9
+ borderColor: 'rgba(0,0,0,0)',
10
10
  lineHeight: 1.5,
11
11
  display: 'flex',
12
12
  flexDirection: 'column',
13
- backgroundColor: '#fff',
14
13
  },
15
14
  '.ids-calendar::before,.ids-calendar::after,.ids-calendar *,.ids-calendar ::before,.ids-calendar ::after': {
16
15
  boxSizing: 'border-box',
@@ -32,6 +31,7 @@ module.exports = function DatepickerPlugin() {
32
31
  '.ids-calendar.ids-calendar-compact': {
33
32
  gap: 'var(--ids-comp-date-picker-size-gap-compact)',
34
33
  padding: 'var(--ids-comp-date-picker-size-padding-y-compact) var(--ids-comp-date-picker-size-padding-x-compact)',
34
+ borderRadius: 'var(--ids-comp-overlay-panel-size-border-radius-compact)',
35
35
  },
36
36
  '.ids-calendar.ids-calendar-compact .ids-calendar-grid': {
37
37
  columnGap: 'var(--ids-comp-date-picker-calendar-size-column-gap-compact)',
@@ -72,6 +72,7 @@ module.exports = function DatepickerPlugin() {
72
72
  '.ids-calendar.ids-calendar-comfortable': {
73
73
  gap: 'var(--ids-comp-date-picker-size-gap-comfortable)',
74
74
  padding: 'var(--ids-comp-date-picker-size-padding-y-comfortable) var(--ids-comp-date-picker-size-padding-x-comfortable)',
75
+ borderRadius: 'var(--ids-comp-overlay-panel-size-border-radius-comfortable)',
75
76
  },
76
77
  '.ids-calendar.ids-calendar-comfortable .ids-calendar-grid': {
77
78
  columnGap: 'var(--ids-comp-date-picker-calendar-size-column-gap-comfortable)',
@@ -113,6 +114,7 @@ module.exports = function DatepickerPlugin() {
113
114
  '.ids-calendar.ids-calendar-spacious': {
114
115
  gap: 'var(--ids-comp-date-picker-size-gap-spacious)',
115
116
  padding: 'var(--ids-comp-date-picker-size-padding-y-spacious) var(--ids-comp-date-picker-size-padding-x-spacious)',
117
+ borderRadius: 'var(--ids-comp-overlay-panel-size-border-radius-spacious)',
116
118
  },
117
119
  '.ids-calendar.ids-calendar-spacious .ids-calendar-grid': {
118
120
  columnGap: 'var(--ids-comp-date-picker-calendar-size-column-gap-spacious)',
@@ -154,6 +156,7 @@ module.exports = function DatepickerPlugin() {
154
156
  '.ids-calendar.ids-calendar-dense': {
155
157
  gap: 'var(--ids-comp-date-picker-size-gap-dense)',
156
158
  padding: 'var(--ids-comp-date-picker-size-padding-y-dense) var(--ids-comp-date-picker-size-padding-x-dense)',
159
+ borderRadius: 'var(--ids-comp-overlay-panel-size-border-radius-dense)',
157
160
  },
158
161
  '.ids-calendar.ids-calendar-dense .ids-calendar-grid': {
159
162
  columnGap: 'var(--ids-comp-date-picker-calendar-size-column-gap-dense)',
@@ -191,6 +194,15 @@ module.exports = function DatepickerPlugin() {
191
194
  '.ids-calendar.ids-calendar-dense .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible)': {
192
195
  outlineWidth: 'var(--ids-comp-date-picker-focused-outline-size-outline-dense)',
193
196
  },
197
+ '.ids-calendar.ids-calendar-filled': { boxShadow: 'none' },
198
+ '.ids-calendar.ids-calendar-outlined': {
199
+ boxShadow:
200
+ 'var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxs) var(--ids-smc-reference-container-effects-shadow-blur-xxs) var(--ids-smc-reference-container-effects-shadow-spread-none) var(--ids-smc-reference-container-effects-shadow-color-dark-lighter)',
201
+ },
202
+ '.ids-calendar.ids-calendar-elevated': {
203
+ boxShadow:
204
+ 'var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxl) var(--ids-smc-reference-container-effects-shadow-blur-xxxl) var(--ids-smc-reference-container-effects-shadow-spread-xxs) var(--ids-smc-reference-container-effects-shadow-color-dark-default)',
205
+ },
194
206
  '.ids-calendar.ids-calendar-surface .ids-calendar-cell': {
195
207
  backgroundColor: 'var(--ids-comp-date-picker-cell-unselected-color-bg-surface-default)',
196
208
  borderColor: 'var(--ids-comp-date-picker-cell-unselected-color-border-surface-default)',
@@ -267,6 +279,24 @@ module.exports = function DatepickerPlugin() {
267
279
  '.ids-calendar.ids-calendar-surface .ids-calendar-cell>.ids-calendar-button:is(:focus,:focus-visible)': {
268
280
  outlineColor: 'var(--ids-comp-date-picker-focused-outline-color-dark)',
269
281
  },
282
+ '.ids-calendar.ids-calendar-filled.ids-calendar-surface': {
283
+ background: 'var(--ids-comp-overlay-panel-filled-color-bg-surface-default)',
284
+ },
285
+ '.ids-calendar.ids-calendar-filled.ids-calendar-surface.ids-calendar-outlined': {
286
+ borderColor: 'var(--ids-comp-overlay-panel-filled-color-border-surface-default)',
287
+ },
288
+ '.ids-calendar.ids-calendar-outlined.ids-calendar-surface': {
289
+ background: 'var(--ids-comp-overlay-panel-outlined-color-bg-surface-default)',
290
+ },
291
+ '.ids-calendar.ids-calendar-outlined.ids-calendar-surface.ids-calendar-outlined': {
292
+ borderColor: 'var(--ids-comp-overlay-panel-outlined-color-border-surface-default)',
293
+ },
294
+ '.ids-calendar.ids-calendar-elevated.ids-calendar-surface': {
295
+ background: 'var(--ids-comp-overlay-panel-elevated-color-bg-surface-default)',
296
+ },
297
+ '.ids-calendar.ids-calendar-elevated.ids-calendar-surface.ids-calendar-outlined': {
298
+ borderColor: 'var(--ids-comp-overlay-panel-elevated-color-border-surface-default)',
299
+ },
270
300
  '.ids-year-selector>.ids-year-selector__years-grid': {
271
301
  display: 'grid',
272
302
  gridTemplateColumns: 'repeat(4, 1fr)',
package/dist/dialog/dialog.css CHANGED
@@ -49,7 +49,6 @@
49
49
  display: grid;
50
50
  }
51
51
  .ids-dialog .ids-dialog-container .ids-dialog-content {
52
- display: flex;
53
52
  overflow-y: auto;
54
53
  background: var(--ids-comp-dialog-content-color-bg-default);
55
54
  }
package/dist/dialog/dialog.min.css CHANGED
@@ -1 +1 @@
1
- .ids-dialog-backdrop{background-color:var(--ids-comp-dialog-backdrop-background)}.ids-dialog-transparent-backdrop{background-color:rgba(0,0,0,0)}.ids-dialog{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5;padding:0;border-style:solid;border-color:var(--ids-comp-dialog-container-color-border-surface-default);background-color:var(--ids-comp-dialog-container-color-bg-default);box-shadow:var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxl) var(--ids-smc-reference-container-effects-shadow-blur-xxxl) var(--ids-smc-reference-container-effects-shadow-spread-xxs) var(--ids-smc-reference-container-effects-shadow-color-dark-default)}.ids-dialog::before,.ids-dialog::after,.ids-dialog *,.ids-dialog ::before,.ids-dialog ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-dialog .ids-dialog-container{display:grid;grid-template-rows:auto 1fr auto;position:relative;max-height:80vh}.ids-dialog .ids-dialog-container .ids-dialog-header{display:grid;grid-template-columns:1fr auto}.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-style:normal;color:var(--ids-comp-dialog-header-color-fg-title-default)}.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-title.hidden{display:none}.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-style:normal;color:var(--ids-comp-dialog-header-color-fg-subtitle-default)}.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{display:grid}.ids-dialog .ids-dialog-container .ids-dialog-content{display:flex;overflow-y:auto;background:var(--ids-comp-dialog-content-color-bg-default)}.ids-dialog .ids-dialog-container .ids-dialog-content .ids-dialog-content-overflow{overflow-y:auto;height:100%}.ids-dialog .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{border-top-style:solid;border-bottom-style:solid;border-top-color:var(--ids-comp-dialog-content-color-border-surface-default);border-bottom-color:var(--ids-comp-dialog-content-color-border-surface-default)}.ids-dialog .ids-dialog-container .ids-dialog-actions{display:flex;background:var(--ids-comp-dialog-footer-color-bg-default);justify-content:flex-end;align-items:flex-start;align-content:flex-start;align-self:stretch;flex-wrap:wrap}.ids-dialog.ids-dialog-compact{border-radius:var(--ids-comp-dialog-container-size-border-radius-compact);border-width:var(--ids-comp-dialog-container-size-border-width-compact)}.ids-dialog.ids-dialog-compact.ids-dialog-with-backdrop::backdrop{opacity:var(--ids-comp-dialog-backdrop-size-opacity-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container{max-width:var(--ids-comp-dialog-container-size-width-compact);min-height:var(--ids-comp-dialog-container-size-min-height-compact);padding:var(--ids-comp-dialog-container-size-padding-y-compact) var(--ids-comp-dialog-container-size-padding-x-compact);gap:var(--ids-comp-dialog-container-size-gap-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-family:var(--ids-comp-dialog-header-title-typography-font-family-compact);font-size:var(--ids-comp-dialog-header-title-typography-font-size-compact);font-weight:var(--ids-comp-dialog-header-title-typography-font-weight-compact);letter-spacing:var(--ids-comp-dialog-header-title-typography-letter-spacing-compact);line-height:var(--ids-comp-dialog-header-title-typography-line-height-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-family:var(--ids-comp-dialog-header-subtitle-typography-font-family-compact);font-size:var(--ids-comp-dialog-header-subtitle-typography-font-size-compact);font-weight:var(--ids-comp-dialog-header-subtitle-typography-font-weight-compact);letter-spacing:var(--ids-comp-dialog-header-subtitle-typography-letter-spacing-compact);line-height:var(--ids-comp-dialog-header-subtitle-typography-line-height-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{gap:var(--ids-comp-dialog-header-size-gap-compact);padding:var(--ids-comp-dialog-header-size-padding-y-compact) var(--ids-comp-dialog-header-size-padding-x-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-content{padding:var(--ids-comp-dialog-content-fixed-size-padding-y-compact) var(--ids-comp-dialog-content-fixed-size-padding-x-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{padding:var(--ids-comp-dialog-content-scrollable-size-padding-y-compact) var(--ids-comp-dialog-content-scrollable-size-padding-x-compact);border-top-width:var(--ids-comp-dialog-content-scrollable-size-border-width-compact);border-bottom-width:var(--ids-comp-dialog-content-scrollable-size-border-width-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-actions{padding:var(--ids-comp-dialog-footer-padding-y-compact) var(--ids-comp-dialog-footer-padding-x-compact);gap:var(--ids-comp-dialog-footer-gap-compact)}.ids-dialog.ids-dialog-comfortable{border-radius:var(--ids-comp-dialog-container-size-border-radius-comfortable);border-width:var(--ids-comp-dialog-container-size-border-width-comfortable)}.ids-dialog.ids-dialog-comfortable.ids-dialog-with-backdrop::backdrop{opacity:var(--ids-comp-dialog-backdrop-size-opacity-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container{max-width:var(--ids-comp-dialog-container-size-width-comfortable);min-height:var(--ids-comp-dialog-container-size-min-height-comfortable);padding:var(--ids-comp-dialog-container-size-padding-y-comfortable) var(--ids-comp-dialog-container-size-padding-x-comfortable);gap:var(--ids-comp-dialog-container-size-gap-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-family:var(--ids-comp-dialog-header-title-typography-font-family-comfortable);font-size:var(--ids-comp-dialog-header-title-typography-font-size-comfortable);font-weight:var(--ids-comp-dialog-header-title-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-dialog-header-title-typography-letter-spacing-comfortable);line-height:var(--ids-comp-dialog-header-title-typography-line-height-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-family:var(--ids-comp-dialog-header-subtitle-typography-font-family-comfortable);font-size:var(--ids-comp-dialog-header-subtitle-typography-font-size-comfortable);font-weight:var(--ids-comp-dialog-header-subtitle-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-dialog-header-subtitle-typography-letter-spacing-comfortable);line-height:var(--ids-comp-dialog-header-subtitle-typography-line-height-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{gap:var(--ids-comp-dialog-header-size-gap-comfortable);padding:var(--ids-comp-dialog-header-size-padding-y-comfortable) var(--ids-comp-dialog-header-size-padding-x-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-content{padding:var(--ids-comp-dialog-content-fixed-size-padding-y-comfortable) var(--ids-comp-dialog-content-fixed-size-padding-x-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{padding:var(--ids-comp-dialog-content-scrollable-size-padding-y-comfortable) var(--ids-comp-dialog-content-scrollable-size-padding-x-comfortable);border-top-width:var(--ids-comp-dialog-content-scrollable-size-border-width-comfortable);border-bottom-width:var(--ids-comp-dialog-content-scrollable-size-border-width-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-actions{padding:var(--ids-comp-dialog-footer-padding-y-comfortable) var(--ids-comp-dialog-footer-padding-x-comfortable);gap:var(--ids-comp-dialog-footer-gap-comfortable)}.ids-dialog.ids-dialog-spacious{border-radius:var(--ids-comp-dialog-container-size-border-radius-spacious);border-width:var(--ids-comp-dialog-container-size-border-width-spacious)}.ids-dialog.ids-dialog-spacious.ids-dialog-with-backdrop::backdrop{opacity:var(--ids-comp-dialog-backdrop-size-opacity-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container{max-width:var(--ids-comp-dialog-container-size-width-spacious);min-height:var(--ids-comp-dialog-container-size-min-height-spacious);padding:var(--ids-comp-dialog-container-size-padding-y-spacious) var(--ids-comp-dialog-container-size-padding-x-spacious);gap:var(--ids-comp-dialog-container-size-gap-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-family:var(--ids-comp-dialog-header-title-typography-font-family-spacious);font-size:var(--ids-comp-dialog-header-title-typography-font-size-spacious);font-weight:var(--ids-comp-dialog-header-title-typography-font-weight-spacious);letter-spacing:var(--ids-comp-dialog-header-title-typography-letter-spacing-spacious);line-height:var(--ids-comp-dialog-header-title-typography-line-height-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-family:var(--ids-comp-dialog-header-subtitle-typography-font-family-spacious);font-size:var(--ids-comp-dialog-header-subtitle-typography-font-size-spacious);font-weight:var(--ids-comp-dialog-header-subtitle-typography-font-weight-spacious);letter-spacing:var(--ids-comp-dialog-header-subtitle-typography-letter-spacing-spacious);line-height:var(--ids-comp-dialog-header-subtitle-typography-line-height-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{gap:var(--ids-comp-dialog-header-size-gap-spacious);padding:var(--ids-comp-dialog-header-size-padding-y-spacious) var(--ids-comp-dialog-header-size-padding-x-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-content{padding:var(--ids-comp-dialog-content-fixed-size-padding-y-spacious) var(--ids-comp-dialog-content-fixed-size-padding-x-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{padding:var(--ids-comp-dialog-content-scrollable-size-padding-y-spacious) var(--ids-comp-dialog-content-scrollable-size-padding-x-spacious);border-top-width:var(--ids-comp-dialog-content-scrollable-size-border-width-spacious);border-bottom-width:var(--ids-comp-dialog-content-scrollable-size-border-width-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-actions{padding:var(--ids-comp-dialog-footer-padding-y-spacious) var(--ids-comp-dialog-footer-padding-x-spacious);gap:var(--ids-comp-dialog-footer-gap-spacious)}.ids-dialog.ids-dialog-dense{border-radius:var(--ids-comp-dialog-container-size-border-radius-dense);border-width:var(--ids-comp-dialog-container-size-border-width-dense)}.ids-dialog.ids-dialog-dense.ids-dialog-with-backdrop::backdrop{opacity:var(--ids-comp-dialog-backdrop-size-opacity-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container{max-width:var(--ids-comp-dialog-container-size-width-dense);min-height:var(--ids-comp-dialog-container-size-min-height-dense);padding:var(--ids-comp-dialog-container-size-padding-y-dense) var(--ids-comp-dialog-container-size-padding-x-dense);gap:var(--ids-comp-dialog-container-size-gap-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-family:var(--ids-comp-dialog-header-title-typography-font-family-dense);font-size:var(--ids-comp-dialog-header-title-typography-font-size-dense);font-weight:var(--ids-comp-dialog-header-title-typography-font-weight-dense);letter-spacing:var(--ids-comp-dialog-header-title-typography-letter-spacing-dense);line-height:var(--ids-comp-dialog-header-title-typography-line-height-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-family:var(--ids-comp-dialog-header-subtitle-typography-font-family-dense);font-size:var(--ids-comp-dialog-header-subtitle-typography-font-size-dense);font-weight:var(--ids-comp-dialog-header-subtitle-typography-font-weight-dense);letter-spacing:var(--ids-comp-dialog-header-subtitle-typography-letter-spacing-dense);line-height:var(--ids-comp-dialog-header-subtitle-typography-line-height-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{gap:var(--ids-comp-dialog-header-size-gap-dense);padding:var(--ids-comp-dialog-header-size-padding-y-dense) var(--ids-comp-dialog-header-size-padding-x-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-content{padding:var(--ids-comp-dialog-content-fixed-size-padding-y-dense) var(--ids-comp-dialog-content-fixed-size-padding-x-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{padding:var(--ids-comp-dialog-content-scrollable-size-padding-y-dense) var(--ids-comp-dialog-content-scrollable-size-padding-x-dense);border-top-width:var(--ids-comp-dialog-content-scrollable-size-border-width-dense);border-bottom-width:var(--ids-comp-dialog-content-scrollable-size-border-width-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-actions{padding:var(--ids-comp-dialog-footer-padding-y-dense) var(--ids-comp-dialog-footer-padding-x-dense);gap:var(--ids-comp-dialog-footer-gap-dense)}
1
+ .ids-dialog-backdrop{background-color:var(--ids-comp-dialog-backdrop-background)}.ids-dialog-transparent-backdrop{background-color:rgba(0,0,0,0)}.ids-dialog{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5;padding:0;border-style:solid;border-color:var(--ids-comp-dialog-container-color-border-surface-default);background-color:var(--ids-comp-dialog-container-color-bg-default);box-shadow:var(--ids-smc-reference-container-effects-shadow-horizontal-none) var(--ids-smc-reference-container-effects-shadow-vertical-xxl) var(--ids-smc-reference-container-effects-shadow-blur-xxxl) var(--ids-smc-reference-container-effects-shadow-spread-xxs) var(--ids-smc-reference-container-effects-shadow-color-dark-default)}.ids-dialog::before,.ids-dialog::after,.ids-dialog *,.ids-dialog ::before,.ids-dialog ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-dialog .ids-dialog-container{display:grid;grid-template-rows:auto 1fr auto;position:relative;max-height:80vh}.ids-dialog .ids-dialog-container .ids-dialog-header{display:grid;grid-template-columns:1fr auto}.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-style:normal;color:var(--ids-comp-dialog-header-color-fg-title-default)}.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-title.hidden{display:none}.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-style:normal;color:var(--ids-comp-dialog-header-color-fg-subtitle-default)}.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{display:grid}.ids-dialog .ids-dialog-container .ids-dialog-content{overflow-y:auto;background:var(--ids-comp-dialog-content-color-bg-default)}.ids-dialog .ids-dialog-container .ids-dialog-content .ids-dialog-content-overflow{overflow-y:auto;height:100%}.ids-dialog .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{border-top-style:solid;border-bottom-style:solid;border-top-color:var(--ids-comp-dialog-content-color-border-surface-default);border-bottom-color:var(--ids-comp-dialog-content-color-border-surface-default)}.ids-dialog .ids-dialog-container .ids-dialog-actions{display:flex;background:var(--ids-comp-dialog-footer-color-bg-default);justify-content:flex-end;align-items:flex-start;align-content:flex-start;align-self:stretch;flex-wrap:wrap}.ids-dialog.ids-dialog-compact{border-radius:var(--ids-comp-dialog-container-size-border-radius-compact);border-width:var(--ids-comp-dialog-container-size-border-width-compact)}.ids-dialog.ids-dialog-compact.ids-dialog-with-backdrop::backdrop{opacity:var(--ids-comp-dialog-backdrop-size-opacity-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container{max-width:var(--ids-comp-dialog-container-size-width-compact);min-height:var(--ids-comp-dialog-container-size-min-height-compact);padding:var(--ids-comp-dialog-container-size-padding-y-compact) var(--ids-comp-dialog-container-size-padding-x-compact);gap:var(--ids-comp-dialog-container-size-gap-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-family:var(--ids-comp-dialog-header-title-typography-font-family-compact);font-size:var(--ids-comp-dialog-header-title-typography-font-size-compact);font-weight:var(--ids-comp-dialog-header-title-typography-font-weight-compact);letter-spacing:var(--ids-comp-dialog-header-title-typography-letter-spacing-compact);line-height:var(--ids-comp-dialog-header-title-typography-line-height-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-family:var(--ids-comp-dialog-header-subtitle-typography-font-family-compact);font-size:var(--ids-comp-dialog-header-subtitle-typography-font-size-compact);font-weight:var(--ids-comp-dialog-header-subtitle-typography-font-weight-compact);letter-spacing:var(--ids-comp-dialog-header-subtitle-typography-letter-spacing-compact);line-height:var(--ids-comp-dialog-header-subtitle-typography-line-height-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{gap:var(--ids-comp-dialog-header-size-gap-compact);padding:var(--ids-comp-dialog-header-size-padding-y-compact) var(--ids-comp-dialog-header-size-padding-x-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-content{padding:var(--ids-comp-dialog-content-fixed-size-padding-y-compact) var(--ids-comp-dialog-content-fixed-size-padding-x-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{padding:var(--ids-comp-dialog-content-scrollable-size-padding-y-compact) var(--ids-comp-dialog-content-scrollable-size-padding-x-compact);border-top-width:var(--ids-comp-dialog-content-scrollable-size-border-width-compact);border-bottom-width:var(--ids-comp-dialog-content-scrollable-size-border-width-compact)}.ids-dialog.ids-dialog-compact .ids-dialog-container .ids-dialog-actions{padding:var(--ids-comp-dialog-footer-padding-y-compact) var(--ids-comp-dialog-footer-padding-x-compact);gap:var(--ids-comp-dialog-footer-gap-compact)}.ids-dialog.ids-dialog-comfortable{border-radius:var(--ids-comp-dialog-container-size-border-radius-comfortable);border-width:var(--ids-comp-dialog-container-size-border-width-comfortable)}.ids-dialog.ids-dialog-comfortable.ids-dialog-with-backdrop::backdrop{opacity:var(--ids-comp-dialog-backdrop-size-opacity-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container{max-width:var(--ids-comp-dialog-container-size-width-comfortable);min-height:var(--ids-comp-dialog-container-size-min-height-comfortable);padding:var(--ids-comp-dialog-container-size-padding-y-comfortable) var(--ids-comp-dialog-container-size-padding-x-comfortable);gap:var(--ids-comp-dialog-container-size-gap-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-family:var(--ids-comp-dialog-header-title-typography-font-family-comfortable);font-size:var(--ids-comp-dialog-header-title-typography-font-size-comfortable);font-weight:var(--ids-comp-dialog-header-title-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-dialog-header-title-typography-letter-spacing-comfortable);line-height:var(--ids-comp-dialog-header-title-typography-line-height-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-family:var(--ids-comp-dialog-header-subtitle-typography-font-family-comfortable);font-size:var(--ids-comp-dialog-header-subtitle-typography-font-size-comfortable);font-weight:var(--ids-comp-dialog-header-subtitle-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-dialog-header-subtitle-typography-letter-spacing-comfortable);line-height:var(--ids-comp-dialog-header-subtitle-typography-line-height-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{gap:var(--ids-comp-dialog-header-size-gap-comfortable);padding:var(--ids-comp-dialog-header-size-padding-y-comfortable) var(--ids-comp-dialog-header-size-padding-x-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-content{padding:var(--ids-comp-dialog-content-fixed-size-padding-y-comfortable) var(--ids-comp-dialog-content-fixed-size-padding-x-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{padding:var(--ids-comp-dialog-content-scrollable-size-padding-y-comfortable) var(--ids-comp-dialog-content-scrollable-size-padding-x-comfortable);border-top-width:var(--ids-comp-dialog-content-scrollable-size-border-width-comfortable);border-bottom-width:var(--ids-comp-dialog-content-scrollable-size-border-width-comfortable)}.ids-dialog.ids-dialog-comfortable .ids-dialog-container .ids-dialog-actions{padding:var(--ids-comp-dialog-footer-padding-y-comfortable) var(--ids-comp-dialog-footer-padding-x-comfortable);gap:var(--ids-comp-dialog-footer-gap-comfortable)}.ids-dialog.ids-dialog-spacious{border-radius:var(--ids-comp-dialog-container-size-border-radius-spacious);border-width:var(--ids-comp-dialog-container-size-border-width-spacious)}.ids-dialog.ids-dialog-spacious.ids-dialog-with-backdrop::backdrop{opacity:var(--ids-comp-dialog-backdrop-size-opacity-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container{max-width:var(--ids-comp-dialog-container-size-width-spacious);min-height:var(--ids-comp-dialog-container-size-min-height-spacious);padding:var(--ids-comp-dialog-container-size-padding-y-spacious) var(--ids-comp-dialog-container-size-padding-x-spacious);gap:var(--ids-comp-dialog-container-size-gap-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-family:var(--ids-comp-dialog-header-title-typography-font-family-spacious);font-size:var(--ids-comp-dialog-header-title-typography-font-size-spacious);font-weight:var(--ids-comp-dialog-header-title-typography-font-weight-spacious);letter-spacing:var(--ids-comp-dialog-header-title-typography-letter-spacing-spacious);line-height:var(--ids-comp-dialog-header-title-typography-line-height-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-family:var(--ids-comp-dialog-header-subtitle-typography-font-family-spacious);font-size:var(--ids-comp-dialog-header-subtitle-typography-font-size-spacious);font-weight:var(--ids-comp-dialog-header-subtitle-typography-font-weight-spacious);letter-spacing:var(--ids-comp-dialog-header-subtitle-typography-letter-spacing-spacious);line-height:var(--ids-comp-dialog-header-subtitle-typography-line-height-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{gap:var(--ids-comp-dialog-header-size-gap-spacious);padding:var(--ids-comp-dialog-header-size-padding-y-spacious) var(--ids-comp-dialog-header-size-padding-x-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-content{padding:var(--ids-comp-dialog-content-fixed-size-padding-y-spacious) var(--ids-comp-dialog-content-fixed-size-padding-x-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{padding:var(--ids-comp-dialog-content-scrollable-size-padding-y-spacious) var(--ids-comp-dialog-content-scrollable-size-padding-x-spacious);border-top-width:var(--ids-comp-dialog-content-scrollable-size-border-width-spacious);border-bottom-width:var(--ids-comp-dialog-content-scrollable-size-border-width-spacious)}.ids-dialog.ids-dialog-spacious .ids-dialog-container .ids-dialog-actions{padding:var(--ids-comp-dialog-footer-padding-y-spacious) var(--ids-comp-dialog-footer-padding-x-spacious);gap:var(--ids-comp-dialog-footer-gap-spacious)}.ids-dialog.ids-dialog-dense{border-radius:var(--ids-comp-dialog-container-size-border-radius-dense);border-width:var(--ids-comp-dialog-container-size-border-width-dense)}.ids-dialog.ids-dialog-dense.ids-dialog-with-backdrop::backdrop{opacity:var(--ids-comp-dialog-backdrop-size-opacity-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container{max-width:var(--ids-comp-dialog-container-size-width-dense);min-height:var(--ids-comp-dialog-container-size-min-height-dense);padding:var(--ids-comp-dialog-container-size-padding-y-dense) var(--ids-comp-dialog-container-size-padding-x-dense);gap:var(--ids-comp-dialog-container-size-gap-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-header .ids-dialog-title{font-family:var(--ids-comp-dialog-header-title-typography-font-family-dense);font-size:var(--ids-comp-dialog-header-title-typography-font-size-dense);font-weight:var(--ids-comp-dialog-header-title-typography-font-weight-dense);letter-spacing:var(--ids-comp-dialog-header-title-typography-letter-spacing-dense);line-height:var(--ids-comp-dialog-header-title-typography-line-height-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-header .ids-dialog-subtitle{font-family:var(--ids-comp-dialog-header-subtitle-typography-font-family-dense);font-size:var(--ids-comp-dialog-header-subtitle-typography-font-size-dense);font-weight:var(--ids-comp-dialog-header-subtitle-typography-font-weight-dense);letter-spacing:var(--ids-comp-dialog-header-subtitle-typography-letter-spacing-dense);line-height:var(--ids-comp-dialog-header-subtitle-typography-line-height-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content{gap:var(--ids-comp-dialog-header-size-gap-dense);padding:var(--ids-comp-dialog-header-size-padding-y-dense) var(--ids-comp-dialog-header-size-padding-x-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-content{padding:var(--ids-comp-dialog-content-fixed-size-padding-y-dense) var(--ids-comp-dialog-content-fixed-size-padding-x-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-content.ids-dialog-content-scrollable{padding:var(--ids-comp-dialog-content-scrollable-size-padding-y-dense) var(--ids-comp-dialog-content-scrollable-size-padding-x-dense);border-top-width:var(--ids-comp-dialog-content-scrollable-size-border-width-dense);border-bottom-width:var(--ids-comp-dialog-content-scrollable-size-border-width-dense)}.ids-dialog.ids-dialog-dense .ids-dialog-container .ids-dialog-actions{padding:var(--ids-comp-dialog-footer-padding-y-dense) var(--ids-comp-dialog-footer-padding-x-dense);gap:var(--ids-comp-dialog-footer-gap-dense)}
package/dist/dialog/dialog.plugin.js CHANGED
@@ -34,7 +34,6 @@ module.exports = function DialogPlugin() {
34
34
  },
35
35
  '.ids-dialog .ids-dialog-container .ids-dialog-header .ids-dialog-header-default-content': { display: 'grid' },
36
36
  '.ids-dialog .ids-dialog-container .ids-dialog-content': {
37
- display: 'flex',
38
37
  overflowY: 'auto',
39
38
  background: 'var(--ids-comp-dialog-content-color-bg-default)',
40
39
  },
package/dist/divider/divider.css CHANGED
@@ -5,6 +5,7 @@
5
5
  border-color: transparent;
6
6
  line-height: 1.5;
7
7
  display: flex;
8
+ flex-shrink: 0;
8
9
  align-items: center;
9
10
  justify-content: center;
10
11
  }
package/dist/divider/divider.min.css CHANGED
@@ -1 +1 @@
1
- .ids-divider{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5;display:flex;align-items:center;justify-content:center}.ids-divider::before,.ids-divider::after,.ids-divider *,.ids-divider ::before,.ids-divider ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-divider.ids-divider-compact{border-radius:var(--ids-comp-divider-size-border-radius-compact)}.ids-divider.ids-divider-compact.ids-divider-horizontal{height:var(--ids-comp-divider-size-height-compact)}.ids-divider.ids-divider-compact.ids-divider-vertical{width:var(--ids-comp-divider-size-width-compact)}.ids-divider.ids-divider-comfortable{border-radius:var(--ids-comp-divider-size-border-radius-comfortable)}.ids-divider.ids-divider-comfortable.ids-divider-horizontal{height:var(--ids-comp-divider-size-height-comfortable)}.ids-divider.ids-divider-comfortable.ids-divider-vertical{width:var(--ids-comp-divider-size-width-comfortable)}.ids-divider.ids-divider-spacious{border-radius:var(--ids-comp-divider-size-border-radius-spacious)}.ids-divider.ids-divider-spacious.ids-divider-horizontal{height:var(--ids-comp-divider-size-height-spacious)}.ids-divider.ids-divider-spacious.ids-divider-vertical{width:var(--ids-comp-divider-size-width-spacious)}.ids-divider.ids-divider-dense{border-radius:var(--ids-comp-divider-size-border-radius-dense)}.ids-divider.ids-divider-dense.ids-divider-horizontal{height:var(--ids-comp-divider-size-height-dense)}.ids-divider.ids-divider-dense.ids-divider-vertical{width:var(--ids-comp-divider-size-width-dense)}.ids-divider.ids-divider-primary{background:var(--ids-comp-divider-color-bg-primary-default)}.ids-divider.ids-divider-secondary{background:var(--ids-comp-divider-color-bg-secondary-default)}.ids-divider.ids-divider-brand{background:var(--ids-comp-divider-color-bg-brand-default)}.ids-divider.ids-divider-error{background:var(--ids-comp-divider-color-bg-error-default)}.ids-divider.ids-divider-success{background:var(--ids-comp-divider-color-bg-success-default)}.ids-divider.ids-divider-warning{background:var(--ids-comp-divider-color-bg-warning-default)}.ids-divider.ids-divider-light{background:var(--ids-comp-divider-color-bg-light-default)}.ids-divider.ids-divider-dark{background:var(--ids-comp-divider-color-bg-dark-default)}.ids-divider.ids-divider-surface{background:var(--ids-comp-divider-color-bg-surface-default)}
1
+ .ids-divider{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5;display:flex;flex-shrink:0;align-items:center;justify-content:center}.ids-divider::before,.ids-divider::after,.ids-divider *,.ids-divider ::before,.ids-divider ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-divider.ids-divider-compact{border-radius:var(--ids-comp-divider-size-border-radius-compact)}.ids-divider.ids-divider-compact.ids-divider-horizontal{height:var(--ids-comp-divider-size-height-compact)}.ids-divider.ids-divider-compact.ids-divider-vertical{width:var(--ids-comp-divider-size-width-compact)}.ids-divider.ids-divider-comfortable{border-radius:var(--ids-comp-divider-size-border-radius-comfortable)}.ids-divider.ids-divider-comfortable.ids-divider-horizontal{height:var(--ids-comp-divider-size-height-comfortable)}.ids-divider.ids-divider-comfortable.ids-divider-vertical{width:var(--ids-comp-divider-size-width-comfortable)}.ids-divider.ids-divider-spacious{border-radius:var(--ids-comp-divider-size-border-radius-spacious)}.ids-divider.ids-divider-spacious.ids-divider-horizontal{height:var(--ids-comp-divider-size-height-spacious)}.ids-divider.ids-divider-spacious.ids-divider-vertical{width:var(--ids-comp-divider-size-width-spacious)}.ids-divider.ids-divider-dense{border-radius:var(--ids-comp-divider-size-border-radius-dense)}.ids-divider.ids-divider-dense.ids-divider-horizontal{height:var(--ids-comp-divider-size-height-dense)}.ids-divider.ids-divider-dense.ids-divider-vertical{width:var(--ids-comp-divider-size-width-dense)}.ids-divider.ids-divider-primary{background:var(--ids-comp-divider-color-bg-primary-default)}.ids-divider.ids-divider-secondary{background:var(--ids-comp-divider-color-bg-secondary-default)}.ids-divider.ids-divider-brand{background:var(--ids-comp-divider-color-bg-brand-default)}.ids-divider.ids-divider-error{background:var(--ids-comp-divider-color-bg-error-default)}.ids-divider.ids-divider-success{background:var(--ids-comp-divider-color-bg-success-default)}.ids-divider.ids-divider-warning{background:var(--ids-comp-divider-color-bg-warning-default)}.ids-divider.ids-divider-light{background:var(--ids-comp-divider-color-bg-light-default)}.ids-divider.ids-divider-dark{background:var(--ids-comp-divider-color-bg-dark-default)}.ids-divider.ids-divider-surface{background:var(--ids-comp-divider-color-bg-surface-default)}
package/dist/divider/divider.plugin.js CHANGED
@@ -9,6 +9,7 @@ module.exports = function DividerPlugin() {
9
9
  borderColor: 'rgba(0,0,0,0)',
10
10
  lineHeight: 1.5,
11
11
  display: 'flex',
12
+ flexShrink: 0,
12
13
  alignItems: 'center',
13
14
  justifyContent: 'center',
14
15
  },
package/dist/radio/radio.css CHANGED
@@ -30,6 +30,7 @@
30
30
  }
31
31
  .ids-radio-group > .ids-radio-group__list {
32
32
  display: flex;
33
+ width: inherit;
33
34
  }
34
35
  .ids-radio-group.ids-radio-group-horizontal > .ids-radio-group__list {
35
36
  flex-direction: row;