@dnb/eufemia 10.37.0 → 10.39.0

package/es/components/table/style/dnb-table.min.css

@@ -1 +1 @@
-.dnb-table,.dnb-table__container{--table-border-width:0.0625rem;--table-border:var(--table-border-width) solid var(--table-border-color);--table-outline-width:0.0625rem;--table-outline:var(--table-outline-width) solid var(--table-outline-color);--table-outline-radius:0.5rem}.dnb-table{border-collapse:collapse;border-spacing:0;display:table;margin-bottom:.5rem;margin-top:0;table-layout:auto;width:100%}.dnb-table--fixed{table-layout:fixed;width:auto}.dnb-table--no-wrap{white-space:nowrap}.dnb-table>caption{background-color:var(--color-white);caption-side:bottom;font-size:var(--font-size-basis);padding:.5rem 0 .5rem 1rem;position:relative;text-align:left}.dnb-table>caption:after{border-top:var(--table-border);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:-.0625rem;right:0;top:0;top:calc(var(--table-border-width)*-1);z-index:1}.dnb-table>caption:last-child:after{right:0}.dnb-table--outline{clip-path:inset(0 0 -10rem 0 round var(--table-outline-radius) var(--table-outline-radius) 0 0);position:relative;z-index:1}.dnb-table--outline,.dnb-table--outline:after{border-radius:var(--table-outline-radius)}.dnb-table--outline:after{border:var(--table-outline);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1;z-index:3}.dnb-table--outline>caption,.dnb-table--outline>caption:after{border-radius:0 0 var(--table-outline-radius) var(--table-outline-radius)}.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--has-accordion-content.dnb-table__tr--last,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child{clip-path:none}.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--has-accordion-content.dnb-table__tr--last .dnb-table__td,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--has-accordion-content.dnb-table__tr--last .dnb-table__td:after,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--has-accordion-content.dnb-table__tr--last .dnb-table__td:before,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--has-accordion-content.dnb-table__tr--last .dnb-table__th,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--has-accordion-content.dnb-table__tr--last .dnb-table__th:after,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--has-accordion-content.dnb-table__tr--last .dnb-table__th:before,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__td,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__td:after,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__td:before,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__th,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__th:after,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__th:before{border-radius:0}.dnb-table.dnb-skeleton>*{-webkit-text-fill-color:var(--skeleton-color)}.dnb-card .dnb-table{--table-outline-color:transparent;margin-bottom:0}.dnb-table .dnb-table__th.dnb-table--sortable,.dnb-table>thead>tr>th.dnb-table--sortable{color:var(--color-sea-green)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button{align-items:flex-end;box-shadow:none;color:inherit;font-size:inherit;font-weight:var(--font-weight-medium);line-height:inherit;margin:0;padding:0 .5rem 0 0;position:relative;text-align:inherit;z-index:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon{opacity:0;transition:opacity .2s ease-out,transform .5s ease-out}html[data-visual-test] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon,html[data-visual-test] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon{transition:none}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text{font-size:inherit;line-height:inherit;margin:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after{right:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon{align-self:flex-end;margin-bottom:.25rem;margin-top:auto}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after{color:var(--color-sea-green);opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]){color:var(--color-sea-green)}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]):not(:focus) .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}:not(.dnb-table--active) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):active .dnb-icon,:not(.dnb-table--active) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):active .dnb-icon,:not(.dnb-table--active) html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):active .dnb-icon,:not(.dnb-table--active) html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):active .dnb-icon,html[data-visual-test] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html[data-visual-test] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html[data-visual-test] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html[data-visual-test] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon{opacity:1}html:not([data-visual-test]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-visual-test]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-visual-test]) html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-visual-test]) html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after{color:inherit;opacity:1}html:not([data-visual-test]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-visual-test]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-visual-test]) html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-visual-test]) html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after{visibility:visible}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]){color:var(--color-sea-green)}html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{border-radius:inherit;bottom:0;height:inherit;left:-.5rem;outline:none;top:0;z-index:1}html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--sortable[align=right],.dnb-table>thead>tr>th.dnb-table--sortable[align=right]{padding-right:.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button{flex-direction:row-reverse}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right{padding-right:.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__icon{margin-left:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text{padding-right:0}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text:after{right:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:not(:hover) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:not(:hover) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{color:var(--color-sea-green);opacity:1}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:visible}html[data-whatinput=keyboard] .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard] .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--reversed .dnb-table__sort-button.dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--reversed .dnb-table__sort-button.dnb-button .dnb-icon{transform:rotate(180deg);transform-origin:50% 50%}.dnb-table .dnb-table__th .dnb-table__help-button,.dnb-table>thead>tr>th .dnb-table__help-button{margin-left:.5rem}.dnb-table>thead>.dnb-table--no-wrap .dnb-table__sort-button{white-space:nowrap}.dnb-table__th__horizontal{align-items:flex-end;display:flex}.dnb-table thead th,.dnb-table__th{background-color:var(--table-th-background-color)}.dnb-table tbody tr:has(th:first-child+td:last-child) th[scope=row]{--table-th-background-color:initial}.dnb-table tbody tr th[scope=row]+td:last-child{width:100%}.dnb-table--border tbody .dnb-table__td:after,.dnb-table--border tbody .dnb-table__th:after{border:var(--table-border);border-bottom:none;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:-.0625rem;top:0;z-index:1}.dnb-table--border tbody .dnb-table__td:last-child:after,.dnb-table--border tbody .dnb-table__th:last-child:after{right:0}.dnb-table--border tbody .dnb-table__td:first-child:after,.dnb-table--border tbody .dnb-table__th:first-child:after{border-left:none}.dnb-table--border tbody .dnb-table__td:last-child:after,.dnb-table--border tbody .dnb-table__th:last-child:after{border-right:none}.dnb-table--border tbody .dnb-table__tr:first-child .dnb-table__td:after,.dnb-table--border tbody .dnb-table__tr:first-child .dnb-table__th:after{border-top:none}.dnb-table--border thead+tbody .dnb-table__tr:first-child .dnb-table__td:after,.dnb-table--border thead+tbody .dnb-table__tr:first-child .dnb-table__th:after{border-top:var(--table-border)}.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:first-child,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:first-child:after,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:first-child:before,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:first-child,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:first-child:after,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:first-child:before,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:first-child,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:first-child:after,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:first-child:before,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:first-child,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:first-child:after,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:first-child:before,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:first-child,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:first-child:after,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:first-child:before,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:first-child,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:first-child:after,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:first-child:before{border-top-left-radius:var(--table-outline-radius)}.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:last-child,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:last-child:after,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:last-child:before,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:last-child,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:last-child:after,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:last-child:before,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:last-child,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:last-child:after,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:last-child:before,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:last-child,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:last-child:after,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:last-child:before,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:last-child,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:last-child:after,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:last-child:before,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:last-child,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:last-child:after,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:last-child:before{border-top-right-radius:var(--table-outline-radius)}.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child{clip-path:inset(0 round 0 0 var(--table-outline-radius) var(--table-outline-radius))}.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:first-child,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:first-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:first-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:first-child,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:first-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:first-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:first-child,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:first-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:first-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:first-child,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:first-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:first-child:before{border-bottom-left-radius:var(--table-outline-radius)}.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:last-child,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:last-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:last-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:last-child,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:last-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:last-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:last-child,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:last-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:last-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:last-child,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:last-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:last-child:before{border-bottom-right-radius:var(--table-outline-radius)}.dnb-table td.dnb-table__td--no-spacing,.dnb-table__td--no-spacing{padding:0}.dnb-table td.dnb-table__td--spacing-horizontal,.dnb-table__td--spacing-horizontal{padding-bottom:0;padding-top:0}.dnb-table .dnb-table__tr,.dnb-table .dnb-table__tr--even,.dnb-table>tbody>tr{background-color:var(--color-black-3)}.dnb-table .dnb-table__tr--odd,.dnb-table .dnb-table__tr:not(.dnb-table__tr--even):nth-of-type(2n),.dnb-table>tbody>tr:not(.dnb-table__tr--even):nth-of-type(2n){background-color:var(--color-white)}.dnb-table tbody td,.dnb-table thead th,.dnb-table__td,.dnb-table__th{border-spacing:0;position:relative;word-break:keep-all}.dnb-table tr.sticky{position:sticky;transform:translate3d(0,var(--table-offset,0),0);z-index:4}.dnb-table tr.sticky.css-position{top:var(--table-top,0)}.dnb-table tr.sticky.is-sticky th:before{bottom:0;box-shadow:var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);clip-path:inset(6px 0 -48px 0);content:"";height:6px;left:0;position:absolute;right:0}.dnb-table__container{position:relative}.dnb-table__container:after{border:var(--table-outline);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1;z-index:3}.dnb-table__container,.dnb-table__container:after{border-radius:var(--table-outline-radius)}.dnb-table__container,.dnb-table__container__body,.dnb-table__container__foot,.dnb-table__container__head{display:flex;flex-direction:column}.dnb-table__container__body .dnb-table{position:relative}.dnb-table__container__body .dnb-table:not([class*=space__bottom]){margin-bottom:0}.dnb-table__container__body .dnb-table__size--large .dnb-table__th{padding-top:1.5rem}.dnb-table__container__body .dnb-table:after{border-bottom:var(--table-border);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1}.dnb-table__container__body .dnb-table tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:after,.dnb-table__container__body .dnb-table tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:after,.dnb-table__container__body .dnb-table>:not(thead)+tbody .dnb-table__tr:first-of-type .dnb-table__td:after,.dnb-table__container__body .dnb-table>:not(thead)+tbody .dnb-table__tr:first-of-type .dnb-table__th:after{border-top:none}.dnb-table__container__head{padding:2rem 1rem 0}.dnb-table__container__head--empty{min-height:1.5rem;padding:0}.dnb-spacing .dnb-table__container__head .dnb-h--large:not([class*=space__top]){margin:0}.dnb-table__container__foot{padding:1rem 1rem 1.25rem}.dnb-table__container__foot--empty{min-height:1rem;padding:0}.dnb-table__container .dnb-table__scroll-view{clip-path:inset(0 round 0 0 var(--table-outline-radius) var(--table-outline-radius))}@supports (-webkit-appearance:none) and (not (-moz-appearance:meterbar)){.dnb-table__container:after{bottom:calc(var(--table-outline-width)*-1)}}.dnb-modal__content .dnb-table__container .dnb-table__scroll-view{overflow:visible}.dnb-card .dnb-table__container{width:100%}.dnb-table{--table-accordion-background:var(--color-white);--table-accordion-header-background:var(--color-white);--table-accordion-border-width:0.0625rem;--table-accordion-border-color:var(--color-black-20);--table-accordion-border:var(--table-accordion-border-width) solid var(--table-accordion-border-color);--table-accordion-icon-color:var(--color-sea-green);--table-accordion-icon-color--active:var(--color-emerald-green);--table-accordion-icon-color--disabled:var(--color-sea-green-30);--table-accordion-outline-color:var(--color-emerald-green);--table-accordion-outline-width:var(--focus-ring-width);--table-accordion-outline-background--active:var(--color-pistachio)}.dnb-table__th.dnb-table__th__accordion-icon.dnb-table__th{padding:0}.dnb-table__th.dnb-table__th__accordion-icon,.dnb-table__th.dnb-table__th__accordion-icon div{text-indent:-300vw;width:3.5rem}.dnb-table__size--medium .dnb-table__th.dnb-table__th__accordion-icon,.dnb-table__size--medium .dnb-table__th.dnb-table__th__accordion-icon div{width:3rem}.dnb-table__size--small .dnb-table__th.dnb-table__th__accordion-icon,.dnb-table__size--small .dnb-table__th.dnb-table__th__accordion-icon div{width:2.5rem}.dnb-table__td.dnb-table__td__accordion-icon{-webkit-user-select:none;user-select:none}.dnb-table__td.dnb-table__td__accordion-icon.dnb-table__td{padding:0}.dnb-table__tr--has-accordion-content .dnb-table__toggle-button{display:flex;justify-content:center}.dnb-table__tr--has-accordion-content .dnb-table__toggle-button .dnb-icon{color:var(--table-accordion-icon-color);transition:transform .5s var(--easing-default)}.dnb-table__tr--has-accordion-content.dnb-table__tr--no-animation .dnb-table__toggle-button .dnb-icon,html[data-visual-test] .dnb-table__tr--has-accordion-content .dnb-table__toggle-button .dnb-icon{transition:none!important}.dnb-table__tr--has-accordion-content,.dnb-table__tr__accordion-content{position:relative}.dnb-table__tr--has-accordion-content.dnb-table__tr--expanded,.dnb-table__tr__accordion-content{z-index:3}.dnb-table__tr--has-accordion-content:active,.dnb-table__tr--has-accordion-content:hover:not(.dnb-table__tr--hover.dnb-table__tr--expanded),html[data-whatinput=keyboard] .dnb-table__tr--has-accordion-content:focus{z-index:5}.dnb-table__tr--has-accordion-content.dnb-table__tr--expanded .dnb-table__toggle-button .dnb-icon{transform:rotate(180deg)}.dnb-table--border .dnb-table__tr--has-accordion-content.dnb-table__tr--expanded td:after{border-bottom:none;border-left:none;border-right:none}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled){outline:none}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled) td:before{border:var(--table-accordion-outline-width) solid transparent;content:"";inset:0;pointer-events:none;position:absolute;z-index:3}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled) td:not(:first-of-type):before{border-left:none}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled) td:not(:last-of-type):before{border-right:none}html:not([data-whatintent=touch]) .dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):hover:not([disabled]) td:before{border-color:var(--table-accordion-outline-color)}html:not([data-whatintent=touch]) .dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):hover:not([disabled]) .dnb-table__td__accordion-icon .dnb-icon{color:var(--table-accordion-icon-color--active)}.dnb-table--border tbody .dnb-table__tr--has-accordion-content:not(.dnb-table__tr--expanded):not(.dnb-table__tr--last) .dnb-table__td:before{bottom:calc(var(--table-border-width)*-1)}.dnb-table__tr--has-accordion-content.dnb-table__tr--expanded:not(.dnb-table__tr--disabled):hover .dnb-table__td{background-color:var(--color-white)}html[data-whatinput=keyboard] .dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):not(:active):not(:hover):focus td:before{border-color:var(--focus-ring-color);border-width:var(--focus-ring-width)}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):not(:active):not(:hover):focus td:first-of-type:before{left:0}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):not(:active):not(:hover):focus td:last-of-type:before{right:0}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):active td:before,html:not([data-whatintent=touch]) .dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):active:hover td:before{border-color:var(--table-accordion-outline-color);border-width:var(--table-accordion-border-width)}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):active .dnb-table__td{background-color:var(--table-accordion-outline-background--active)}.dnb-table__tr--has-accordion-content.dnb-table__tr:not(.dnb-table__tr--disabled):active .dnb-table__td .dnb-table__td__accordion-icon .dnb-icon{color:var(--table-accordion-icon-color--active)}.dnb-table__tr--has-accordion-content.dnb-table__tr--expanded:not(.dnb-table__tr--disabled).dnb-table__tr--hover:not(:active):hover .dnb-table__td{background-color:var(--table-accordion-header-background)}.dnb-table__tr--has-accordion-content.dnb-table__tr--expanded:not(.dnb-table__tr--disabled).dnb-table__tr--hover:not(:active):hover .dnb-table__td:before{border:none;border-top:var(--table-accordion-border)}html:not([data-whatinput=keyboard]) .dnb-table__tr--has-accordion-content.dnb-table__tr.dnb-table__tr--expanded:not(.dnb-table__tr--disabled):not(:active):not(:hover){background-color:var(--table-accordion-header-background)}html:not([data-whatinput=keyboard]) .dnb-table__tr--has-accordion-content.dnb-table__tr.dnb-table__tr--expanded:not(.dnb-table__tr--disabled):not(:active):not(:hover) td:before{border:none;border-top:var(--table-accordion-border)}.dnb-table__tr--has-accordion-content.dnb-table__tr--disabled .dnb-table__td__accordion-icon .dnb-icon{color:var(--table-accordion-icon-color--disabled)}@supports (-webkit-appearance:none) and (stroke-color:transparent) and (not (-webkit-touch-callout:none)){.dnb-table__tr__accordion-content[hidden]{display:block}}.dnb-table__tr__accordion-content__inner{overflow:hidden;position:relative;transition:height .4s var(--easing-default);will-change:height}.dnb-table__tr__accordion-content__inner__spacing{padding:1rem;transform:translateY(-10px);transition:transform .5s var(--easing-default)}.dnb-table__tr__accordion-content--parallax .dnb-table__tr__accordion-content__inner__spacing{transform:translateY(0)}html[data-visual-test] .dnb-table__tr__accordion-content--parallax .dnb-table__tr__accordion-content__inner__spacing{transition:none}.dnb-table__tr__accordion-content--expanded>td.dnb-table__td{background-color:var(--color-white)}.dnb-table__tr__accordion-content--expanded+.dnb-table__tr--has-accordion-content .dnb-table__td:after{border-top:var(--table-accordion-border);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:-.0625rem;top:0;z-index:1}.dnb-table__tr__accordion-content--expanded+.dnb-table__tr--has-accordion-content .dnb-table__td:last-child:after{right:0}.dnb-table__tr__accordion-content--single td{padding:0!important;width:calc(100% - 3.5rem)}.dnb-table__size--medium .dnb-table__tr__accordion-content--single td{width:calc(100% - 3rem)}.dnb-table__size--small .dnb-table__tr__accordion-content--single td{width:calc(100% - 2.5rem)}.dnb-table__tr__accordion-content--single td:before{border-bottom:var(--table-accordion-border);bottom:calc(var(--table-accordion-border-width)*-1);content:"";left:0;pointer-events:none;position:absolute;right:0;top:auto}.dnb-table--outline .dnb-table__tr__accordion-content--single:last-of-type td:before{border-bottom:none}.dnb-table--border .dnb-table__tr__accordion-content--single td:after{border-top:none}.dnb-table__tr__accordion-content--single>td.dnb-table__td{padding:0}.dnb-table__tr__accordion-content--single>td.dnb-table__td .dnb-dl,.dnb-table__tr__accordion-content--single>td.dnb-table__td .dnb-dl dt{margin:0}.dnb-table__tr__accordion-content.dnb-table__tr .dnb-table__td{background-color:var(--table-accordion-background);vertical-align:top}.dnb-table__tr--has-accordion-content:not(.dnb-table__tr--disabled){cursor:pointer}.dnb-table__td-wrapper{display:flex}.dnb-spacing .dnb-table dl,.dnb-spacing .dnb-table ol,.dnb-spacing .dnb-table p,.dnb-spacing .dnb-table pre,.dnb-spacing .dnb-table ul{margin-bottom:0;margin-top:0}
+.dnb-table,.dnb-table__container{--table-border-width:0.0625rem;--table-border:var(--table-border-width) solid var(--table-border-color);--table-outline-width:0.0625rem;--table-outline:var(--table-outline-width) solid var(--table-outline-color);--table-outline-radius:0.5rem}.dnb-table{border-collapse:collapse;border-spacing:0;display:table;margin-bottom:.5rem;margin-top:0;table-layout:auto;width:100%}.dnb-table--fixed{table-layout:fixed;width:auto}.dnb-table--no-wrap{white-space:nowrap}.dnb-table>caption{background-color:var(--color-white);caption-side:bottom;font-size:var(--font-size-basis);padding:.5rem 0 .5rem 1rem;position:relative;text-align:left}.dnb-table>caption:after{border-top:var(--table-border);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:-.0625rem;right:0;top:0;top:calc(var(--table-border-width)*-1);z-index:1}.dnb-table>caption:last-child:after{right:0}.dnb-table--outline{clip-path:inset(0 0 -10rem 0 round var(--table-outline-radius) var(--table-outline-radius) 0 0);position:relative;z-index:1}.dnb-table--outline,.dnb-table--outline:after{border-radius:var(--table-outline-radius)}.dnb-table--outline:after{border:var(--table-outline);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1;z-index:3}.dnb-table--outline>caption,.dnb-table--outline>caption:after{border-radius:0 0 var(--table-outline-radius) var(--table-outline-radius)}.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--clickable.dnb-table__tr--last,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child{clip-path:none}.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--clickable.dnb-table__tr--last .dnb-table__td,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--clickable.dnb-table__tr--last .dnb-table__td:after,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--clickable.dnb-table__tr--last .dnb-table__td:before,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--clickable.dnb-table__tr--last .dnb-table__th,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--clickable.dnb-table__tr--last .dnb-table__th:after,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr--clickable.dnb-table__tr--last .dnb-table__th:before,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__td,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__td:after,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__td:before,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__th,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__th:after,.dnb-table--outline>caption:not(.dnb-sr-only)~tbody:last-child .dnb-table__tr:last-child .dnb-table__th:before{border-radius:0}.dnb-table.dnb-skeleton>*{-webkit-text-fill-color:var(--skeleton-color)}.dnb-card .dnb-table{--table-outline-color:transparent;margin-bottom:0}.dnb-table .dnb-table__th.dnb-table--sortable,.dnb-table>thead>tr>th.dnb-table--sortable{color:var(--color-sea-green)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button{align-items:flex-end;box-shadow:none;color:inherit;font-size:inherit;font-weight:var(--font-weight-medium);line-height:inherit;margin:0;padding:0 .5rem 0 0;position:relative;text-align:inherit;z-index:1}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon{opacity:0;transition:opacity .2s ease-out,transform .5s ease-out}html[data-visual-test] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon,html[data-visual-test] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button>.dnb-icon{transition:none}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text{font-size:inherit;line-height:inherit;margin:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after{right:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__icon{align-self:flex-end;margin-bottom:.25rem;margin-top:auto}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after{color:var(--color-sea-green);opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]){color:var(--color-sea-green)}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]):not(:focus) .dnb-icon,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]):not(:focus) .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}:not(.dnb-table--active) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):active .dnb-icon,:not(.dnb-table--active) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):active .dnb-icon,:not(.dnb-table--active) html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):active .dnb-icon,:not(.dnb-table--active) html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):active .dnb-icon,html[data-visual-test] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html[data-visual-test] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html[data-visual-test] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon,html[data-visual-test] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-icon{opacity:1}html:not([data-visual-test]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-visual-test]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-visual-test]) html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-visual-test]) html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after{color:inherit;opacity:1}html:not([data-visual-test]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-visual-test]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-visual-test]) html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-visual-test]) html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after{visibility:visible}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]){color:var(--color-sea-green)}html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{border-radius:inherit;bottom:0;height:inherit;left:-.5rem;outline:none;top:0;z-index:1}html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{bottom:-.5rem;content:"";left:-1rem;position:absolute;right:.5rem;right:-.5rem;top:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--sortable[align=right],.dnb-table>thead>tr>th.dnb-table--sortable[align=right]{padding-right:.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button{flex-direction:row-reverse}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right{padding-right:.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__icon,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__icon{margin-left:-.5rem}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text{padding-right:0}.dnb-table .dnb-table__th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable[align=right] .dnb-table__sort-button.dnb-button--tertiary.dnb-button--icon-position-right .dnb-button__text:after{right:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:not(:hover) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:not(:hover) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button .dnb-icon{opacity:1}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{color:var(--color-sea-green);opacity:1}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:focus:not([disabled]) .dnb-button__text:after{opacity:0}.dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus:not(:active) .dnb-button__text:after{visibility:visible}html[data-whatinput=keyboard] .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus .dnb-button__text:after,html[data-whatinput=keyboard] .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:focus .dnb-button__text:after{visibility:hidden}.dnb-table .dnb-table__th.dnb-table--reversed .dnb-table__sort-button.dnb-button .dnb-icon,.dnb-table>thead>tr>th.dnb-table--reversed .dnb-table__sort-button.dnb-button .dnb-icon{transform:rotate(180deg);transform-origin:50% 50%}.dnb-table .dnb-table__th .dnb-table__help-button,.dnb-table>thead>tr>th .dnb-table__help-button{margin-left:.5rem}.dnb-table>thead>.dnb-table--no-wrap .dnb-table__sort-button{white-space:nowrap}.dnb-table__th__horizontal{align-items:flex-end;display:flex}.dnb-table thead th,.dnb-table__th{background-color:var(--table-th-background-color)}.dnb-table tbody tr:has(th:first-child+td:last-child) th[scope=row]{--table-th-background-color:initial}.dnb-table tbody tr th[scope=row]+td:last-child{width:100%}.dnb-table--border tbody .dnb-table__td:after,.dnb-table--border tbody .dnb-table__th:after{border:var(--table-border);border-bottom:none;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:-.0625rem;top:0;z-index:1}.dnb-table--border tbody .dnb-table__td:last-child:after,.dnb-table--border tbody .dnb-table__th:last-child:after{right:0}.dnb-table--border tbody .dnb-table__td:first-child:after,.dnb-table--border tbody .dnb-table__th:first-child:after{border-left:none}.dnb-table--border tbody .dnb-table__td:last-child:after,.dnb-table--border tbody .dnb-table__th:last-child:after{border-right:none}.dnb-table--border tbody .dnb-table__tr:first-child .dnb-table__td:after,.dnb-table--border tbody .dnb-table__tr:first-child .dnb-table__th:after{border-top:none}.dnb-table--border thead+tbody .dnb-table__tr:first-child .dnb-table__td:after,.dnb-table--border thead+tbody .dnb-table__tr:first-child .dnb-table__th:after{border-top:var(--table-border)}.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:first-child,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:first-child:after,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:first-child:before,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:first-child,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:first-child:after,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:first-child:before,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:first-child,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:first-child:after,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:first-child:before,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:first-child,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:first-child:after,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:first-child:before,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:first-child,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:first-child:after,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:first-child:before,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:first-child,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:first-child:after,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:first-child:before{border-top-left-radius:var(--table-outline-radius)}.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:last-child,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:last-child:after,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__td:last-child:before,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:last-child,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:last-child:after,.dnb-table--outline caption:first-child+tbody .dnb-table__tr:first-of-type .dnb-table__th:last-child:before,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:last-child,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:last-child:after,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:last-child:before,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:last-child,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:last-child:after,.dnb-table--outline tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:last-child:before,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:last-child,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:last-child:after,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__td:last-child:before,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:last-child,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:last-child:after,.dnb-table--outline thead:first-of-type .dnb-table__tr:first-of-type .dnb-table__th:last-child:before{border-top-right-radius:var(--table-outline-radius)}.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child{clip-path:inset(0 round 0 0 var(--table-outline-radius) var(--table-outline-radius))}.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:first-child,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:first-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:first-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:first-child,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:first-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:first-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:first-child,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:first-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:first-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:first-child,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:first-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:first-child:before{border-bottom-left-radius:var(--table-outline-radius)}.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:last-child,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:last-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__td:last-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:last-child,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:last-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr--clickable:not(.dnb-table__tr--expanded).dnb-table__tr--last .dnb-table__th:last-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:last-child,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:last-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__td:last-child:before,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:last-child,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:last-child:after,.dnb-table--outline tbody:last-child .dnb-table__tr:last-child .dnb-table__th:last-child:before{border-bottom-right-radius:var(--table-outline-radius)}.dnb-table td.dnb-table__td--no-spacing,.dnb-table__td--no-spacing{padding:0}.dnb-table td.dnb-table__td--spacing-horizontal,.dnb-table__td--spacing-horizontal{padding-bottom:0;padding-top:0}.dnb-table .dnb-table__tr,.dnb-table .dnb-table__tr--even,.dnb-table>tbody>tr{background-color:var(--color-black-3)}.dnb-table .dnb-table__tr--odd,.dnb-table .dnb-table__tr:not(.dnb-table__tr--even):nth-of-type(2n),.dnb-table>tbody>tr:not(.dnb-table__tr--even):nth-of-type(2n){background-color:var(--color-white)}.dnb-table tbody td,.dnb-table thead th,.dnb-table__td,.dnb-table__th{border-spacing:0;position:relative;word-break:keep-all}.dnb-table tr.sticky{position:sticky;transform:translate3d(0,var(--table-offset,0),0);z-index:4}.dnb-table tr.sticky.css-position{top:var(--table-top,0)}.dnb-table tr.sticky.is-sticky th:before{bottom:0;box-shadow:var(--shadow-default-x) -2px 12px 8px var(--shadow-default-color);clip-path:inset(6px 0 -48px 0);content:"";height:6px;left:0;position:absolute;right:0}.dnb-table__container{position:relative}.dnb-table__container:after{border:var(--table-outline);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1;z-index:3}.dnb-table__container,.dnb-table__container:after{border-radius:var(--table-outline-radius)}.dnb-table__container,.dnb-table__container__body,.dnb-table__container__foot,.dnb-table__container__head{display:flex;flex-direction:column}.dnb-table__container__body .dnb-table{position:relative}.dnb-table__container__body .dnb-table:not([class*=space__bottom]){margin-bottom:0}.dnb-table__container__body .dnb-table__size--large .dnb-table__th{padding-top:1.5rem}.dnb-table__container__body .dnb-table:after{border-bottom:var(--table-border);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0;z-index:1}.dnb-table__container__body .dnb-table tbody:first-child .dnb-table__tr:first-of-type .dnb-table__td:after,.dnb-table__container__body .dnb-table tbody:first-child .dnb-table__tr:first-of-type .dnb-table__th:after,.dnb-table__container__body .dnb-table>:not(thead)+tbody .dnb-table__tr:first-of-type .dnb-table__td:after,.dnb-table__container__body .dnb-table>:not(thead)+tbody .dnb-table__tr:first-of-type .dnb-table__th:after{border-top:none}.dnb-table__container__head{padding:2rem 1rem 0}.dnb-table__container__head--empty{min-height:1.5rem;padding:0}.dnb-spacing .dnb-table__container__head .dnb-h--large:not([class*=space__top]){margin:0}.dnb-table__container__foot{padding:1rem 1rem 1.25rem}.dnb-table__container__foot--empty{min-height:1rem;padding:0}.dnb-table__container .dnb-table__scroll-view{clip-path:inset(0 round 0 0 var(--table-outline-radius) var(--table-outline-radius))}@supports (-webkit-appearance:none) and (not (-moz-appearance:meterbar)){.dnb-table__container:after{bottom:calc(var(--table-outline-width)*-1)}}.dnb-modal__content .dnb-table__container .dnb-table__scroll-view{overflow:visible}.dnb-card .dnb-table__container{width:100%}.dnb-table{--table-accordion-background:var(--color-white);--table-accordion-header-background:var(--color-white);--table-accordion-border-width:0.0625rem;--table-accordion-border-color:var(--color-black-20);--table-accordion-border:var(--table-accordion-border-width) solid var(--table-accordion-border-color);--table-accordion-icon-color:var(--color-sea-green);--table-accordion-icon-color--active:var(--color-emerald-green);--table-accordion-icon-color--disabled:var(--color-sea-green-30);--table-accordion-outline-color:var(--color-emerald-green);--table-accordion-outline-width:var(--focus-ring-width);--table-accordion-outline-background--active:var(--color-pistachio)}.dnb-table__th.dnb-table__th__button-icon.dnb-table__th{padding:0}.dnb-table__th.dnb-table__th__button-icon,.dnb-table__th.dnb-table__th__button-icon div{text-indent:-300vw;width:3.5rem}.dnb-table__size--medium .dnb-table__th.dnb-table__th__button-icon,.dnb-table__size--medium .dnb-table__th.dnb-table__th__button-icon div{width:3rem}.dnb-table__size--small .dnb-table__th.dnb-table__th__button-icon,.dnb-table__size--small .dnb-table__th.dnb-table__th__button-icon div{width:2.5rem}.dnb-table__td.dnb-table__td__button-icon{-webkit-user-select:none;user-select:none}.dnb-table__td.dnb-table__td__button-icon.dnb-table__td{padding:0}.dnb-table__tr--clickable .dnb-table__button{display:flex;justify-content:center}.dnb-table__tr--clickable .dnb-table__button .dnb-icon{color:var(--table-accordion-icon-color);transition:transform .5s var(--easing-default)}.dnb-table__tr--clickable.dnb-table__tr--no-animation .dnb-table__button .dnb-icon,html[data-visual-test] .dnb-table__tr--clickable .dnb-table__button .dnb-icon{transition:none!important}.dnb-table__tr--clickable,.dnb-table__tr__accordion-content{position:relative}.dnb-table__tr--clickable.dnb-table__tr--expanded,.dnb-table__tr__accordion-content{z-index:3}.dnb-table__tr--clickable:active,.dnb-table__tr--clickable:hover:not(.dnb-table__tr--hover.dnb-table__tr--expanded),html[data-whatinput=keyboard] .dnb-table__tr--clickable:focus{z-index:5}.dnb-table__tr--clickable.dnb-table__tr--expanded .dnb-table__button .dnb-icon{transform:rotate(180deg)}.dnb-table--border .dnb-table__tr--clickable.dnb-table__tr--expanded td:after{border-bottom:none;border-left:none;border-right:none}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled){outline:none}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled) td:before{border:var(--table-accordion-outline-width) solid transparent;content:"";inset:0;pointer-events:none;position:absolute;z-index:3}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled) td:not(:first-of-type):before{border-left:none}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled) td:not(:last-of-type):before{border-right:none}html:not([data-whatintent=touch]) .dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):hover:not([disabled]) td:before{border-color:var(--table-accordion-outline-color)}html:not([data-whatintent=touch]) .dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):hover:not([disabled]) .dnb-table__td__button-icon .dnb-icon{color:var(--table-accordion-icon-color--active)}.dnb-table--border tbody .dnb-table__tr--clickable:not(.dnb-table__tr--expanded):not(.dnb-table__tr--last) .dnb-table__td:before{bottom:calc(var(--table-border-width)*-1)}.dnb-table__tr--clickable.dnb-table__tr--expanded:not(.dnb-table__tr--disabled):hover .dnb-table__td{background-color:var(--color-white)}html[data-whatinput=keyboard] .dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):not(:active):not(:hover):focus td:before{border-color:var(--focus-ring-color);border-width:var(--focus-ring-width)}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):not(:active):not(:hover):focus td:first-of-type:before{left:0}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):not(:active):not(:hover):focus td:last-of-type:before{right:0}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):active td:before,html:not([data-whatintent=touch]) .dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):active:hover td:before{border-color:var(--table-accordion-outline-color);border-width:var(--table-accordion-border-width)}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):active .dnb-table__td{background-color:var(--table-accordion-outline-background--active)}.dnb-table__tr--clickable.dnb-table__tr:not(.dnb-table__tr--disabled):active .dnb-table__td .dnb-table__td__button-icon .dnb-icon{color:var(--table-accordion-icon-color--active)}.dnb-table__tr--clickable.dnb-table__tr--expanded:not(.dnb-table__tr--disabled).dnb-table__tr--hover:not(:active):hover .dnb-table__td{background-color:var(--table-accordion-header-background)}.dnb-table__tr--clickable.dnb-table__tr--expanded:not(.dnb-table__tr--disabled).dnb-table__tr--hover:not(:active):hover .dnb-table__td:before{border:none;border-top:var(--table-accordion-border)}html:not([data-whatinput=keyboard]) .dnb-table__tr--clickable.dnb-table__tr.dnb-table__tr--expanded:not(.dnb-table__tr--disabled):not(:active):not(:hover){background-color:var(--table-accordion-header-background)}html:not([data-whatinput=keyboard]) .dnb-table__tr--clickable.dnb-table__tr.dnb-table__tr--expanded:not(.dnb-table__tr--disabled):not(:active):not(:hover) td:before{border:none;border-top:var(--table-accordion-border)}.dnb-table__tr--clickable.dnb-table__tr--disabled .dnb-table__td__button-icon .dnb-icon{color:var(--table-accordion-icon-color--disabled)}@supports (-webkit-appearance:none) and (stroke-color:transparent) and (not (-webkit-touch-callout:none)){.dnb-table__tr__accordion-content[hidden]{display:block}}.dnb-table__tr__accordion-content__inner{overflow:hidden;position:relative;transition:height .4s var(--easing-default);will-change:height}.dnb-table__tr__accordion-content__inner__spacing{padding:1rem;transform:translateY(-10px);transition:transform .5s var(--easing-default)}.dnb-table__tr__accordion-content--parallax .dnb-table__tr__accordion-content__inner__spacing{transform:translateY(0)}html[data-visual-test] .dnb-table__tr__accordion-content--parallax .dnb-table__tr__accordion-content__inner__spacing{transition:none}.dnb-table__tr__accordion-content--expanded>td.dnb-table__td{background-color:var(--color-white)}.dnb-table__tr__accordion-content--expanded+.dnb-table__tr--clickable .dnb-table__td:after{border-top:var(--table-accordion-border);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:-.0625rem;top:0;z-index:1}.dnb-table__tr__accordion-content--expanded+.dnb-table__tr--clickable .dnb-table__td:last-child:after{right:0}.dnb-table__tr__accordion-content--single td{padding:0!important;width:calc(100% - 3.5rem)}.dnb-table__size--medium .dnb-table__tr__accordion-content--single td{width:calc(100% - 3rem)}.dnb-table__size--small .dnb-table__tr__accordion-content--single td{width:calc(100% - 2.5rem)}.dnb-table__tr__accordion-content--single td:before{border-bottom:var(--table-accordion-border);bottom:calc(var(--table-accordion-border-width)*-1);content:"";left:0;pointer-events:none;position:absolute;right:0;top:auto}.dnb-table--outline .dnb-table__tr__accordion-content--single:last-of-type td:before{border-bottom:none}.dnb-table--border .dnb-table__tr__accordion-content--single td:after{border-top:none}.dnb-table__tr__accordion-content--single>td.dnb-table__td{padding:0}.dnb-table__tr__accordion-content--single>td.dnb-table__td .dnb-dl,.dnb-table__tr__accordion-content--single>td.dnb-table__td .dnb-dl dt{margin:0}.dnb-table__tr__accordion-content.dnb-table__tr .dnb-table__td{background-color:var(--table-accordion-background);vertical-align:top}.dnb-table__tr--clickable:not(.dnb-table__tr--disabled){cursor:pointer}.dnb-table__td-wrapper{display:flex}.dnb-spacing .dnb-table dl,.dnb-spacing .dnb-table ol,.dnb-spacing .dnb-table p,.dnb-spacing .dnb-table pre,.dnb-spacing .dnb-table ul{margin-bottom:0;margin-top:0}

