@i-cell/ids-styles 0.0.50 → 0.0.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/checkbox/checkbox.css +69 -3
  2. package/dist/checkbox/checkbox.min.css +1 -1
  3. package/dist/checkbox/checkbox.plugin.js +81 -3
  4. package/dist/components.css +160 -12
  5. package/dist/components.min.css +1 -1
  6. package/dist/components.plugin.js +119 -12
  7. package/dist/side-nav/side-nav.css +91 -9
  8. package/dist/side-nav/side-nav.min.css +1 -1
  9. package/dist/side-nav/side-nav.plugin.js +38 -9
  10. package/package.json +1 -1
package/dist/side-nav/side-nav.min.css CHANGED
@@ -1 +1 @@
1
- .ids-side-nav{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5;background-color:var(--ids-comp-sidenav-color-bg-surface-default);display:flex;flex-direction:column}.ids-side-nav::before,.ids-side-nav::after,.ids-side-nav *,.ids-side-nav ::before,.ids-side-nav ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-side-nav .ids-side-nav-section{display:flex;flex-direction:column;border-style:solid;background-color:var(--ids-comp-sidenav-section-color-bg-surface-default);border-color:var(--ids-comp-sidenav-section-color-border-surface-default)}.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable{display:flex;flex-direction:column}.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable .ids-side-nav-item-expandable-submenu{display:flex;flex-direction:column;overflow:hidden;max-height:0;opacity:0;transition:all 300ms ease-out}.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable .ids-side-nav-item-expandable-submenu.expanded{max-height:10000px;opacity:1;transition:all 300ms ease-in}.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable .ids-side-nav-item-expandable-summary>button[idsIconButton]{margin-left:auto}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary{display:inline-flex;align-items:center;width:100%;outline-offset:2px;border-style:solid}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single a:link,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single a:visited,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary a:link,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary a:visited{text-decoration:none}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single a:active,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary a:active{outline-style:none}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:not([disabled]),.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:not([disabled]){cursor:pointer}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:is([disabled]),.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled]){cursor:not-allowed;outline-style:none}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{content:"";position:relative;top:0}.ids-side-nav .ids-side-nav-title{display:inline-flex;align-items:center}.ids-side-nav.ids-side-nav-compact{gap:var(--ids-comp-sidenav-size-gap-compact);padding:var(--ids-comp-sidenav-size-padding-y-compact) var(--ids-comp-sidenav-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-section{gap:var(--ids-comp-sidenav-section-size-gap-compact);border-radius:var(--ids-comp-sidenav-section-size-border-radius-compact);border-width:var(--ids-comp-sidenav-section-size-border-width-compact);padding:var(--ids-comp-sidenav-section-size-padding-y-compact) var(--ids-comp-sidenav-section-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-section:has(.ids-side-nav-item>*>.ids-side-nav-item-label){min-width:var(--ids-comp-sidenav-section-size-min-width-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-title{gap:var(--ids-comp-sidenav-section-title-size-gap-compact);padding:var(--ids-comp-sidenav-section-title-size-padding-y-compact) var(--ids-comp-sidenav-section-title-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-title-label{font-family:var(--ids-comp-sidenav-section-title-typography-font-family-compact);font-size:var(--ids-comp-sidenav-section-title-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-section-title-typography-font-weight-compact);letter-spacing:var(--ids-comp-sidenav-section-title-typography-letter-spacing-compact);line-height:var(--ids-comp-sidenav-section-title-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single{border-radius:var(--ids-comp-sidenav-navitem-single-size-border-radius-compact);border-width:var(--ids-comp-sidenav-navitem-single-size-border-width-compact);gap:var(--ids-comp-sidenav-navitem-single-size-gap-compact);height:var(--ids-comp-sidenav-navitem-single-size-height-compact);padding:var(--ids-comp-sidenav-navitem-single-size-padding-y-compact) var(--ids-comp-sidenav-navitem-single-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-single-focused-outline-size-outline-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{height:var(--ids-comp-sidenav-navitem-single-size-icon-compact);width:var(--ids-comp-sidenav-navitem-single-size-icon-compact);font-size:var(--ids-comp-sidenav-navitem-single-icon-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-navitem-single-icon-typography-font-weight-compact);line-height:var(--ids-comp-sidenav-navitem-single-icon-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-single-label-typography-font-family-compact);font-size:var(--ids-comp-sidenav-navitem-single-label-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-navitem-single-label-typography-font-weight-compact);letter-spacing:var(--ids-comp-sidenav-navitem-single-label-typography-letter-spacing-compact);line-height:var(--ids-comp-sidenav-navitem-single-label-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-single-active-indicator-size-height-compact);width:var(--ids-comp-sidenav-navitem-single-active-indicator-size-width-compact);border-radius:var(--ids-comp-sidenav-navitem-single-active-indicator-size-border-radius-compact);left:calc(var(--ids-comp-sidenav-navitem-single-size-padding-x-compact)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-single-size-gap-compact)*-1)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary{border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-radius-compact);border-width:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-width-compact);gap:var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-compact);height:var(--ids-comp-sidenav-navitem-expandable-summary-size-height-compact);padding:var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-y-compact) var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-size-outline-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{height:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-compact);width:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-compact);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-weight-compact);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-family-compact);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-weight-compact);letter-spacing:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-letter-spacing-compact);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-height-compact);width:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-width-compact);border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-border-radius-compact);left:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-compact)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-compact)*-1)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-submenu{gap:var(--ids-comp-sidenav-navitem-expandable-submenu-gap-compact);padding: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)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item.ids-side-nav-item-expandable{gap:var(--ids-comp-sidenav-navitem-expandable-size-gap-compact);padding:var(--ids-comp-sidenav-navitem-expandable-size-padding-y-compact) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu{padding-left:calc(var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-compact) + var(--ids-comp-sidenav-navitem-expandable-submenu-indent-width-compact))}.ids-side-nav.ids-side-nav-compact .ids-side-nav-title+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-size-gap-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-list-size-gap-compact)}.ids-side-nav.ids-side-nav-comfortable{gap:var(--ids-comp-sidenav-size-gap-comfortable);padding:var(--ids-comp-sidenav-size-padding-y-comfortable) var(--ids-comp-sidenav-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-section{gap:var(--ids-comp-sidenav-section-size-gap-comfortable);border-radius:var(--ids-comp-sidenav-section-size-border-radius-comfortable);border-width:var(--ids-comp-sidenav-section-size-border-width-comfortable);padding:var(--ids-comp-sidenav-section-size-padding-y-comfortable) var(--ids-comp-sidenav-section-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-section:has(.ids-side-nav-item>*>.ids-side-nav-item-label){min-width:var(--ids-comp-sidenav-section-size-min-width-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-title{gap:var(--ids-comp-sidenav-section-title-size-gap-comfortable);padding:var(--ids-comp-sidenav-section-title-size-padding-y-comfortable) var(--ids-comp-sidenav-section-title-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-title-label{font-family:var(--ids-comp-sidenav-section-title-typography-font-family-comfortable);font-size:var(--ids-comp-sidenav-section-title-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-section-title-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-sidenav-section-title-typography-letter-spacing-comfortable);line-height:var(--ids-comp-sidenav-section-title-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single{border-radius:var(--ids-comp-sidenav-navitem-single-size-border-radius-comfortable);border-width:var(--ids-comp-sidenav-navitem-single-size-border-width-comfortable);gap:var(--ids-comp-sidenav-navitem-single-size-gap-comfortable);height:var(--ids-comp-sidenav-navitem-single-size-height-comfortable);padding:var(--ids-comp-sidenav-navitem-single-size-padding-y-comfortable) var(--ids-comp-sidenav-navitem-single-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-single-focused-outline-size-outline-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{height:var(--ids-comp-sidenav-navitem-single-size-icon-comfortable);width:var(--ids-comp-sidenav-navitem-single-size-icon-comfortable);font-size:var(--ids-comp-sidenav-navitem-single-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-navitem-single-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-sidenav-navitem-single-icon-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-single-label-typography-font-family-comfortable);font-size:var(--ids-comp-sidenav-navitem-single-label-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-navitem-single-label-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-sidenav-navitem-single-label-typography-letter-spacing-comfortable);line-height:var(--ids-comp-sidenav-navitem-single-label-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-single-active-indicator-size-height-comfortable);width:var(--ids-comp-sidenav-navitem-single-active-indicator-size-width-comfortable);border-radius:var(--ids-comp-sidenav-navitem-single-active-indicator-size-border-radius-comfortable);left:calc(var(--ids-comp-sidenav-navitem-single-size-padding-x-comfortable)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-single-size-gap-comfortable)*-1)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary{border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-radius-comfortable);border-width:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-width-comfortable);gap:var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-comfortable);height:var(--ids-comp-sidenav-navitem-expandable-summary-size-height-comfortable);padding:var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-y-comfortable) var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-size-outline-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{height:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-comfortable);width:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-comfortable);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-family-comfortable);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-letter-spacing-comfortable);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-height-comfortable);width:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-width-comfortable);border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-border-radius-comfortable);left:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-comfortable)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-comfortable)*-1)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-submenu{gap:var(--ids-comp-sidenav-navitem-expandable-submenu-gap-comfortable);padding: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)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item.ids-side-nav-item-expandable{gap:var(--ids-comp-sidenav-navitem-expandable-size-gap-comfortable);padding:var(--ids-comp-sidenav-navitem-expandable-size-padding-y-comfortable) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu{padding-left:calc(var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-comfortable) + var(--ids-comp-sidenav-navitem-expandable-submenu-indent-width-comfortable))}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-title+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-size-gap-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-list-size-gap-comfortable)}.ids-side-nav.ids-side-nav-spacious{gap:var(--ids-comp-sidenav-size-gap-spacious);padding:var(--ids-comp-sidenav-size-padding-y-spacious) var(--ids-comp-sidenav-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-section{gap:var(--ids-comp-sidenav-section-size-gap-spacious);border-radius:var(--ids-comp-sidenav-section-size-border-radius-spacious);border-width:var(--ids-comp-sidenav-section-size-border-width-spacious);padding:var(--ids-comp-sidenav-section-size-padding-y-spacious) var(--ids-comp-sidenav-section-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-section:has(.ids-side-nav-item>*>.ids-side-nav-item-label){min-width:var(--ids-comp-sidenav-section-size-min-width-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-title{gap:var(--ids-comp-sidenav-section-title-size-gap-spacious);padding:var(--ids-comp-sidenav-section-title-size-padding-y-spacious) var(--ids-comp-sidenav-section-title-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-title-label{font-family:var(--ids-comp-sidenav-section-title-typography-font-family-spacious);font-size:var(--ids-comp-sidenav-section-title-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-section-title-typography-font-weight-spacious);letter-spacing:var(--ids-comp-sidenav-section-title-typography-letter-spacing-spacious);line-height:var(--ids-comp-sidenav-section-title-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single{border-radius:var(--ids-comp-sidenav-navitem-single-size-border-radius-spacious);border-width:var(--ids-comp-sidenav-navitem-single-size-border-width-spacious);gap:var(--ids-comp-sidenav-navitem-single-size-gap-spacious);height:var(--ids-comp-sidenav-navitem-single-size-height-spacious);padding:var(--ids-comp-sidenav-navitem-single-size-padding-y-spacious) var(--ids-comp-sidenav-navitem-single-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-single-focused-outline-size-outline-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{height:var(--ids-comp-sidenav-navitem-single-size-icon-spacious);width:var(--ids-comp-sidenav-navitem-single-size-icon-spacious);font-size:var(--ids-comp-sidenav-navitem-single-icon-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-navitem-single-icon-typography-font-weight-spacious);line-height:var(--ids-comp-sidenav-navitem-single-icon-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-single-label-typography-font-family-spacious);font-size:var(--ids-comp-sidenav-navitem-single-label-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-navitem-single-label-typography-font-weight-spacious);letter-spacing:var(--ids-comp-sidenav-navitem-single-label-typography-letter-spacing-spacious);line-height:var(--ids-comp-sidenav-navitem-single-label-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-single-active-indicator-size-height-spacious);width:var(--ids-comp-sidenav-navitem-single-active-indicator-size-width-spacious);border-radius:var(--ids-comp-sidenav-navitem-single-active-indicator-size-border-radius-spacious);left:calc(var(--ids-comp-sidenav-navitem-single-size-padding-x-spacious)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-single-size-gap-spacious)*-1)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary{border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-radius-spacious);border-width:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-width-spacious);gap:var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-spacious);height:var(--ids-comp-sidenav-navitem-expandable-summary-size-height-spacious);padding:var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-y-spacious) var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-size-outline-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{height:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-spacious);width:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-spacious);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-weight-spacious);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-family-spacious);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-weight-spacious);letter-spacing:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-letter-spacing-spacious);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-height-spacious);width:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-width-spacious);border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-border-radius-spacious);left:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-spacious)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-spacious)*-1)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-submenu{gap:var(--ids-comp-sidenav-navitem-expandable-submenu-gap-spacious);padding: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)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item.ids-side-nav-item-expandable{gap:var(--ids-comp-sidenav-navitem-expandable-size-gap-spacious);padding:var(--ids-comp-sidenav-navitem-expandable-size-padding-y-spacious) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu{padding-left:calc(var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-spacious) + var(--ids-comp-sidenav-navitem-expandable-submenu-indent-width-spacious))}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-title+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-size-gap-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-list-size-gap-spacious)}.ids-side-nav.ids-side-nav-dense{gap:var(--ids-comp-sidenav-size-gap-dense);padding:var(--ids-comp-sidenav-size-padding-y-dense) var(--ids-comp-sidenav-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-section{gap:var(--ids-comp-sidenav-section-size-gap-dense);border-radius:var(--ids-comp-sidenav-section-size-border-radius-dense);border-width:var(--ids-comp-sidenav-section-size-border-width-dense);padding:var(--ids-comp-sidenav-section-size-padding-y-dense) var(--ids-comp-sidenav-section-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-section:has(.ids-side-nav-item>*>.ids-side-nav-item-label){min-width:var(--ids-comp-sidenav-section-size-min-width-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-title{gap:var(--ids-comp-sidenav-section-title-size-gap-dense);padding:var(--ids-comp-sidenav-section-title-size-padding-y-dense) var(--ids-comp-sidenav-section-title-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-title-label{font-family:var(--ids-comp-sidenav-section-title-typography-font-family-dense);font-size:var(--ids-comp-sidenav-section-title-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-section-title-typography-font-weight-dense);letter-spacing:var(--ids-comp-sidenav-section-title-typography-letter-spacing-dense);line-height:var(--ids-comp-sidenav-section-title-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single{border-radius:var(--ids-comp-sidenav-navitem-single-size-border-radius-dense);border-width:var(--ids-comp-sidenav-navitem-single-size-border-width-dense);gap:var(--ids-comp-sidenav-navitem-single-size-gap-dense);height:var(--ids-comp-sidenav-navitem-single-size-height-dense);padding:var(--ids-comp-sidenav-navitem-single-size-padding-y-dense) var(--ids-comp-sidenav-navitem-single-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-single-focused-outline-size-outline-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{height:var(--ids-comp-sidenav-navitem-single-size-icon-dense);width:var(--ids-comp-sidenav-navitem-single-size-icon-dense);font-size:var(--ids-comp-sidenav-navitem-single-icon-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-navitem-single-icon-typography-font-weight-dense);line-height:var(--ids-comp-sidenav-navitem-single-icon-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-single-label-typography-font-family-dense);font-size:var(--ids-comp-sidenav-navitem-single-label-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-navitem-single-label-typography-font-weight-dense);letter-spacing:var(--ids-comp-sidenav-navitem-single-label-typography-letter-spacing-dense);line-height:var(--ids-comp-sidenav-navitem-single-label-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-single-active-indicator-size-height-dense);width:var(--ids-comp-sidenav-navitem-single-active-indicator-size-width-dense);border-radius:var(--ids-comp-sidenav-navitem-single-active-indicator-size-border-radius-dense);left:calc(var(--ids-comp-sidenav-navitem-single-size-padding-x-dense)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-single-size-gap-dense)*-1)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary{border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-radius-dense);border-width:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-width-dense);gap:var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-dense);height:var(--ids-comp-sidenav-navitem-expandable-summary-size-height-dense);padding:var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-y-dense) var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-size-outline-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{height:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-dense);width:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-dense);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-weight-dense);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-family-dense);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-weight-dense);letter-spacing:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-letter-spacing-dense);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-height-dense);width:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-width-dense);border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-border-radius-dense);left:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-dense)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-dense)*-1)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-submenu{gap:var(--ids-comp-sidenav-navitem-expandable-submenu-gap-dense);padding: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)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item.ids-side-nav-item-expandable{gap:var(--ids-comp-sidenav-navitem-expandable-size-gap-dense);padding:var(--ids-comp-sidenav-navitem-expandable-size-padding-y-dense) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu{padding-left:calc(var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-dense) + var(--ids-comp-sidenav-navitem-expandable-submenu-indent-width-dense))}.ids-side-nav.ids-side-nav-dense .ids-side-nav-title+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-size-gap-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-list-size-gap-dense)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-default);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-default);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:hover{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-hovered);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-hovered);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:hover>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:focus-visible{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-focused);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-focused);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-focused);outline-color:var(--ids-comp-sidenav-navitem-single-focused-outline-color-dark-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:focus>.ids-icon,.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:focus-visible>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:active{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-pressed);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-pressed);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:active>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([disabled]){color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-disabled);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-disabled);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([disabled])>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([is-active]){color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-active);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-active);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([is-active])>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{background-color:var(--ids-comp-sidenav-navitem-single-active-indicator-color-bg-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-default);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-default);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:hover{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-hovered);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-hovered);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:hover>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-focused);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-focused);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-focused);outline-color:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-color-dark-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus>.ids-icon,.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:active{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-pressed);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-pressed);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:active>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled]){color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-disabled);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-disabled);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled])>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active]){color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-active);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-active);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active])>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{background-color:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-color-bg-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-default);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-default);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:hover{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-hovered);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-hovered);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:hover>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:focus-visible{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-focused);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-focused);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-focused);outline-color:var(--ids-comp-sidenav-navitem-single-focused-outline-color-light-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:focus>.ids-icon,.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:focus-visible>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:active{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-pressed);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-pressed);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:active>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([disabled]){color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-disabled);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-disabled);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([disabled])>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([is-active]){color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-active);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-active);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([is-active])>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{background-color:var(--ids-comp-sidenav-navitem-single-active-indicator-color-bg-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-default);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-default);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:hover{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-hovered);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-hovered);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:hover>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-focused);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-focused);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-focused);outline-color:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-color-light-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus>.ids-icon,.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:active{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-pressed);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-pressed);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:active>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled]){color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-disabled);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-disabled);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled])>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active]){color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-active);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-active);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active])>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{background-color:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-color-bg-light-default)}
1
+ @keyframes expand-submenu{0%{overflow:hidden;visibility:hidden}99%{overflow:hidden;visibility:visible}100%{overflow:visible;visibility:visible}}@keyframes collapse-submenu{0%{overflow:visible;visibility:visible}99%{overflow:hidden;visibility:visible}100%{overflow:hidden;visibility:hidden}}.ids-side-nav{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0);line-height:1.5;background-color:var(--ids-comp-sidenav-color-bg-surface-default);display:flex;flex-direction:column}.ids-side-nav::before,.ids-side-nav::after,.ids-side-nav *,.ids-side-nav ::before,.ids-side-nav ::after{box-sizing:border-box;border-width:0;border-style:none;border-color:rgba(0,0,0,0)}.ids-side-nav .ids-side-nav-section{display:flex;flex-direction:column;border-style:solid;background-color:var(--ids-comp-sidenav-section-color-bg-surface-default);border-color:var(--ids-comp-sidenav-section-color-border-surface-default)}.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable{display:flex;flex-direction:column}.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable .ids-side-nav-item-expandable-submenu{display:flex;flex-direction:column;overflow:hidden;max-height:0;opacity:0;transition:all 300ms ease-out;animation:collapse-submenu .3s forwards}.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable .ids-side-nav-item-expandable-submenu.expanded{opacity:1;transition:all 300ms ease-in;animation:expand-submenu .3s forwards}.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable .ids-side-nav-item-expandable-summary>button[idsIconButton]{margin-left:auto}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary{display:inline-flex;align-items:center;width:100%;outline-offset:2px;border-style:solid}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single a:link,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single a:visited,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary a:link,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary a:visited{text-decoration:none}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single a:active,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary a:active{outline-style:none}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:not([disabled]),.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:not([disabled]){cursor:pointer}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:is([disabled]),.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled]){cursor:not-allowed;outline-style:none}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{content:"";position:relative;top:0}.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:focus-visible,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-style:solid}.ids-side-nav .ids-side-nav-title{display:inline-flex;align-items:center}.ids-side-nav.ids-side-nav-compact{gap:var(--ids-comp-sidenav-size-gap-compact);padding:var(--ids-comp-sidenav-size-padding-y-compact) var(--ids-comp-sidenav-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-section{gap:var(--ids-comp-sidenav-section-size-gap-compact);border-radius:var(--ids-comp-sidenav-section-size-border-radius-compact);border-width:var(--ids-comp-sidenav-section-size-border-width-compact);padding:var(--ids-comp-sidenav-section-size-padding-y-compact) var(--ids-comp-sidenav-section-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-section:has(.ids-side-nav-item>*>.ids-side-nav-item-label){min-width:var(--ids-comp-sidenav-section-size-min-width-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-title{gap:var(--ids-comp-sidenav-section-title-size-gap-compact);padding:var(--ids-comp-sidenav-section-title-size-padding-y-compact) var(--ids-comp-sidenav-section-title-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-title-label{font-family:var(--ids-comp-sidenav-section-title-typography-font-family-compact);font-size:var(--ids-comp-sidenav-section-title-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-section-title-typography-font-weight-compact);letter-spacing:var(--ids-comp-sidenav-section-title-typography-letter-spacing-compact);line-height:var(--ids-comp-sidenav-section-title-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single{border-radius:var(--ids-comp-sidenav-navitem-single-size-border-radius-compact);border-width:var(--ids-comp-sidenav-navitem-single-size-border-width-compact);gap:var(--ids-comp-sidenav-navitem-single-size-gap-compact);height:var(--ids-comp-sidenav-navitem-single-size-height-compact);padding:var(--ids-comp-sidenav-navitem-single-size-padding-y-compact) var(--ids-comp-sidenav-navitem-single-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-single-focused-outline-size-outline-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{height:var(--ids-comp-sidenav-navitem-single-size-icon-compact);width:var(--ids-comp-sidenav-navitem-single-size-icon-compact);font-size:var(--ids-comp-sidenav-navitem-single-icon-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-navitem-single-icon-typography-font-weight-compact);line-height:var(--ids-comp-sidenav-navitem-single-icon-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-single-label-typography-font-family-compact);font-size:var(--ids-comp-sidenav-navitem-single-label-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-navitem-single-label-typography-font-weight-compact);letter-spacing:var(--ids-comp-sidenav-navitem-single-label-typography-letter-spacing-compact);line-height:var(--ids-comp-sidenav-navitem-single-label-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-single-active-indicator-size-height-compact);width:var(--ids-comp-sidenav-navitem-single-active-indicator-size-width-compact);border-radius:var(--ids-comp-sidenav-navitem-single-active-indicator-size-border-radius-compact);left:calc(var(--ids-comp-sidenav-navitem-single-size-padding-x-compact)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-single-size-gap-compact)*-1)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary{border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-radius-compact);border-width:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-width-compact);gap:var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-compact);height:var(--ids-comp-sidenav-navitem-expandable-summary-size-height-compact);padding:var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-y-compact) var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-size-outline-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{height:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-compact);width:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-compact);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-weight-compact);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-family-compact);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-size-compact);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-weight-compact);letter-spacing:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-letter-spacing-compact);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-line-height-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-height-compact);width:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-width-compact);border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-border-radius-compact);left:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-compact)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-compact)*-1)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded{--submenu-item-height: 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)) );max-height:calc(var(--submenu-items-count)*var(--submenu-item-height));gap:var(--ids-comp-sidenav-navitem-expandable-submenu-gap-compact);padding: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)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item.ids-side-nav-item-expandable{padding:var(--ids-comp-sidenav-navitem-expandable-size-padding-y-compact) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-submenu.expanded){gap:var(--ids-comp-sidenav-navitem-expandable-size-gap-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu{padding-left:calc(var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-compact) + var(--ids-comp-sidenav-navitem-expandable-submenu-indent-width-compact))}.ids-side-nav.ids-side-nav-compact .ids-side-nav-title+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-size-gap-compact)}.ids-side-nav.ids-side-nav-compact .ids-side-nav-item+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-list-size-gap-compact)}.ids-side-nav.ids-side-nav-comfortable{gap:var(--ids-comp-sidenav-size-gap-comfortable);padding:var(--ids-comp-sidenav-size-padding-y-comfortable) var(--ids-comp-sidenav-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-section{gap:var(--ids-comp-sidenav-section-size-gap-comfortable);border-radius:var(--ids-comp-sidenav-section-size-border-radius-comfortable);border-width:var(--ids-comp-sidenav-section-size-border-width-comfortable);padding:var(--ids-comp-sidenav-section-size-padding-y-comfortable) var(--ids-comp-sidenav-section-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-section:has(.ids-side-nav-item>*>.ids-side-nav-item-label){min-width:var(--ids-comp-sidenav-section-size-min-width-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-title{gap:var(--ids-comp-sidenav-section-title-size-gap-comfortable);padding:var(--ids-comp-sidenav-section-title-size-padding-y-comfortable) var(--ids-comp-sidenav-section-title-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-title-label{font-family:var(--ids-comp-sidenav-section-title-typography-font-family-comfortable);font-size:var(--ids-comp-sidenav-section-title-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-section-title-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-sidenav-section-title-typography-letter-spacing-comfortable);line-height:var(--ids-comp-sidenav-section-title-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single{border-radius:var(--ids-comp-sidenav-navitem-single-size-border-radius-comfortable);border-width:var(--ids-comp-sidenav-navitem-single-size-border-width-comfortable);gap:var(--ids-comp-sidenav-navitem-single-size-gap-comfortable);height:var(--ids-comp-sidenav-navitem-single-size-height-comfortable);padding:var(--ids-comp-sidenav-navitem-single-size-padding-y-comfortable) var(--ids-comp-sidenav-navitem-single-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-single-focused-outline-size-outline-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{height:var(--ids-comp-sidenav-navitem-single-size-icon-comfortable);width:var(--ids-comp-sidenav-navitem-single-size-icon-comfortable);font-size:var(--ids-comp-sidenav-navitem-single-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-navitem-single-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-sidenav-navitem-single-icon-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-single-label-typography-font-family-comfortable);font-size:var(--ids-comp-sidenav-navitem-single-label-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-navitem-single-label-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-sidenav-navitem-single-label-typography-letter-spacing-comfortable);line-height:var(--ids-comp-sidenav-navitem-single-label-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-single-active-indicator-size-height-comfortable);width:var(--ids-comp-sidenav-navitem-single-active-indicator-size-width-comfortable);border-radius:var(--ids-comp-sidenav-navitem-single-active-indicator-size-border-radius-comfortable);left:calc(var(--ids-comp-sidenav-navitem-single-size-padding-x-comfortable)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-single-size-gap-comfortable)*-1)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary{border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-radius-comfortable);border-width:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-width-comfortable);gap:var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-comfortable);height:var(--ids-comp-sidenav-navitem-expandable-summary-size-height-comfortable);padding:var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-y-comfortable) var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-size-outline-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{height:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-comfortable);width:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-comfortable);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-weight-comfortable);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-family-comfortable);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-size-comfortable);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-weight-comfortable);letter-spacing:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-letter-spacing-comfortable);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-line-height-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-height-comfortable);width:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-width-comfortable);border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-border-radius-comfortable);left:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-comfortable)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-comfortable)*-1)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded{--submenu-item-height: 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)) );max-height:calc(var(--submenu-items-count)*var(--submenu-item-height));gap:var(--ids-comp-sidenav-navitem-expandable-submenu-gap-comfortable);padding: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)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item.ids-side-nav-item-expandable{padding:var(--ids-comp-sidenav-navitem-expandable-size-padding-y-comfortable) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-submenu.expanded){gap:var(--ids-comp-sidenav-navitem-expandable-size-gap-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu{padding-left:calc(var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-comfortable) + var(--ids-comp-sidenav-navitem-expandable-submenu-indent-width-comfortable))}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-title+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-size-gap-comfortable)}.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-list-size-gap-comfortable)}.ids-side-nav.ids-side-nav-spacious{gap:var(--ids-comp-sidenav-size-gap-spacious);padding:var(--ids-comp-sidenav-size-padding-y-spacious) var(--ids-comp-sidenav-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-section{gap:var(--ids-comp-sidenav-section-size-gap-spacious);border-radius:var(--ids-comp-sidenav-section-size-border-radius-spacious);border-width:var(--ids-comp-sidenav-section-size-border-width-spacious);padding:var(--ids-comp-sidenav-section-size-padding-y-spacious) var(--ids-comp-sidenav-section-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-section:has(.ids-side-nav-item>*>.ids-side-nav-item-label){min-width:var(--ids-comp-sidenav-section-size-min-width-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-title{gap:var(--ids-comp-sidenav-section-title-size-gap-spacious);padding:var(--ids-comp-sidenav-section-title-size-padding-y-spacious) var(--ids-comp-sidenav-section-title-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-title-label{font-family:var(--ids-comp-sidenav-section-title-typography-font-family-spacious);font-size:var(--ids-comp-sidenav-section-title-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-section-title-typography-font-weight-spacious);letter-spacing:var(--ids-comp-sidenav-section-title-typography-letter-spacing-spacious);line-height:var(--ids-comp-sidenav-section-title-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single{border-radius:var(--ids-comp-sidenav-navitem-single-size-border-radius-spacious);border-width:var(--ids-comp-sidenav-navitem-single-size-border-width-spacious);gap:var(--ids-comp-sidenav-navitem-single-size-gap-spacious);height:var(--ids-comp-sidenav-navitem-single-size-height-spacious);padding:var(--ids-comp-sidenav-navitem-single-size-padding-y-spacious) var(--ids-comp-sidenav-navitem-single-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-single-focused-outline-size-outline-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{height:var(--ids-comp-sidenav-navitem-single-size-icon-spacious);width:var(--ids-comp-sidenav-navitem-single-size-icon-spacious);font-size:var(--ids-comp-sidenav-navitem-single-icon-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-navitem-single-icon-typography-font-weight-spacious);line-height:var(--ids-comp-sidenav-navitem-single-icon-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-single-label-typography-font-family-spacious);font-size:var(--ids-comp-sidenav-navitem-single-label-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-navitem-single-label-typography-font-weight-spacious);letter-spacing:var(--ids-comp-sidenav-navitem-single-label-typography-letter-spacing-spacious);line-height:var(--ids-comp-sidenav-navitem-single-label-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-single-active-indicator-size-height-spacious);width:var(--ids-comp-sidenav-navitem-single-active-indicator-size-width-spacious);border-radius:var(--ids-comp-sidenav-navitem-single-active-indicator-size-border-radius-spacious);left:calc(var(--ids-comp-sidenav-navitem-single-size-padding-x-spacious)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-single-size-gap-spacious)*-1)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary{border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-radius-spacious);border-width:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-width-spacious);gap:var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-spacious);height:var(--ids-comp-sidenav-navitem-expandable-summary-size-height-spacious);padding:var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-y-spacious) var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-size-outline-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{height:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-spacious);width:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-spacious);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-weight-spacious);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-family-spacious);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-size-spacious);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-weight-spacious);letter-spacing:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-letter-spacing-spacious);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-line-height-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-height-spacious);width:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-width-spacious);border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-border-radius-spacious);left:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-spacious)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-spacious)*-1)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded{--submenu-item-height: 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)) );max-height:calc(var(--submenu-items-count)*var(--submenu-item-height));gap:var(--ids-comp-sidenav-navitem-expandable-submenu-gap-spacious);padding: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)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item.ids-side-nav-item-expandable{padding:var(--ids-comp-sidenav-navitem-expandable-size-padding-y-spacious) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-submenu.expanded){gap:var(--ids-comp-sidenav-navitem-expandable-size-gap-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu{padding-left:calc(var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-spacious) + var(--ids-comp-sidenav-navitem-expandable-submenu-indent-width-spacious))}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-title+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-size-gap-spacious)}.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-list-size-gap-spacious)}.ids-side-nav.ids-side-nav-dense{gap:var(--ids-comp-sidenav-size-gap-dense);padding:var(--ids-comp-sidenav-size-padding-y-dense) var(--ids-comp-sidenav-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-section{gap:var(--ids-comp-sidenav-section-size-gap-dense);border-radius:var(--ids-comp-sidenav-section-size-border-radius-dense);border-width:var(--ids-comp-sidenav-section-size-border-width-dense);padding:var(--ids-comp-sidenav-section-size-padding-y-dense) var(--ids-comp-sidenav-section-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-section:has(.ids-side-nav-item>*>.ids-side-nav-item-label){min-width:var(--ids-comp-sidenav-section-size-min-width-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-title{gap:var(--ids-comp-sidenav-section-title-size-gap-dense);padding:var(--ids-comp-sidenav-section-title-size-padding-y-dense) var(--ids-comp-sidenav-section-title-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-title-label{font-family:var(--ids-comp-sidenav-section-title-typography-font-family-dense);font-size:var(--ids-comp-sidenav-section-title-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-section-title-typography-font-weight-dense);letter-spacing:var(--ids-comp-sidenav-section-title-typography-letter-spacing-dense);line-height:var(--ids-comp-sidenav-section-title-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single{border-radius:var(--ids-comp-sidenav-navitem-single-size-border-radius-dense);border-width:var(--ids-comp-sidenav-navitem-single-size-border-width-dense);gap:var(--ids-comp-sidenav-navitem-single-size-gap-dense);height:var(--ids-comp-sidenav-navitem-single-size-height-dense);padding:var(--ids-comp-sidenav-navitem-single-size-padding-y-dense) var(--ids-comp-sidenav-navitem-single-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-single-focused-outline-size-outline-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{height:var(--ids-comp-sidenav-navitem-single-size-icon-dense);width:var(--ids-comp-sidenav-navitem-single-size-icon-dense);font-size:var(--ids-comp-sidenav-navitem-single-icon-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-navitem-single-icon-typography-font-weight-dense);line-height:var(--ids-comp-sidenav-navitem-single-icon-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-single-label-typography-font-family-dense);font-size:var(--ids-comp-sidenav-navitem-single-label-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-navitem-single-label-typography-font-weight-dense);letter-spacing:var(--ids-comp-sidenav-navitem-single-label-typography-letter-spacing-dense);line-height:var(--ids-comp-sidenav-navitem-single-label-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-single-active-indicator-size-height-dense);width:var(--ids-comp-sidenav-navitem-single-active-indicator-size-width-dense);border-radius:var(--ids-comp-sidenav-navitem-single-active-indicator-size-border-radius-dense);left:calc(var(--ids-comp-sidenav-navitem-single-size-padding-x-dense)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-single-size-gap-dense)*-1)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary{border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-radius-dense);border-width:var(--ids-comp-sidenav-navitem-expandable-summary-size-border-width-dense);gap:var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-dense);height:var(--ids-comp-sidenav-navitem-expandable-summary-size-height-dense);padding:var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-y-dense) var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{outline-width:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-size-outline-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{height:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-dense);width:var(--ids-comp-sidenav-navitem-expandable-summary-size-icon-dense);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-font-weight-dense);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-icon-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary .ids-side-nav-item-label{font-family:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-family-dense);font-size:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-size-dense);font-weight:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-font-weight-dense);letter-spacing:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-letter-spacing-dense);line-height:var(--ids-comp-sidenav-navitem-expandable-summary-label-typography-line-height-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{height:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-height-dense);width:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-width-dense);border-radius:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-size-border-radius-dense);left:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-dense)*-1);margin-right:calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-dense)*-1)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded{--submenu-item-height: 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)) );max-height:calc(var(--submenu-items-count)*var(--submenu-item-height));gap:var(--ids-comp-sidenav-navitem-expandable-submenu-gap-dense);padding: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)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item.ids-side-nav-item-expandable{padding:var(--ids-comp-sidenav-navitem-expandable-size-padding-y-dense) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-submenu.expanded){gap:var(--ids-comp-sidenav-navitem-expandable-size-gap-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu{padding-left:calc(var(--ids-comp-sidenav-navitem-expandable-submenu-padding-left-dense) + var(--ids-comp-sidenav-navitem-expandable-submenu-indent-width-dense))}.ids-side-nav.ids-side-nav-dense .ids-side-nav-title+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-size-gap-dense)}.ids-side-nav.ids-side-nav-dense .ids-side-nav-item+.ids-side-nav-item{margin-top:var(--ids-comp-sidenav-section-list-size-gap-dense)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-default);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-default);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:hover{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-hovered);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-hovered);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:hover>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:focus-visible{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-focused);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-focused);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-focused);outline-color:var(--ids-comp-sidenav-navitem-single-focused-outline-color-dark-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:focus>.ids-icon,.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:focus-visible>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:active{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-pressed);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-pressed);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:active>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([disabled]){color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-disabled);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-disabled);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([disabled])>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([is-active]){color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-surface-active);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-surface-active);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-surface-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([is-active])>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-surface-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{background-color:var(--ids-comp-sidenav-navitem-single-active-indicator-color-bg-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-default);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-default);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:hover{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-hovered);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-hovered);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:hover>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-focused);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-focused);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-focused);outline-color:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-color-dark-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus>.ids-icon,.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:active{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-pressed);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-pressed);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:active>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled]){color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-disabled);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-disabled);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled])>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active]){color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-surface-active);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-surface-active);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-surface-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active])>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-surface-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-surface .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{background-color:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-color-bg-surface-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-default);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-default);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:hover{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-hovered);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-hovered);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:hover>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:focus-visible{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-focused);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-focused);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-focused);outline-color:var(--ids-comp-sidenav-navitem-single-focused-outline-color-light-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:focus>.ids-icon,.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:focus-visible>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:active{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-pressed);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-pressed);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:active>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([disabled]){color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-disabled);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-disabled);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([disabled])>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([is-active]){color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-label-light-active);background:var(--ids-comp-sidenav-navitem-single-standard-color-bg-light-active);border-color:var(--ids-comp-sidenav-navitem-single-standard-color-border-light-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([is-active])>.ids-icon{color:var(--ids-comp-sidenav-navitem-single-standard-color-fg-icon-light-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before{background-color:var(--ids-comp-sidenav-navitem-single-active-indicator-color-bg-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-default);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-default);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-default)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:hover{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-hovered);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-hovered);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:hover>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-hovered)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-focused);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-focused);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-focused);outline-color:var(--ids-comp-sidenav-navitem-expandable-summary-focused-outline-color-light-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus>.ids-icon,.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-focused)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:active{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-pressed);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-pressed);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:active>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-pressed)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled]){color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-disabled);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-disabled);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([disabled])>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-disabled)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active]){color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-label-light-active);background:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-bg-light-active);border-color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-border-light-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active])>.ids-icon{color:var(--ids-comp-sidenav-navitem-expandable-summary-standard-color-fg-icon-light-active)}.ids-side-nav.ids-side-nav-standard.ids-side-nav-light .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before{background-color:var(--ids-comp-sidenav-navitem-expandable-summary-active-indicator-color-bg-light-default)}
package/dist/side-nav/side-nav.plugin.js CHANGED
@@ -2,6 +2,16 @@
2
2
  module.exports = function SideNavPlugin() {
3
3
  return function ({ addComponents }) {
4
4
  const cssObj = {
5
+ '@keyframes expand-submenu': {
6
+ '0%': { overflow: 'hidden', visibility: 'hidden' },
7
+ '99%': { overflow: 'hidden', visibility: 'visible' },
8
+ '100%': { overflow: 'visible', visibility: 'visible' },
9
+ },
10
+ '@keyframes collapse-submenu': {
11
+ '0%': { overflow: 'visible', visibility: 'visible' },
12
+ '99%': { overflow: 'hidden', visibility: 'visible' },
13
+ '100%': { overflow: 'hidden', visibility: 'hidden' },
14
+ },
5
15
  '.ids-side-nav': {
6
16
  boxSizing: 'border-box',
7
17
  borderWidth: '0',
@@ -33,11 +43,12 @@ module.exports = function SideNavPlugin() {
33
43
  maxHeight: '0',
34
44
  opacity: 0,
35
45
  transition: 'all 300ms ease-out',
46
+ animation: 'collapse-submenu .3s forwards',
36
47
  },
37
48
  '.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable .ids-side-nav-item-expandable-submenu.expanded': {
38
- maxHeight: '10000px',
39
49
  opacity: 1,
40
50
  transition: 'all 300ms ease-in',
51
+ animation: 'expand-submenu .3s forwards',
41
52
  },
42
53
  '.ids-side-nav .ids-side-nav-item.ids-side-nav-item-expandable .ids-side-nav-item-expandable-summary>button[idsIconButton]': {
43
54
  marginLeft: 'auto',
@@ -59,6 +70,8 @@ module.exports = function SideNavPlugin() {
59
70
  { cursor: 'not-allowed', outlineStyle: 'none' },
60
71
  '.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:is([is-active-indicator]):before,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:is([is-active-indicator]):before':
61
72
  { content: '""', position: 'relative', top: '0' },
73
+ '.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:focus,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-single:focus-visible,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus,.ids-side-nav .ids-side-nav-item .ids-side-nav-item-expandable-summary:focus-visible':
74
+ { outlineStyle: 'solid' },
62
75
  '.ids-side-nav .ids-side-nav-title': { display: 'inline-flex', alignItems: 'center' },
63
76
  '.ids-side-nav.ids-side-nav-compact': {
64
77
  gap: 'var(--ids-comp-sidenav-size-gap-compact)',
@@ -147,16 +160,20 @@ module.exports = function SideNavPlugin() {
147
160
  left: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-compact)*-1)',
148
161
  marginRight: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-compact)*-1)',
149
162
  },
150
- '.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-submenu': {
163
+ '.ids-side-nav.ids-side-nav-compact .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded': {
164
+ '--submenu-item-height':
165
+ '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)) )',
166
+ maxHeight: 'calc(var(--submenu-items-count)*var(--submenu-item-height))',
151
167
  gap: 'var(--ids-comp-sidenav-navitem-expandable-submenu-gap-compact)',
152
168
  padding:
153
169
  '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)',
154
170
  },
155
171
  '.ids-side-nav.ids-side-nav-compact .ids-side-nav-item.ids-side-nav-item-expandable': {
156
- gap: 'var(--ids-comp-sidenav-navitem-expandable-size-gap-compact)',
157
172
  padding:
158
173
  'var(--ids-comp-sidenav-navitem-expandable-size-padding-y-compact) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-compact)',
159
174
  },
175
+ '.ids-side-nav.ids-side-nav-compact .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-submenu.expanded)':
176
+ { gap: 'var(--ids-comp-sidenav-navitem-expandable-size-gap-compact)' },
160
177
  '.ids-side-nav.ids-side-nav-compact .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu':
161
178
  {
162
179
  paddingLeft:
@@ -255,16 +272,20 @@ module.exports = function SideNavPlugin() {
255
272
  left: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-comfortable)*-1)',
256
273
  marginRight: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-comfortable)*-1)',
257
274
  },
258
- '.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-submenu': {
275
+ '.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded': {
276
+ '--submenu-item-height':
277
+ '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)) )',
278
+ maxHeight: 'calc(var(--submenu-items-count)*var(--submenu-item-height))',
259
279
  gap: 'var(--ids-comp-sidenav-navitem-expandable-submenu-gap-comfortable)',
260
280
  padding:
261
281
  '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)',
262
282
  },
263
283
  '.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item.ids-side-nav-item-expandable': {
264
- gap: 'var(--ids-comp-sidenav-navitem-expandable-size-gap-comfortable)',
265
284
  padding:
266
285
  'var(--ids-comp-sidenav-navitem-expandable-size-padding-y-comfortable) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-comfortable)',
267
286
  },
287
+ '.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-submenu.expanded)':
288
+ { gap: 'var(--ids-comp-sidenav-navitem-expandable-size-gap-comfortable)' },
268
289
  '.ids-side-nav.ids-side-nav-comfortable .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu':
269
290
  {
270
291
  paddingLeft:
@@ -363,16 +384,20 @@ module.exports = function SideNavPlugin() {
363
384
  left: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-spacious)*-1)',
364
385
  marginRight: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-spacious)*-1)',