package/es/components/table/style/dnb-table.scss

@@ -85,7 +85,7 @@
       }
       &:not(.dnb-sr-only) ~ tbody:last-child {
         .dnb-table__tr:last-child,
-        .dnb-table__tr--has-accordion-content.dnb-table__tr--last {
+        .dnb-table__tr--clickable.dnb-table__tr--last {
           clip-path: none;
 
           .dnb-table__th,

package/es/components/table/style/table-accordion.scss

@@ -4,12 +4,12 @@
 */
 
 @mixin tableAccordionActiveColor {
-  .dnb-table__td__accordion-icon .dnb-icon {
+  .dnb-table__td__button-icon .dnb-icon {
     color: var(--table-accordion-icon-color--active);
   }
 }
 @mixin tableAccordionDisabledColor {
-  .dnb-table__td__accordion-icon .dnb-icon {
+  .dnb-table__td__button-icon .dnb-icon {
     color: var(--table-accordion-icon-color--disabled);
   }
 }
@@ -32,7 +32,7 @@
   --table-accordion-outline-width: var(--focus-ring-width);
   --table-accordion-outline-background--active: var(--color-pistachio);
 
-  &__th#{&}__th__accordion-icon {
+  &__th#{&}__th__button-icon {
     &.dnb-table__th {
       padding: 0;
     }
@@ -53,14 +53,14 @@
     }
   }
 
-  &__td#{&}__td__accordion-icon {
+  &__td#{&}__td__button-icon {
     &.dnb-table__td {
       padding: 0;
     }
     user-select: none; // prevent selection on double-click
   }
 
-  &__tr--has-accordion-content &__toggle-button {
+  &__tr--clickable &__button {
     display: flex; // to ensure we inherit the correct size from its content
     justify-content: center;
 
@@ -69,26 +69,21 @@
       transition: transform 500ms var(--easing-default);
     }
   }
-  &__tr--has-accordion-content#{&}__tr--no-animation
-    &__toggle-button
-    .dnb-icon,
-  html[data-visual-test]
-    &__tr--has-accordion-content
-    &__toggle-button
-    .dnb-icon {
+  &__tr--clickable#{&}__tr--no-animation &__button .dnb-icon,
+  html[data-visual-test] &__tr--clickable &__button .dnb-icon {
     transition: none !important;
   }
 
-  &__tr--has-accordion-content,
+  &__tr--clickable,
   &__tr__accordion-content {
     position: relative;
   }
-  &__tr--has-accordion-content#{&}__tr--expanded,
+  &__tr--clickable#{&}__tr--expanded,
   &__tr__accordion-content {
     z-index: 3; // ensure borders are visible in certain states
   }
 
-  &__tr--has-accordion-content {
+  &__tr--clickable {
     &:active,
     html[data-whatinput='keyboard'] &:focus,
     &:hover:not(.dnb-table__tr--hover.dnb-table__tr--expanded) {
@@ -96,13 +91,11 @@
     }
   }
 
-  &__tr--has-accordion-content#{&}__tr--expanded
-    &__toggle-button
-    .dnb-icon {
+  &__tr--clickable#{&}__tr--expanded &__button .dnb-icon {
     transform: rotate(180deg);
   }
 
-  &__tr--has-accordion-content#{&}__tr--expanded {
+  &__tr--clickable#{&}__tr--expanded {
     .dnb-table--border & td::after {
       border-bottom: none;
       border-left: none;
@@ -110,7 +103,7 @@
     }
   }
 
-  &__tr--has-accordion-content#{&}__tr:not(&__tr--disabled) {
+  &__tr--clickable#{&}__tr:not(&__tr--disabled) {
     outline: none;
 
     td::before {
@@ -145,19 +138,18 @@
 
   &--border
     tbody
-    &__tr--has-accordion-content:not(#{&}__tr--expanded):not(&__tr--last)
+    &__tr--clickable:not(#{&}__tr--expanded):not(&__tr--last)
     &__td::before {
     bottom: calc(var(--table-border-width) * -1);
   }
 
-  &__tr--has-accordion-content#{&}__tr--expanded:not(&__tr--disabled):hover
-    &__td {
+  &__tr--clickable#{&}__tr--expanded:not(&__tr--disabled):hover &__td {
     background-color: var(--color-white);
   }
 
-  &__tr--has-accordion-content#{&}__tr:not(&__tr--disabled):not(
-      :active
-    ):not(:hover):focus {
+  &__tr--clickable#{&}__tr:not(&__tr--disabled):not(:active):not(
+      :hover
+    ):focus {
     td::before {
       @include whatInput(keyboard) {
         border-color: var(--focus-ring-color);
@@ -172,7 +164,7 @@
     }
   }
 
-  &__tr--has-accordion-content#{&}__tr:not(&__tr--disabled):active {
+  &__tr--clickable#{&}__tr:not(&__tr--disabled):active {
     html:not([data-whatintent='touch']) &:hover td::before,
     td::before {
       border-color: var(--table-accordion-outline-color);
@@ -182,13 +174,13 @@
     }
   }
 
-  &__tr--has-accordion-content#{&}__tr:not(&__tr--disabled):active &__td {
+  &__tr--clickable#{&}__tr:not(&__tr--disabled):active &__td {
     background-color: var(--table-accordion-outline-background--active);
 
     @include tableAccordionActiveColor();
   }
 
-  &__tr--has-accordion-content#{&}__tr--expanded:not(
+  &__tr--clickable#{&}__tr--expanded:not(
       &__tr--disabled
     )#{&}__tr--hover:not(:active):hover
     &__td {
@@ -200,9 +192,9 @@
     }
   }
 
-  &__tr--has-accordion-content#{&}__tr#{&}__tr--expanded:not(
-      &__tr--disabled
-    ):not(:active):not(:hover) {
+  &__tr--clickable#{&}__tr#{&}__tr--expanded:not(&__tr--disabled):not(
+      :active
+    ):not(:hover) {
     @include whatInputNot('keyboard') {
       background-color: var(--table-accordion-header-background);
 
@@ -213,7 +205,7 @@
     }
   }
 
-  &__tr--has-accordion-content#{&}__tr--disabled {
+  &__tr--clickable#{&}__tr--disabled {
     @include tableAccordionDisabledColor();
   }
 