365
386
  },
366
- '.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-submenu': {
387
+ '.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded': {
388
+ '--submenu-item-height':
389
+ '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)) )',
390
+ maxHeight: 'calc(var(--submenu-items-count)*var(--submenu-item-height))',
367
391
  gap: 'var(--ids-comp-sidenav-navitem-expandable-submenu-gap-spacious)',
368
392
  padding:
369
393
  '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)',
370
394
  },
371
395
  '.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item.ids-side-nav-item-expandable': {
372
- gap: 'var(--ids-comp-sidenav-navitem-expandable-size-gap-spacious)',
373
396
  padding:
374
397
  'var(--ids-comp-sidenav-navitem-expandable-size-padding-y-spacious) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-spacious)',
375
398
  },
399
+ '.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-submenu.expanded)':
400
+ { gap: 'var(--ids-comp-sidenav-navitem-expandable-size-gap-spacious)' },
376
401
  '.ids-side-nav.ids-side-nav-spacious .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu':
377
402
  {
378
403
  paddingLeft:
@@ -469,16 +494,20 @@ module.exports = function SideNavPlugin() {
469
494
  left: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-padding-x-dense)*-1)',
470
495
  marginRight: 'calc(var(--ids-comp-sidenav-navitem-expandable-summary-size-gap-dense)*-1)',
471
496
  },
472
- '.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-submenu': {
497
+ '.ids-side-nav.ids-side-nav-dense .ids-side-nav-item .ids-side-nav-item-expandable-submenu.expanded': {
498
+ '--submenu-item-height':
499
+ '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)) )',
500
+ maxHeight: 'calc(var(--submenu-items-count)*var(--submenu-item-height))',
473
501
  gap: 'var(--ids-comp-sidenav-navitem-expandable-submenu-gap-dense)',
474
502
  padding:
475
503
  '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)',
476
504
  },
477
505
  '.ids-side-nav.ids-side-nav-dense .ids-side-nav-item.ids-side-nav-item-expandable': {
478
- gap: 'var(--ids-comp-sidenav-navitem-expandable-size-gap-dense)',
479
506
  padding:
480
507
  'var(--ids-comp-sidenav-navitem-expandable-size-padding-y-dense) var(--ids-comp-sidenav-navitem-expandable-size-padding-x-dense)',
481
508
  },
509
+ '.ids-side-nav.ids-side-nav-dense .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-submenu.expanded)':
510
+ { gap: 'var(--ids-comp-sidenav-navitem-expandable-size-gap-dense)' },
482
511
  '.ids-side-nav.ids-side-nav-dense .ids-side-nav-item.ids-side-nav-item-expandable:has(.ids-side-nav-item-expandable-summary>.ids-icon[icon-leading]) .ids-side-nav-item-expandable-submenu':
483
512
  {
484
513
  paddingLeft:
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@i-cell/ids-styles",
3
- "version": "0.0.50",
3
+ "version": "0.0.52",
4
4
  "private": false,
5
5
  "description": "Stylesheets for i-Cell Design System UI Kit components (currently Vue and Angular)",
6
6
  "scripts": {