@@ -256,7 +248,7 @@
         background-color: var(--color-white);
       }
 
-      + .dnb-table__tr--has-accordion-content .dnb-table__td {
+      + .dnb-table__tr--clickable .dnb-table__td {
         @include tableBorder() {
           border-top: var(--table-accordion-border);
         }
@@ -323,13 +315,13 @@
   }
 
   // stylelint-disable-next-line
-  &__tr--has-accordion-content:not(&__tr--disabled) {
+  &__tr--clickable:not(&__tr--disabled) {
     cursor: pointer;
   }
 
   // prevent selection while animating – useful when user double-clicks
   // TODO: Our SASS version does not support :has – so we may use this in future
-  // &__tr--has-accordion-content:has(& + &__tr__accordion-content--animating) {
+  // &__tr--clickable:has(& + &__tr__accordion-content--animating) {
   //   user-select: none;
   // }
 

package/es/components/table/style/table-td.scss

@@ -73,7 +73,7 @@
   //last row must be rounded
   &--outline tbody:last-child {
     .dnb-table__tr:last-child,
-    .dnb-table__tr--has-accordion-content:not(
+    .dnb-table__tr--clickable:not(
         .dnb-table__tr--expanded
       ).dnb-table__tr--last {
       clip-path: inset(

package/es/components/table/table-accordion/TableAccordionHead.d.ts

@@ -5,4 +5,3 @@ export type TableAccordionHeadProps = {
     count: number;
 } & TableTrProps & React.TableHTMLAttributes<HTMLTableRowElement>;
 export declare function TableAccordionHead(allProps: TableAccordionHeadProps): import("react/jsx-runtime").JSX.Element;
-export declare function TableAccordionToggleButton(): import("react/jsx-runtime").JSX.Element;

package/es/components/table/table-accordion/TableAccordionHead.js

@@ -3,24 +3,18 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _Td;
-const _excluded = ["children", "className", "expanded", "disabled", "noAnimation", "onClick", "onOpened", "onClosed", "count"];
+const _excluded = ["children", "expanded", "noAnimation", "onClick", "onOpened", "onClosed", "count"];
 import React, { useEffect } from 'react';
-import classnames from 'classnames';
-import keycode from 'keycode';
-import { hasSelectedText } from '../../../shared/helpers';
-import Button from '../../button/Button';
-import IconPrimary from '../../icon/IconPrimary';
-import Th from '../TableTh';
 import Td from '../TableTd';
 import { TableContext } from '../TableContext';
+import { TableClickableButtonTd, TableClickableHead, TableIconSrTh, isTableHead, onClickTr } from '../TableClickableHead';
 import { TableAccordionContext } from './TableAccordionContext';
 import { TableAccordionContentSingle, TableAccordionContentRow } from './TableAccordionContent';
 export function TableAccordionHead(allProps) {
+  var _React$useContext;
   const {
       children,
-      className,
       expanded,
-      disabled,
       noAnimation,
       onClick,
       onOpened,
@@ -43,11 +37,11 @@ export function TableAccordionHead(allProps) {
   const [trIsHover, setHover] = React.useState(false);
   const [trHadClick, setHadClick] = React.useState(false);
   let headerContent = React.Children.toArray(children);
-  const addExpandIcon = icon => {
+  const addContent = content => {
     if (tableContext.allProps.accordionChevronPlacement === 'end') {
-      headerContent.push(icon);
+      headerContent.push(content);
     } else {
-      headerContent.unshift(icon);
+      headerContent.unshift(content);
     }
   };
   const accordionContent = headerContent.filter(element => {
@@ -62,30 +56,31 @@ export function TableAccordionHead(allProps) {
       };
     }
   }, [count, tableContext === null || tableContext === void 0 ? void 0 : tableContext.collapseTrCallbacks, hasAccordionContent]);
-  const trParams = !disabled && hasAccordionContent ? {
-    onClick: toggleOpenTr,
-    onMouseEnter: onMouseEnterHandler,
-    onMouseLeave: onMouseLeaveHandler,
-    onKeyDown: onKeydownHandler
-  } : {};
+  const tableContextAllProps = (_React$useContext = React.useContext(TableContext)) === null || _React$useContext === void 0 ? void 0 : _React$useContext.allProps;
   if (hasAccordionContent) {
     headerContent = headerContent.filter(element => {
       return !isAccordionElement(element);
     });
-    addExpandIcon(_Td || (_Td = React.createElement(Td, {
-      className: "dnb-table__td__accordion-icon",
+    addContent(React.createElement(TableClickableButtonTd, {
+      trIsOpen: trIsOpen,
+      ariaLabel: tableContextAllProps === null || tableContextAllProps === void 0 ? void 0 : tableContextAllProps.accordionToggleButtonSR,
+      icon: "chevron_down",
+      onClick: toggleOpenTr,
       key: "td-icon"
-    }, React.createElement(TableAccordionToggleButton, null))));
+    }));
   } else if (isTableHead(headerContent)) {
     var _tableContext$allProp;
-    addExpandIcon(React.createElement(Th, {
-      "aria-hidden": true,
-      className: "dnb-table__th__accordion-icon",
-      key: "th-icon"
-    }, React.createElement("div", null, tableContext === null || tableContext === void 0 ? void 0 : (_tableContext$allProp = tableContext.allProps) === null || _tableContext$allProp === void 0 ? void 0 : _tableContext$allProp.accordionToggleButtonSR)));
+    addContent(React.createElement(TableIconSrTh, {
+      key: "th-icon",
+      text: tableContext === null || tableContext === void 0 ? void 0 : (_tableContext$allProp = tableContext.allProps) === null || _tableContext$allProp === void 0 ? void 0 : _tableContext$allProp.accordionToggleButtonSR
+    }));
+  } else if (!hasAccordionContent) {
+    addContent(_Td || (_Td = React.createElement(Td, {
+      key: "empty-td"
+    })));
   }
   const countTds = hasAccordionContent ? headerContent.filter(element => {
-    return element.type === Td;
+    return element.type === Td || element.type === TableClickableButtonTd;
   }).length : null;
   return React.createElement(TableAccordionContext.Provider, {
     value: {
@@ -96,58 +91,36 @@ export function TableAccordionHead(allProps) {
       onOpened,
       onClosed
     }
-  }, React.createElement("tr", _extends({
-    tabIndex: accordionContent && !disabled ? 0 : undefined,
-    className: classnames(className, hasAccordionContent && 'dnb-table__tr--has-accordion-content', trIsOpen && 'dnb-table__tr--expanded', disabled && 'dnb-table__tr--disabled', noAnimation && 'dnb-table__tr--no-animation', trIsHover && trHadClick && 'dnb-table__tr--hover')
-  }, trParams, props), headerContent), accordionContent);
-  function onKeydownHandler(event) {
-    switch (keycode(event.nativeEvent)) {
-      case 'space':
-      case 'enter':
-        {
-          const target = event.target;
-          if (document.activeElement !== target || target.tagName === 'TR') {
-            setOpen(!trIsOpen);
-            event.preventDefault();
-          }
-        }
-        break;
-    }
-  }
+  }, React.createElement(TableClickableHead, _extends({
+    trIsOpen: trIsOpen,
+    trIsHover: trIsHover,
+    trHadClick: trHadClick,
+    clickable: hasAccordionContent,
+    noAnimation: noAnimation,
+    onClick: toggleOpenTr,
+    onMouseEnter: onMouseEnterHandler,
+    onMouseLeave: onMouseLeaveHandler,
+    onKeyDown: onKeyDownHandler,
+    ariaLabel: tableContextAllProps === null || tableContextAllProps === void 0 ? void 0 : tableContextAllProps.accordionToggleButtonSR
+  }, props), headerContent), accordionContent);
   function onMouseEnterHandler() {
     setHover(true);
   }
+  function onKeyDownHandler(event) {
+    toggleOpenTr(event, true);
+  }
   function onMouseLeaveHandler() {
     setHover(false);
     setHadClick(false);
   }
-  function toggleOpenTr(event, allowInteractiveElement = false) {
-    const target = event.target;
-    if ((document.activeElement !== target && target.tagName !== 'INPUT' && target.tagName !== 'LABEL' || allowInteractiveElement) && !hasSelectedText()) {
-      setOpen(!trIsOpen);
-      setHadClick(true);
-      onClick === null || onClick === void 0 ? void 0 : onClick(event);
-    }
+  function toggleOpenFn(event) {
+    setOpen(!trIsOpen);
+    setHadClick(true);
+    onClick === null || onClick === void 0 ? void 0 : onClick(event);
+  }
+  function toggleOpenTr(event, allowInteractiveElement) {
+    onClickTr(event, allowInteractiveElement, toggleOpenFn);
   }
-}
-export function TableAccordionToggleButton() {
-  var _React$useContext;
-  const tableAccordionContext = React.useContext(TableAccordionContext);
-  const tableContextAllProps = (_React$useContext = React.useContext(TableContext)) === null || _React$useContext === void 0 ? void 0 : _React$useContext.allProps;
-  const iconSize = (tableContextAllProps === null || tableContextAllProps === void 0 ? void 0 : tableContextAllProps.size) === 'medium' || (tableContextAllProps === null || tableContextAllProps === void 0 ? void 0 : tableContextAllProps.size) === 'small' ? 'basis' : 'medium';
-  return React.createElement("span", {
-    className: "dnb-table__toggle-button"
-  }, React.createElement(IconPrimary, {
-    icon: "chevron_down",
-    size: iconSize
-  }), React.createElement(Button, {
-    className: "dnb-sr-only",
-    tabIndex: -1,
-    "aria-label": tableContextAllProps === null || tableContextAllProps === void 0 ? void 0 : tableContextAllProps.accordionToggleButtonSR,
-    "aria-expanded": Boolean(tableAccordionContext === null || tableAccordionContext === void 0 ? void 0 : tableAccordionContext.trIsOpen),
-    on_click: event => tableAccordionContext === null || tableAccordionContext === void 0 ? void 0 : tableAccordionContext.toggleOpenTr(event, true)
-  }));
 }
 const isAccordionElement = element => element.type === TableAccordionContentSingle || element.type === TableAccordionContentRow;
-const isTableHead = children => children.some(element => element.type === Th);
 //# sourceMappingURL=TableAccordionHead.js.map

package/es/components/table/table-accordion/TableAccordionHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableAccordionHead.js","names":["React","useEffect","classnames","keycode","hasSelectedText","Button","IconPrimary","Th","Td","TableContext","TableAccordionContext","TableAccordionContentSingle","TableAccordionContentRow","TableAccordionHead","allProps","children","className","expanded","disabled","noAnimation","onClick","onOpened","onClosed","count","props","_objectWithoutProperties","_excluded","tableContext","useContext","trIsOpen","setOpen","useState","location","id","hash","trIsHover","setHover","trHadClick","setHadClick","headerContent","Children","toArray","addExpandIcon","icon","accordionChevronPlacement","push","unshift","accordionContent","filter","element","isAccordionElement","hasAccordionContent","length","every","isValidElement","_tableContext$collaps","collapseTrCallbacks","current","trParams","toggleOpenTr","onMouseEnter","onMouseEnterHandler","onMouseLeave","onMouseLeaveHandler","onKeyDown","onKeydownHandler","_Td","createElement","key","TableAccordionToggleButton","isTableHead","_tableContext$allProp","accordionToggleButtonSR","countTds","type","Provider","value","_extends","tabIndex","undefined","event","nativeEvent","target","document","activeElement","tagName","preventDefault","allowInteractiveElement","_React$useContext","tableAccordionContext","tableContextAllProps","iconSize","size","Boolean","on_click","some"],"sources":["../../../../../src/components/table/table-accordion/TableAccordionHead.tsx"],"sourcesContent":["import React, { useEffect } from 'react'\nimport classnames from 'classnames'\nimport keycode from 'keycode'\nimport { hasSelectedText } from '../../../shared/helpers'\nimport Button from '../../button/Button'\nimport IconPrimary from '../../icon/IconPrimary'\nimport Th from '../TableTh'\nimport Td from '../TableTd'\nimport { TableContext } from '../TableContext'\nimport { TableAccordionContext } from './TableAccordionContext'\nimport {\n  TableAccordionContentSingle,\n  TableAccordionContentRow,\n} from './TableAccordionContent'\n\nimport type {\n  TableAccordionContentSingleProps,\n  TableAccordionContentRowProps,\n} from './TableAccordionContent'\nimport type { TableTrProps } from '../TableTr'\n\nexport type TableAccordionHeadProps = {\n  /** The row number */\n  count: number\n} & TableTrProps &\n  React.TableHTMLAttributes<HTMLTableRowElement>\n\nexport function TableAccordionHead(allProps: TableAccordionHeadProps) {\n  const {\n    children,\n    className,\n    expanded,\n    disabled,\n    noAnimation,\n    onClick,\n    onOpened,\n    onClosed,\n    count,\n    ...props\n  } = allProps\n  const tableContext = React.useContext(TableContext)\n\n  const [trIsOpen, setOpen] = React.useState(() => {\n    if (typeof expanded === 'boolean') {\n      return expanded\n    } else if (typeof location !== 'undefined') {\n      const id = props?.id\n      if (id && '#' + id === location.hash) {\n        return true\n      }\n    }\n\n    return false\n  })\n  const [trIsHover, setHover] = React.useState(false)\n  const [trHadClick, setHadClick] = React.useState(false)\n\n  let headerContent = React.Children.toArray(children)\n\n  const addExpandIcon = (icon) => {\n    if (tableContext.allProps.accordionChevronPlacement === 'end') {\n      headerContent.push(icon)\n    } else {\n      headerContent.unshift(icon)\n    }\n  }\n  /**\n   * Handle Accordion Content\n   */\n  const accordionContent = headerContent.filter(\n    (element: React.ReactElement) => {\n      return isAccordionElement(element)\n    }\n  ) as React.ReactElement<\n    TableAccordionContentSingleProps | TableAccordionContentRowProps\n  >[]\n\n  const hasAccordionContent =\n    accordionContent.length !== 0 &&\n    accordionContent.every((element) => React.isValidElement(element))\n\n  useEffect(() => {\n    if (\n      hasAccordionContent &&\n      tableContext?.collapseTrCallbacks?.current &&\n      count\n    ) {\n      tableContext.collapseTrCallbacks.current[count] = () => {\n        setOpen(false)\n      }\n    }\n  }, [count, tableContext?.collapseTrCallbacks, hasAccordionContent])\n\n  const trParams =\n    !disabled && hasAccordionContent\n      ? {\n          onClick: toggleOpenTr,\n          onMouseEnter: onMouseEnterHandler,\n          onMouseLeave: onMouseLeaveHandler,\n          onKeyDown: onKeydownHandler,\n        }\n      : {}\n\n  if (hasAccordionContent) {\n    // Remove the AccordionContent, and use it outside of the tr\n    headerContent = headerContent.filter((element: React.ReactElement) => {\n      return !isAccordionElement(element)\n    })\n\n    addExpandIcon(\n      <Td className=\"dnb-table__td__accordion-icon\" key=\"td-icon\">\n        <TableAccordionToggleButton />\n      </Td>\n    )\n  } else if (isTableHead(headerContent)) {\n    addExpandIcon(\n      <Th\n        aria-hidden\n        className=\"dnb-table__th__accordion-icon\"\n        key=\"th-icon\"\n      >\n        <div>{tableContext?.allProps?.accordionToggleButtonSR}</div>\n      </Th>\n    )\n  }\n\n  const countTds = hasAccordionContent\n    ? headerContent.filter((element: React.ReactElement) => {\n        return element.type === Td // TODO: We may need to include this in future --> || component.type === Td.MainCell\n      }).length\n    : null\n\n  return (\n    <TableAccordionContext.Provider\n      value={{\n        toggleOpenTr,\n        trIsOpen,\n        noAnimation,\n        countTds,\n        onOpened,\n        onClosed,\n      }}\n    >\n      <tr\n        tabIndex={accordionContent && !disabled ? 0 : undefined}\n        className={classnames(\n          className,\n          hasAccordionContent && 'dnb-table__tr--has-accordion-content',\n          trIsOpen && 'dnb-table__tr--expanded',\n          disabled && 'dnb-table__tr--disabled',\n          noAnimation && 'dnb-table__tr--no-animation',\n          trIsHover && trHadClick && 'dnb-table__tr--hover'\n        )}\n        {...trParams}\n        {...props}\n      >\n        {headerContent}\n      </tr>\n      {accordionContent}\n    </TableAccordionContext.Provider>\n  )\n\n  function onKeydownHandler(event: React.SyntheticEvent) {\n    switch (keycode(event.nativeEvent)) {\n      case 'space':\n      case 'enter':\n        {\n          const target = event.target as HTMLElement\n          if (\n            document.activeElement !== target ||\n            target.tagName === 'TR'\n          ) {\n            setOpen(!trIsOpen)\n            event.preventDefault()\n          }\n        }\n        break\n    }\n  }\n  function onMouseEnterHandler() {\n    setHover(true)\n  }\n  function onMouseLeaveHandler() {\n    setHover(false)\n    setHadClick(false)\n  }\n  function toggleOpenTr(\n    event: React.SyntheticEvent,\n    allowInteractiveElement = false\n  ) {\n    const target = event.target as HTMLElement\n    if (\n      /**\n       * Do not toggle if user clicked an interactive element (input, button, etc.).\n       * Interactive to set activeElement on mouseDown, we we can check against it.\n       */\n      ((document.activeElement !== target &&\n        /**\n         * Safari on macOS needs this extra check:\n         *\n         * > For example, on macOS systems, elements that aren't text input elements are not typically focusable by default.\n         * https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement\n         */\n        target.tagName !== 'INPUT' &&\n        target.tagName !== 'LABEL') ||\n        allowInteractiveElement) &&\n      /**\n       * Let the user select text,\n       * without triggering the accordion.\n       */\n      !hasSelectedText()\n    ) {\n      setOpen(!trIsOpen)\n      setHadClick(true)\n\n      onClick?.(event)\n    }\n  }\n}\n\nexport function TableAccordionToggleButton() {\n  const tableAccordionContext = React.useContext(TableAccordionContext)\n  const tableContextAllProps = React.useContext(TableContext)?.allProps\n  const iconSize =\n    tableContextAllProps?.size === 'medium' ||\n    tableContextAllProps?.size === 'small'\n      ? 'basis'\n      : 'medium'\n\n  return (\n    <span className=\"dnb-table__toggle-button\">\n      <IconPrimary icon=\"chevron_down\" size={iconSize} />\n      <Button\n        className=\"dnb-sr-only\"\n        tabIndex={-1}\n        aria-label={tableContextAllProps?.accordionToggleButtonSR}\n        aria-expanded={Boolean(tableAccordionContext?.trIsOpen)}\n        on_click={(event) =>\n          tableAccordionContext?.toggleOpenTr(event, true)\n        }\n      />\n    </span>\n  )\n}\n\nconst isAccordionElement = (element: React.ReactElement) =>\n  element.type === TableAccordionContentSingle ||\n  element.type === TableAccordionContentRow\n\nconst isTableHead = (children: React.ReactNode[]) =>\n  children.some((element: React.ReactElement) => element.type === Th)\n"],"mappings":"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"}
+{"version":3,"file":"TableAccordionHead.js","names":["React","useEffect","Td","TableContext","TableClickableButtonTd","TableClickableHead","TableIconSrTh","isTableHead","onClickTr","TableAccordionContext","TableAccordionContentSingle","TableAccordionContentRow","TableAccordionHead","allProps","_React$useContext","children","expanded","noAnimation","onClick","onOpened","onClosed","count","props","_objectWithoutProperties","_excluded","tableContext","useContext","trIsOpen","setOpen","useState","location","id","hash","trIsHover","setHover","trHadClick","setHadClick","headerContent","Children","toArray","addContent","content","accordionChevronPlacement","push","unshift","accordionContent","filter","element","isAccordionElement","hasAccordionContent","length","every","isValidElement","_tableContext$collaps","collapseTrCallbacks","current","tableContextAllProps","createElement","ariaLabel","accordionToggleButtonSR","icon","toggleOpenTr","key","_tableContext$allProp","text","_Td","countTds","type","Provider","value","_extends","clickable","onMouseEnter","onMouseEnterHandler","onMouseLeave","onMouseLeaveHandler","onKeyDown","onKeyDownHandler","event","toggleOpenFn","allowInteractiveElement"],"sources":["../../../../../src/components/table/table-accordion/TableAccordionHead.tsx"],"sourcesContent":["import React, { useEffect } from 'react'\nimport Td from '../TableTd'\nimport { TableContext } from '../TableContext'\nimport {\n  TableClickableButtonTd,\n  TableClickableHead,\n  TableIconSrTh,\n  isTableHead,\n  onClickTr,\n} from '../TableClickableHead'\nimport { TableAccordionContext } from './TableAccordionContext'\nimport {\n  TableAccordionContentSingle,\n  TableAccordionContentRow,\n} from './TableAccordionContent'\n\nimport type {\n  TableAccordionContentSingleProps,\n  TableAccordionContentRowProps,\n} from './TableAccordionContent'\nimport type { TableTrProps } from '../TableTr'\n\nexport type TableAccordionHeadProps = {\n  /** The row number */\n  count: number\n} & TableTrProps &\n  React.TableHTMLAttributes<HTMLTableRowElement>\n\nexport function TableAccordionHead(allProps: TableAccordionHeadProps) {\n  const {\n    children,\n    expanded,\n    noAnimation,\n    onClick,\n    onOpened,\n    onClosed,\n    count,\n    ...props\n  } = allProps\n  const tableContext = React.useContext(TableContext)\n\n  const [trIsOpen, setOpen] = React.useState(() => {\n    if (typeof expanded === 'boolean') {\n      return expanded\n    } else if (typeof location !== 'undefined') {\n      const id = props?.id\n      if (id && '#' + id === location.hash) {\n        return true\n      }\n    }\n\n    return false\n  })\n  const [trIsHover, setHover] = React.useState(false)\n  const [trHadClick, setHadClick] = React.useState(false)\n\n  let headerContent = React.Children.toArray(children)\n\n  const addContent = (content) => {\n    if (tableContext.allProps.accordionChevronPlacement === 'end') {\n      headerContent.push(content)\n    } else {\n      headerContent.unshift(content)\n    }\n  }\n\n  /**\n   * Handle Accordion Content\n   */\n  const accordionContent = headerContent.filter(\n    (element: React.ReactElement) => {\n      return isAccordionElement(element)\n    }\n  ) as React.ReactElement<\n    TableAccordionContentSingleProps | TableAccordionContentRowProps\n  >[]\n\n  const hasAccordionContent =\n    accordionContent.length !== 0 &&\n    accordionContent.every((element) => React.isValidElement(element))\n\n  useEffect(() => {\n    if (\n      hasAccordionContent &&\n      tableContext?.collapseTrCallbacks?.current &&\n      count\n    ) {\n      tableContext.collapseTrCallbacks.current[count] = () => {\n        setOpen(false)\n      }\n    }\n  }, [count, tableContext?.collapseTrCallbacks, hasAccordionContent])\n\n  const tableContextAllProps = React.useContext(TableContext)?.allProps\n\n  if (hasAccordionContent) {\n    // Remove the AccordionContent, and use it outside of the tr\n    headerContent = headerContent.filter((element: React.ReactElement) => {\n      return !isAccordionElement(element)\n    })\n\n    addContent(\n      <TableClickableButtonTd\n        trIsOpen={trIsOpen}\n        ariaLabel={tableContextAllProps?.accordionToggleButtonSR}\n        icon=\"chevron_down\"\n        onClick={toggleOpenTr}\n        key=\"td-icon\"\n      />\n    )\n  } else if (isTableHead(headerContent)) {\n    addContent(\n      <TableIconSrTh\n        key=\"th-icon\"\n        text={tableContext?.allProps?.accordionToggleButtonSR}\n      />\n    )\n  } else if (!hasAccordionContent) {\n    addContent(<Td key=\"empty-td\"></Td>)\n  }\n\n  const countTds = hasAccordionContent\n    ? headerContent.filter((element: React.ReactElement) => {\n        return (\n          element.type === Td || element.type === TableClickableButtonTd\n        ) // TODO: We may need to include this in future --> || component.type === Td.MainCell\n      }).length\n    : null\n\n  return (\n    <TableAccordionContext.Provider\n      value={{\n        toggleOpenTr,\n        trIsOpen,\n        noAnimation,\n        countTds,\n        onOpened,\n        onClosed,\n      }}\n    >\n      <TableClickableHead\n        trIsOpen={trIsOpen}\n        trIsHover={trIsHover}\n        trHadClick={trHadClick}\n        clickable={hasAccordionContent}\n        noAnimation={noAnimation}\n        onClick={toggleOpenTr}\n        onMouseEnter={onMouseEnterHandler}\n        onMouseLeave={onMouseLeaveHandler}\n        onKeyDown={onKeyDownHandler}\n        ariaLabel={tableContextAllProps?.accordionToggleButtonSR}\n        {...props}\n      >\n        {headerContent}\n      </TableClickableHead>\n      {accordionContent}\n    </TableAccordionContext.Provider>\n  )\n\n  function onMouseEnterHandler() {\n    setHover(true)\n  }\n\n  function onKeyDownHandler(event: React.SyntheticEvent) {\n    toggleOpenTr(event, true)\n  }\n\n  function onMouseLeaveHandler() {\n    setHover(false)\n    setHadClick(false)\n  }\n\n  function toggleOpenFn(event: React.SyntheticEvent) {\n    setOpen(!trIsOpen)\n    setHadClick(true)\n    onClick?.(event)\n  }\n\n  function toggleOpenTr(\n    event: React.SyntheticEvent,\n    allowInteractiveElement?: boolean\n  ) {\n    onClickTr(event, allowInteractiveElement, toggleOpenFn)\n  }\n}\n\nconst isAccordionElement = (element: React.ReactElement) =>\n  element.type === TableAccordionContentSingle ||\n  element.type === TableAccordionContentRow\n"],"mappings":"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"}