@zywave/zui-table 4.4.0-pre.2 → 4.4.0-pre.3

package/dist/css/zui-table.fouc.css

@@ -1 +1 @@
-zui-table:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:block;width:100%;border-collapse:collapse;border-spacing:0}@media(min-width: 45em){zui-table:not(:defined){box-shadow:0 1px 3px rgba(0,0,0,.29)}}zui-table:not(:defined) [slot=no-results-message]{display:none}zui-table:not(:defined) *,zui-table:not(:defined) *::before,zui-table:not(:defined) *::after{box-sizing:inherit}zui-table[banded]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%}zui-table[banded]:not(:defined) zui-table-row:not([header]):nth-child(even){background-color:var(--zui-gray-25)}zui-table[banded]:not(:defined) zui-table-row:not([header]){border:0}zui-table[banded]:not(:defined) *,zui-table[banded]:not(:defined) *::before,zui-table[banded]:not(:defined) *::after{box-sizing:inherit}zui-table[no-results]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%}zui-table[no-results]:not(:defined) [slot=no-results-message]{display:block;padding:.75rem 1.25rem;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){zui-table[no-results]:not(:defined) [slot=no-results-message]{box-shadow:none}}zui-table[no-results]:not(:defined) *,zui-table[no-results]:not(:defined) *::before,zui-table[no-results]:not(:defined) *::after{box-sizing:inherit}zui-table[loading]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%}zui-table[loading]:not(:defined) zui-table-row:not([header]){visibility:hidden}zui-table[loading]:not(:defined) zui-spinner{position:absolute;top:50%;left:50%}zui-table[loading]:not(:defined) *,zui-table[loading]:not(:defined) *::before,zui-table[loading]:not(:defined) *::after{box-sizing:inherit}zui-table-topbar:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:flex;width:100%;min-height:3.75rem;flex-wrap:wrap;align-items:center}@media(min-width: 45em){zui-table-topbar:not(:defined){flex-wrap:nowrap;padding:.625rem 1.25rem;background-color:var(--zui-gray-25)}}zui-table-topbar:not(:defined) *:not([slot=action]):not([slot=counter]){margin-bottom:1.25rem}@media(min-width: 45em){zui-table-topbar:not(:defined) *:not([slot=action]):not([slot=counter]){margin-bottom:0}}zui-table-topbar:not(:defined) zui-search{--zui-search-border-color: var(--zui-gray-50);flex:1;flex-basis:100%;order:1}@media(min-width: 30em){zui-table-topbar:not(:defined) zui-search{flex-basis:auto;order:0}}@media(min-width: 45em){zui-table-topbar:not(:defined) zui-search{flex:0;margin-right:auto}}zui-table-topbar:not(:defined) [slot=counter]{display:flex;width:100%;flex-shrink:0;justify-content:flex-end;order:2;margin-bottom:.625rem;padding-left:.625rem;font-size:.75rem;color:var(--zui-gray-400)}@media(min-width: 45em){zui-table-topbar:not(:defined) [slot=counter]{width:auto;order:0;margin-bottom:0}}zui-table-topbar:not(:defined) [slot=action]{width:100%;margin-bottom:1.25rem}@media(min-width: 30em){zui-table-topbar:not(:defined) [slot=action]{width:auto;margin-left:.625rem}}@media(min-width: 45em){zui-table-topbar:not(:defined) [slot=action]{margin-bottom:0}}zui-table-topbar:not(:defined) [slot=action]:first-of-type{margin-bottom:0}@media(min-width: 30em){zui-table-topbar:not(:defined) [slot=action]:first-of-type{margin-bottom:1.25rem;margin-left:1.25rem}}@media(min-width: 45em){zui-table-topbar:not(:defined) [slot=action]:first-of-type{margin-bottom:0;margin-left:.625rem}}zui-table-topbar:not(:defined) [slot=action]:last-of-type{margin-bottom:1.25rem}@media(min-width: 45em){zui-table-topbar:not(:defined) [slot=action]:last-of-type{margin-bottom:0}}@media(max-width: 30em){zui-table-topbar:not(:defined) [slot=action]+[slot=action]{margin-top:.625rem}}zui-table-topbar:not(:defined) *,zui-table-topbar:not(:defined) *::before,zui-table-topbar:not(:defined) *::after{box-sizing:inherit}zui-table-row:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:grid;grid-template-columns:auto;padding:.625rem 0;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){zui-table-row:not(:defined){display:flex;padding:0;box-shadow:none}}zui-table-row:not(:defined) *,zui-table-row:not(:defined) *::before,zui-table-row:not(:defined) *::after{box-sizing:inherit}zui-table-row[header]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:none;background-color:#fff;border-bottom:1px solid var(--zui-gray-200)}@media(min-width: 45em){zui-table-row[header]:not(:defined){display:flex}}zui-table-row[header]:not(:defined) zui-table-cell{--zui-table-cell-padding: 0.53125rem 1.25rem;font-weight:600}zui-table-row[header]:not(:defined) *,zui-table-row[header]:not(:defined) *::before,zui-table-row[header]:not(:defined) *::after{box-sizing:inherit}zui-table-row:not([header]):not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;border-bottom:2px solid var(--zui-gray-100)}@media(min-width: 45em){zui-table-row:not([header]):not(:defined){border-bottom-width:1px}}zui-table-row:not([header]):not(:defined) *,zui-table-row:not([header]):not(:defined) *::before,zui-table-row:not([header]):not(:defined) *::after{box-sizing:inherit}zui-table-row:not([header]):last-of-type:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;border-bottom:0}zui-table-row:not([header]):last-of-type:not(:defined) *,zui-table-row:not([header]):last-of-type:not(:defined) *::before,zui-table-row:not([header]):last-of-type:not(:defined) *::after{box-sizing:inherit}zui-table-row[summary]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;background-color:var(--zui-table-summary-background-color, var(--zui-gray-600)) !important}zui-table-row[summary]:not(:defined) zui-table-cell{font-weight:600;color:var(--zui-table-summary-text-color, #fff)}zui-table-row[summary]:not(:defined) *,zui-table-row[summary]:not(:defined) *::before,zui-table-row[summary]:not(:defined) *::after{box-sizing:inherit}zui-table-cell:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;flex-grow:1;flex-basis:0;padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem)}@media(min-width: 45em){zui-table-cell:not(:defined){padding:var(--zui-table-cell-padding, 0.8125rem 1.25rem)}}zui-table-cell:not(:defined) *,zui-table-cell:not(:defined) *::before,zui-table-cell:not(:defined) *::after{box-sizing:inherit}zui-table-cell[action]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:flex;align-items:center}@media(min-width: 45em){zui-table-cell[action]:not(:defined){--zui-table-cell-padding: 0.375rem 1.25rem}}zui-table-cell[action]:not(:defined) zui-button:not(:first-of-type){margin-left:.625rem}zui-table-cell[action]:not(:defined) *,zui-table-cell[action]:not(:defined) *::before,zui-table-cell[action]:not(:defined) *::after{box-sizing:inherit}zui-table-footer:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:flex;justify-content:center;align-items:center;margin-top:var(--zui-table-footer-margin, 0.625rem)}zui-table-footer:not(:defined) zui-pager{width:100%}zui-table-footer:not(:defined) *,zui-table-footer:not(:defined) *::before,zui-table-footer:not(:defined) *::after{box-sizing:inherit}
+zui-table:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:block;width:100%;border-collapse:collapse;border-spacing:0}@media(min-width: 45em){zui-table:not(:defined){box-shadow:0 1px 3px rgba(0,0,0,.29)}}zui-table:not(:defined) [slot=no-results-message]{display:none}zui-table:not(:defined) *,zui-table:not(:defined) *::before,zui-table:not(:defined) *::after{box-sizing:inherit}zui-table[banded]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%}zui-table[banded]:not(:defined) zui-table-row:not([header]):nth-child(even){background-color:var(--zui-gray-25)}zui-table[banded]:not(:defined) zui-table-row:not([header]){border:0}zui-table[banded]:not(:defined) *,zui-table[banded]:not(:defined) *::before,zui-table[banded]:not(:defined) *::after{box-sizing:inherit}zui-table[mode=fixed-sizing]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%}@media(width > 45em){zui-table[mode=fixed-sizing]:not(:defined){position:relative;max-width:var(--zui-table-max-width, none);max-height:calc(var(--zui-table-max-height, none) + 6.375rem);overflow:hidden}zui-table[mode=fixed-sizing]:not(:defined):has(>zui-table-row[summary],>:not(zui-table-footer)){max-height:calc(var(--zui-table-max-height, none) + 10.125rem)}zui-table[mode=fixed-sizing]:not(:defined):has(>zui-table-row[summary]+zui-table-footer){max-height:calc(var(--zui-table-max-height, none) + 14.5rem)}zui-table[mode=fixed-sizing]:not(:defined) zui-table-topbar{position:sticky;top:0;left:0;z-index:1}zui-table[mode=fixed-sizing]:not(:defined) zui-table-row[header]{position:sticky;top:3.875rem;z-index:1}zui-table[mode=fixed-sizing]:not(:defined) zui-table-row[summary]{position:sticky;bottom:0;left:0}zui-table[mode=fixed-sizing]:not(:defined) zui-table-row[summary]:has(+zui-table-footer){bottom:4.375rem}zui-table[mode=fixed-sizing]:not(:defined) zui-table-footer{position:sticky;bottom:0;left:0}}zui-table[mode=fixed-sizing]:not(:defined) *,zui-table[mode=fixed-sizing]:not(:defined) *::before,zui-table[mode=fixed-sizing]:not(:defined) *::after{box-sizing:inherit}zui-table[no-results]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%}zui-table[no-results]:not(:defined) [slot=no-results-message]{display:block;padding:.75rem 1.25rem;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){zui-table[no-results]:not(:defined) [slot=no-results-message]{box-shadow:none}}zui-table[no-results]:not(:defined) *,zui-table[no-results]:not(:defined) *::before,zui-table[no-results]:not(:defined) *::after{box-sizing:inherit}zui-table[loading]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%}zui-table[loading]:not(:defined) zui-table-row:not([header]){visibility:hidden}zui-table[loading]:not(:defined) zui-spinner{position:absolute;top:50%;left:50%}zui-table[loading]:not(:defined) *,zui-table[loading]:not(:defined) *::before,zui-table[loading]:not(:defined) *::after{box-sizing:inherit}zui-table-topbar:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:flex;width:100%;min-height:3.75rem;flex-wrap:wrap;align-items:center}@media(min-width: 45em){zui-table-topbar:not(:defined){flex-wrap:nowrap;padding:.625rem 1.25rem;background-color:var(--zui-gray-25)}}zui-table-topbar:not(:defined) *:not([slot=action]):not([slot=counter]){margin-bottom:1.25rem}@media(min-width: 45em){zui-table-topbar:not(:defined) *:not([slot=action]):not([slot=counter]){margin-bottom:0}}zui-table-topbar:not(:defined) zui-search{--zui-search-border-color: var(--zui-gray-50);flex:1;flex-basis:100%;order:1}@media(min-width: 30em){zui-table-topbar:not(:defined) zui-search{flex-basis:auto;order:0}}@media(min-width: 45em){zui-table-topbar:not(:defined) zui-search{flex:0;margin-right:auto}}zui-table-topbar:not(:defined) [slot=counter]{display:flex;width:100%;flex-shrink:0;justify-content:flex-end;order:2;margin-bottom:.625rem;padding-left:.625rem;font-size:.75rem;color:var(--zui-gray-400)}@media(min-width: 45em){zui-table-topbar:not(:defined) [slot=counter]{width:auto;order:0;margin-bottom:0}}zui-table-topbar:not(:defined) [slot=action]{width:100%;margin-bottom:1.25rem}@media(min-width: 30em){zui-table-topbar:not(:defined) [slot=action]{width:auto;margin-left:.625rem}}@media(min-width: 45em){zui-table-topbar:not(:defined) [slot=action]{margin-bottom:0}}zui-table-topbar:not(:defined) [slot=action]:first-of-type{margin-bottom:0}@media(min-width: 30em){zui-table-topbar:not(:defined) [slot=action]:first-of-type{margin-bottom:1.25rem;margin-left:1.25rem}}@media(min-width: 45em){zui-table-topbar:not(:defined) [slot=action]:first-of-type{margin-bottom:0;margin-left:.625rem}}zui-table-topbar:not(:defined) [slot=action]:last-of-type{margin-bottom:1.25rem}@media(min-width: 45em){zui-table-topbar:not(:defined) [slot=action]:last-of-type{margin-bottom:0}}@media(max-width: 30em){zui-table-topbar:not(:defined) [slot=action]+[slot=action]{margin-top:.625rem}}zui-table-topbar:not(:defined) *,zui-table-topbar:not(:defined) *::before,zui-table-topbar:not(:defined) *::after{box-sizing:inherit}zui-table-row:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:grid;grid-template-columns:var(--zui-table-columns-template, repeat(auto-fit, minmax(0, 1fr)));padding:.625rem 0;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){zui-table-row:not(:defined){padding:0;box-shadow:none}}zui-table-row:not(:defined) *,zui-table-row:not(:defined) *::before,zui-table-row:not(:defined) *::after{box-sizing:inherit}zui-table-row[header]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:none;background-color:#fff;border-bottom:1px solid var(--zui-gray-200)}@media(min-width: 45em){zui-table-row[header]:not(:defined){display:grid}}zui-table-row[header]:not(:defined) zui-table-cell{--zui-table-cell-padding: 0.53125rem 1.25rem;font-weight:600}zui-table-row[header]:not(:defined) *,zui-table-row[header]:not(:defined) *::before,zui-table-row[header]:not(:defined) *::after{box-sizing:inherit}zui-table-row:not([header]):not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;border-bottom:2px solid var(--zui-gray-100)}@media(min-width: 45em){zui-table-row:not([header]):not(:defined){border-bottom-width:1px}}zui-table-row:not([header]):not(:defined) *,zui-table-row:not([header]):not(:defined) *::before,zui-table-row:not([header]):not(:defined) *::after{box-sizing:inherit}zui-table-row:not([header]):last-of-type:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;border-bottom:0}zui-table-row:not([header]):last-of-type:not(:defined) *,zui-table-row:not([header]):last-of-type:not(:defined) *::before,zui-table-row:not([header]):last-of-type:not(:defined) *::after{box-sizing:inherit}zui-table-row[summary]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;grid-template-columns:1fr;background-color:var(--zui-table-summary-background-color, var(--zui-gray-600)) !important}zui-table-row[summary]:not(:defined) zui-table-cell{font-weight:600;color:var(--zui-table-summary-text-color, #fff)}zui-table-row[summary]:not(:defined) *,zui-table-row[summary]:not(:defined) *::before,zui-table-row[summary]:not(:defined) *::after{box-sizing:inherit}zui-table-cell:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;flex-grow:1;flex-basis:0;padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem)}@media(min-width: 45em){zui-table-cell:not(:defined){padding:var(--zui-table-cell-padding, 0.8125rem 1.25rem)}}zui-table-cell:not(:defined) *,zui-table-cell:not(:defined) *::before,zui-table-cell:not(:defined) *::after{box-sizing:inherit}zui-table-cell[action]:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:flex;align-items:center}@media(min-width: 45em){zui-table-cell[action]:not(:defined){--zui-table-cell-padding: 0.375rem 1.25rem}}zui-table-cell[action]:not(:defined) zui-button:not(:first-of-type){margin-left:.625rem}zui-table-cell[action]:not(:defined) *,zui-table-cell[action]:not(:defined) *::before,zui-table-cell[action]:not(:defined) *::after{box-sizing:inherit}zui-table-footer:not(:defined){font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";font-size:var(--zui-font-size, 0.875rem);font-weight:400;line-height:var(--zui-line-height, 1.6);box-sizing:border-box;-webkit-text-size-adjust:100%;display:flex;justify-content:center;align-items:center;margin-top:var(--zui-table-footer-margin, 0.625rem)}zui-table-footer:not(:defined) zui-pager{width:100%}zui-table-footer:not(:defined) *,zui-table-footer:not(:defined) *::before,zui-table-footer:not(:defined) *::after{box-sizing:inherit}

package/dist/zui-table-cell-css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const style = css `:host{--zui-table-cell-sort-active-color: var(--zui-blue);--zui-table-cell-sort-color: var(--zui-gray-300);contain:none;overflow-wrap:break-word}:host([action]) div{display:flex}@media(min-width: 45em){:host([action]) div{--zui-table-cell-padding: 0.375rem 1.25rem;align-items:center}}:host([action]) ::slotted(zui-button:not(:first-of-type)){margin-left:.625rem}:host([sort=ascending]) zui-icon{--zui-icon-sort-ascending-color: var(--zui-table-cell-sort-active-color)}:host([sort=descending]) zui-icon{--zui-icon-sort-descending-color: var(--zui-table-cell-sort-active-color)}div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem)}@media(min-width: 45em){div{padding:var(--zui-table-cell-padding, 0.8125rem 1.25rem)}}div.header{float:left;width:33.333%;font-weight:600}div.header+div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem 0.3125rem 0)}zui-icon{--zui-icon-size: 1.125rem;vertical-align:middle;margin-left:.625rem;fill:var(--zui-table-cell-sort-color)}.is-selectable{cursor:pointer}`;
+export const style = css `:host{--zui-table-cell-sort-active-color: var(--zui-blue);--zui-table-cell-sort-color: var(--zui-gray-300);contain:none;overflow-wrap:break-word}:host([sort=ascending]) zui-icon{--zui-icon-sort-ascending-color: var(--zui-table-cell-sort-active-color)}:host([sort=descending]) zui-icon{--zui-icon-sort-descending-color: var(--zui-table-cell-sort-active-color)}:host([action]) div{display:flex}@media(min-width: 45em){:host([action]) div{--zui-table-cell-padding: 0.375rem 1.25rem;align-items:center}}:host([action]) ::slotted(zui-button:not(:first-of-type)){margin-left:.625rem}div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem)}@media(min-width: 45em){div{padding:var(--zui-table-cell-padding, 0.8125rem 1.25rem)}}div.header{float:left;width:33.333%;font-weight:600}div.header+div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem 0.3125rem 0)}zui-icon{--zui-icon-size: 1.125rem;vertical-align:middle;margin-left:.625rem;fill:var(--zui-table-cell-sort-color)}.is-selectable{cursor:pointer}`;
 //# sourceMappingURL=zui-table-cell-css.js.map

package/dist/zui-table-cell-css.js.map

@@ -1 +1 @@
-{"version":3,"file":"zui-table-cell-css.js","sourceRoot":"","sources":["../src/zui-table-cell-css.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,m/BAAm/B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const style = css`:host{--zui-table-cell-sort-active-color: var(--zui-blue);--zui-table-cell-sort-color: var(--zui-gray-300);contain:none;overflow-wrap:break-word}:host([action]) div{display:flex}@media(min-width: 45em){:host([action]) div{--zui-table-cell-padding: 0.375rem 1.25rem;align-items:center}}:host([action]) ::slotted(zui-button:not(:first-of-type)){margin-left:.625rem}:host([sort=ascending]) zui-icon{--zui-icon-sort-ascending-color: var(--zui-table-cell-sort-active-color)}:host([sort=descending]) zui-icon{--zui-icon-sort-descending-color: var(--zui-table-cell-sort-active-color)}div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem)}@media(min-width: 45em){div{padding:var(--zui-table-cell-padding, 0.8125rem 1.25rem)}}div.header{float:left;width:33.333%;font-weight:600}div.header+div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem 0.3125rem 0)}zui-icon{--zui-icon-size: 1.125rem;vertical-align:middle;margin-left:.625rem;fill:var(--zui-table-cell-sort-color)}.is-selectable{cursor:pointer}`;\n"]}
+{"version":3,"file":"zui-table-cell-css.js","sourceRoot":"","sources":["../src/zui-table-cell-css.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,m/BAAm/B,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const style = css`:host{--zui-table-cell-sort-active-color: var(--zui-blue);--zui-table-cell-sort-color: var(--zui-gray-300);contain:none;overflow-wrap:break-word}:host([sort=ascending]) zui-icon{--zui-icon-sort-ascending-color: var(--zui-table-cell-sort-active-color)}:host([sort=descending]) zui-icon{--zui-icon-sort-descending-color: var(--zui-table-cell-sort-active-color)}:host([action]) div{display:flex}@media(min-width: 45em){:host([action]) div{--zui-table-cell-padding: 0.375rem 1.25rem;align-items:center}}:host([action]) ::slotted(zui-button:not(:first-of-type)){margin-left:.625rem}div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem)}@media(min-width: 45em){div{padding:var(--zui-table-cell-padding, 0.8125rem 1.25rem)}}div.header{float:left;width:33.333%;font-weight:600}div.header+div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem 0.3125rem 0)}zui-icon{--zui-icon-size: 1.125rem;vertical-align:middle;margin-left:.625rem;fill:var(--zui-table-cell-sort-color)}.is-selectable{cursor:pointer}`;\n"]}

package/dist/zui-table-css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const style = css `:host{contain:none;display:block}:host .no-results{display:none}:host([banded]) ::slotted(zui-table-row:not([header]):not([summary]):nth-child(even)){--zui-table-row-background: var(--zui-gray-25)}:host([banded]) ::slotted(zui-table-row:not([header],[summary])){border:0}:host([no-results]) .no-results{display:block;padding:.75rem 1.25rem;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){:host([no-results]) .no-results{background-color:rgba(0,0,0,0);box-shadow:none}}:host([loading]) ::slotted(zui-table-row:not([header])),:host([loading]) .no-results{visibility:hidden}:host([loading]) zui-spinner{position:absolute;top:calc(50% - var(--zui-spinner-size, 1.75rem)/2);left:calc(50% - var(--zui-spinner-size, 1.75rem)/2)}:host([loading]) .table-wrapper{min-height:var(--zui-table-loading-min-height, 20rem)}@media(width > 45em){:host([mode=fixed-sizing]){max-width:var(--zui-table-max-width, none)}:host([mode=fixed-sizing]) .table{max-height:var(--zui-table-max-height, none);overflow:auto}:host([mode=fixed-sizing]) ::slotted(zui-table-row[header]){position:sticky;top:0;left:0;width:fit-content;z-index:1}}::slotted(zui-table-row:not([header],[summary])){border-bottom:2px solid var(--zui-gray-100)}@media(min-width: 45em){::slotted(zui-table-row:not([header],[summary])){border-bottom-width:1px}}::slotted(zui-table-row:not([header]):has(+zui-table-row[summary])),::slotted(zui-table-row:not([header]):last-of-type){border-bottom:0}@media(min-width: 45em){.wrapper{background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}}.table-wrapper{display:flex;flex-direction:column;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){.table-wrapper{box-shadow:none}}.table{display:flex;flex-direction:column;flex:1}.body{position:relative;flex:1}`;
+export const style = css `:host{contain:none;display:block}:host .no-results{display:none}:host([banded]) ::slotted(zui-table-row:not([header]):not([summary]):nth-child(even)){--zui-table-row-background: var(--zui-gray-25)}:host([banded]) ::slotted(zui-table-row:not([header],[summary])){border:0}:host([no-results]) .no-results{display:block;padding:.75rem 1.25rem;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){:host([no-results]) .no-results{background-color:rgba(0,0,0,0);box-shadow:none}}:host([loading]) ::slotted(zui-table-row:not([header])),:host([loading]) .no-results{visibility:hidden}:host([loading]) .table-wrapper{min-height:var(--zui-table-loading-min-height, 20rem)}:host([loading]) zui-spinner{position:absolute;top:calc(50% - var(--zui-spinner-size, 1.75rem)/2);left:calc(50% - var(--zui-spinner-size, 1.75rem)/2)}@media(width > 45em){:host([mode=fixed-sizing]){max-width:var(--zui-table-max-width, none)}:host([mode=fixed-sizing]) .table{max-height:var(--zui-table-max-height, none);overflow:auto}:host([mode=fixed-sizing]) ::slotted(zui-table-row[header]){position:sticky;top:0;z-index:1}}::slotted(zui-table-row:not([header],[summary])){border-bottom:2px solid var(--zui-gray-100)}@media(min-width: 45em){::slotted(zui-table-row:not([header],[summary])){border-bottom-width:1px}}::slotted(zui-table-row:not([header]):has(+zui-table-row[summary])),::slotted(zui-table-row:not([header]):last-of-type){border-bottom:0}@media(min-width: 45em){.wrapper{background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}}.wrapper .table-wrapper{display:flex;flex-direction:column;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){.wrapper .table-wrapper{box-shadow:none}}.wrapper .table-wrapper .table{display:flex;flex-direction:column;flex:1}.wrapper .table-wrapper .table .body{position:relative;flex:1}`;
 //# sourceMappingURL=zui-table-css.js.map

package/dist/zui-table-css.js.map

@@ -1 +1 @@
-{"version":3,"file":"zui-table-css.js","sourceRoot":"","sources":["../src/zui-table-css.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,6wDAA6wD,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const style = css`:host{contain:none;display:block}:host .no-results{display:none}:host([banded]) ::slotted(zui-table-row:not([header]):not([summary]):nth-child(even)){--zui-table-row-background: var(--zui-gray-25)}:host([banded]) ::slotted(zui-table-row:not([header],[summary])){border:0}:host([no-results]) .no-results{display:block;padding:.75rem 1.25rem;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){:host([no-results]) .no-results{background-color:rgba(0,0,0,0);box-shadow:none}}:host([loading]) ::slotted(zui-table-row:not([header])),:host([loading]) .no-results{visibility:hidden}:host([loading]) zui-spinner{position:absolute;top:calc(50% - var(--zui-spinner-size, 1.75rem)/2);left:calc(50% - var(--zui-spinner-size, 1.75rem)/2)}:host([loading]) .table-wrapper{min-height:var(--zui-table-loading-min-height, 20rem)}@media(width > 45em){:host([mode=fixed-sizing]){max-width:var(--zui-table-max-width, none)}:host([mode=fixed-sizing]) .table{max-height:var(--zui-table-max-height, none);overflow:auto}:host([mode=fixed-sizing]) ::slotted(zui-table-row[header]){position:sticky;top:0;left:0;width:fit-content;z-index:1}}::slotted(zui-table-row:not([header],[summary])){border-bottom:2px solid var(--zui-gray-100)}@media(min-width: 45em){::slotted(zui-table-row:not([header],[summary])){border-bottom-width:1px}}::slotted(zui-table-row:not([header]):has(+zui-table-row[summary])),::slotted(zui-table-row:not([header]):last-of-type){border-bottom:0}@media(min-width: 45em){.wrapper{background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}}.table-wrapper{display:flex;flex-direction:column;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){.table-wrapper{box-shadow:none}}.table{display:flex;flex-direction:column;flex:1}.body{position:relative;flex:1}`;\n"]}
+{"version":3,"file":"zui-table-css.js","sourceRoot":"","sources":["../src/zui-table-css.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,6zDAA6zD,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const style = css`:host{contain:none;display:block}:host .no-results{display:none}:host([banded]) ::slotted(zui-table-row:not([header]):not([summary]):nth-child(even)){--zui-table-row-background: var(--zui-gray-25)}:host([banded]) ::slotted(zui-table-row:not([header],[summary])){border:0}:host([no-results]) .no-results{display:block;padding:.75rem 1.25rem;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){:host([no-results]) .no-results{background-color:rgba(0,0,0,0);box-shadow:none}}:host([loading]) ::slotted(zui-table-row:not([header])),:host([loading]) .no-results{visibility:hidden}:host([loading]) .table-wrapper{min-height:var(--zui-table-loading-min-height, 20rem)}:host([loading]) zui-spinner{position:absolute;top:calc(50% - var(--zui-spinner-size, 1.75rem)/2);left:calc(50% - var(--zui-spinner-size, 1.75rem)/2)}@media(width > 45em){:host([mode=fixed-sizing]){max-width:var(--zui-table-max-width, none)}:host([mode=fixed-sizing]) .table{max-height:var(--zui-table-max-height, none);overflow:auto}:host([mode=fixed-sizing]) ::slotted(zui-table-row[header]){position:sticky;top:0;z-index:1}}::slotted(zui-table-row:not([header],[summary])){border-bottom:2px solid var(--zui-gray-100)}@media(min-width: 45em){::slotted(zui-table-row:not([header],[summary])){border-bottom-width:1px}}::slotted(zui-table-row:not([header]):has(+zui-table-row[summary])),::slotted(zui-table-row:not([header]):last-of-type){border-bottom:0}@media(min-width: 45em){.wrapper{background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}}.wrapper .table-wrapper{display:flex;flex-direction:column;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){.wrapper .table-wrapper{box-shadow:none}}.wrapper .table-wrapper .table{display:flex;flex-direction:column;flex:1}.wrapper .table-wrapper .table .body{position:relative;flex:1}`;\n"]}

package/dist/zui-table-row-css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
-export const style = css `:host{contain:none;display:flex}:host(:last-of-type:not([summary])) div,:host([summary]) div{margin-bottom:0}:host([header]){--zui-table-row-background: #fff;display:none;border-bottom:.0625rem solid var(--zui-gray-200)}@media(min-width: 45em){:host([header]){display:block}}:host([header]) div{box-shadow:none}:host([header]) ::slotted(zui-table-cell){--zui-table-cell-padding: 0.53125rem 1.25rem;font-weight:600;user-select:none}div{display:grid;flex:1;grid-template-columns:auto;margin-bottom:0;padding:.625rem 0;background-color:var(--zui-table-row-background, #fff)}@media(min-width: 45em){div{grid-template-columns:var(--zui-table-columns-template, repeat(auto-fit, minmax(0, 1fr)));padding:0;background-color:var(--zui-table-row-background, transparent);box-shadow:none}}:host([summary]){--zui-table-columns-template: 1fr;background-color:var(--zui-table-summary-background-color, var(--zui-gray-600)) !important}:host([summary]) div{margin-bottom:0;background-color:rgba(0,0,0,0)}:host([summary]) ::slotted(zui-table-cell){font-weight:600;color:var(--zui-table-summary-text-color, #fff)}`;
+export const style = css `:host{contain:none;display:flex}:host([header]){--zui-table-row-background: #fff;display:none}@media(min-width: 45em){:host([header]){display:flex}}:host([header]) div{border-bottom:.0625rem solid var(--zui-gray-200);box-shadow:none}:host([header]) ::slotted(zui-table-cell){--zui-table-cell-padding: 0.53125rem 1.25rem;font-weight:600;user-select:none}:host([summary]){--zui-table-columns-template: 1fr;background-color:var(--zui-table-summary-background-color, var(--zui-gray-600)) !important}:host([summary]) div{margin-bottom:0;background-color:rgba(0,0,0,0)}:host([summary]) ::slotted(zui-table-cell){font-weight:600;color:var(--zui-table-summary-text-color, #fff)}:host(:last-of-type:not([summary])) div,:host([summary]) div{margin-bottom:0}div{display:grid;flex:1;grid-template-columns:auto;margin-bottom:0;padding:.625rem 0;background-color:var(--zui-table-row-background, #fff)}@media(min-width: 45em){div{grid-template-columns:var(--zui-table-columns-template, repeat(auto-fit, minmax(0, 1fr)));padding:0;background-color:var(--zui-table-row-background, transparent);box-shadow:none}}`;
 //# sourceMappingURL=zui-table-row-css.js.map

package/dist/zui-table-row-css.js.map

@@ -1 +1 @@
-{"version":3,"file":"zui-table-row-css.js","sourceRoot":"","sources":["../src/zui-table-row-css.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,ykCAAykC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const style = css`:host{contain:none;display:flex}:host(:last-of-type:not([summary])) div,:host([summary]) div{margin-bottom:0}:host([header]){--zui-table-row-background: #fff;display:none;border-bottom:.0625rem solid var(--zui-gray-200)}@media(min-width: 45em){:host([header]){display:block}}:host([header]) div{box-shadow:none}:host([header]) ::slotted(zui-table-cell){--zui-table-cell-padding: 0.53125rem 1.25rem;font-weight:600;user-select:none}div{display:grid;flex:1;grid-template-columns:auto;margin-bottom:0;padding:.625rem 0;background-color:var(--zui-table-row-background, #fff)}@media(min-width: 45em){div{grid-template-columns:var(--zui-table-columns-template, repeat(auto-fit, minmax(0, 1fr)));padding:0;background-color:var(--zui-table-row-background, transparent);box-shadow:none}}:host([summary]){--zui-table-columns-template: 1fr;background-color:var(--zui-table-summary-background-color, var(--zui-gray-600)) !important}:host([summary]) div{margin-bottom:0;background-color:rgba(0,0,0,0)}:host([summary]) ::slotted(zui-table-cell){font-weight:600;color:var(--zui-table-summary-text-color, #fff)}`;\n"]}
+{"version":3,"file":"zui-table-row-css.js","sourceRoot":"","sources":["../src/zui-table-row-css.js"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,KAAK,GAAG,GAAG,CAAA,wkCAAwkC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const style = css`:host{contain:none;display:flex}:host([header]){--zui-table-row-background: #fff;display:none}@media(min-width: 45em){:host([header]){display:flex}}:host([header]) div{border-bottom:.0625rem solid var(--zui-gray-200);box-shadow:none}:host([header]) ::slotted(zui-table-cell){--zui-table-cell-padding: 0.53125rem 1.25rem;font-weight:600;user-select:none}:host([summary]){--zui-table-columns-template: 1fr;background-color:var(--zui-table-summary-background-color, var(--zui-gray-600)) !important}:host([summary]) div{margin-bottom:0;background-color:rgba(0,0,0,0)}:host([summary]) ::slotted(zui-table-cell){font-weight:600;color:var(--zui-table-summary-text-color, #fff)}:host(:last-of-type:not([summary])) div,:host([summary]) div{margin-bottom:0}div{display:grid;flex:1;grid-template-columns:auto;margin-bottom:0;padding:.625rem 0;background-color:var(--zui-table-row-background, #fff)}@media(min-width: 45em){div{grid-template-columns:var(--zui-table-columns-template, repeat(auto-fit, minmax(0, 1fr)));padding:0;background-color:var(--zui-table-row-background, transparent);box-shadow:none}}`;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zywave/zui-table",
-  "version": "4.4.0-pre.2",
+  "version": "4.4.0-pre.3",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "license": "UNLICENSED",
@@ -29,5 +29,5 @@
   "devDependencies": {
     "@zywave/zui-button": "^4.1.9-pre.2"
   },
-  "gitHead": "7a79a64033bbdd223569e31fda266408b42f0401"
+  "gitHead": "00cf6ef627871e3aecdd6dce086d8429006e69ad"
 }

package/src/css/zui-table.fouc.scss

@@ -30,6 +30,54 @@ zui-table[banded] {
   }
 }
 
+zui-table[mode='fixed-sizing'] {
+  @include undefined-element {
+    @media (width > $bp-xs) {
+      position: relative;
+      max-width: var(--zui-table-max-width, none);
+      max-height: calc(var(--zui-table-max-height, none) + #{rem(102)});
+      overflow: hidden;
+
+      &:has(> zui-table-row[summary], > :not(zui-table-footer)) {
+        max-height: calc(var(--zui-table-max-height, none) + #{rem(162)});
+      }
+
+      &:has(> zui-table-row[summary] + zui-table-footer) {
+        max-height: calc(var(--zui-table-max-height, none) + #{rem(232)});
+      }
+
+      zui-table-topbar {
+        position: sticky;
+        top: 0;
+        left: 0;
+        z-index: 1;
+      }
+
+      zui-table-row[header] {
+        position: sticky;
+        top: rem(62);
+        z-index: 1;
+      }
+
+      zui-table-row[summary] {
+        position: sticky;
+        bottom: 0;
+        left: 0;
+
+        &:has(+ zui-table-footer) {
+          bottom: rem(70);
+        }
+      }
+
+      zui-table-footer {
+        position: sticky;
+        bottom: 0;
+        left: 0;
+      }
+    }
+  }
+}
+
 zui-table[no-results] {
   @include undefined-element {
     [slot='no-results-message'] {
@@ -164,13 +212,13 @@ zui-table-topbar {
 zui-table-row {
   @include undefined-element {
     display: grid;
-    grid-template-columns: auto;
+    grid-template-columns: var(--zui-table-columns-template, repeat(auto-fit, minmax(0, 1fr)));
     padding: rem(10) 0;
     background-color: #fff;
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.29);
 
     @media (min-width: $bp-xs) {
-      display: flex;
+      // display: flex;
       padding: 0;
       box-shadow: none;
     }
@@ -184,7 +232,7 @@ zui-table-row[header] {
     border-bottom: 1px solid var(--zui-gray-200);
 
     @media (min-width: $bp-xs) {
-      display: flex;
+      display: grid;
     }
 
     zui-table-cell {
@@ -212,6 +260,7 @@ zui-table-row:not([header]):last-of-type {
 
 zui-table-row[summary] {
   @include undefined-element {
+    grid-template-columns: 1fr;
     background-color: var(--zui-table-summary-background-color, var(--zui-gray-600)) !important;
 
     zui-table-cell {

package/src/zui-table-cell-css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
 
-export const style = css`:host{--zui-table-cell-sort-active-color: var(--zui-blue);--zui-table-cell-sort-color: var(--zui-gray-300);contain:none;overflow-wrap:break-word}:host([action]) div{display:flex}@media(min-width: 45em){:host([action]) div{--zui-table-cell-padding: 0.375rem 1.25rem;align-items:center}}:host([action]) ::slotted(zui-button:not(:first-of-type)){margin-left:.625rem}:host([sort=ascending]) zui-icon{--zui-icon-sort-ascending-color: var(--zui-table-cell-sort-active-color)}:host([sort=descending]) zui-icon{--zui-icon-sort-descending-color: var(--zui-table-cell-sort-active-color)}div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem)}@media(min-width: 45em){div{padding:var(--zui-table-cell-padding, 0.8125rem 1.25rem)}}div.header{float:left;width:33.333%;font-weight:600}div.header+div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem 0.3125rem 0)}zui-icon{--zui-icon-size: 1.125rem;vertical-align:middle;margin-left:.625rem;fill:var(--zui-table-cell-sort-color)}.is-selectable{cursor:pointer}`;
+export const style = css`:host{--zui-table-cell-sort-active-color: var(--zui-blue);--zui-table-cell-sort-color: var(--zui-gray-300);contain:none;overflow-wrap:break-word}:host([sort=ascending]) zui-icon{--zui-icon-sort-ascending-color: var(--zui-table-cell-sort-active-color)}:host([sort=descending]) zui-icon{--zui-icon-sort-descending-color: var(--zui-table-cell-sort-active-color)}:host([action]) div{display:flex}@media(min-width: 45em){:host([action]) div{--zui-table-cell-padding: 0.375rem 1.25rem;align-items:center}}:host([action]) ::slotted(zui-button:not(:first-of-type)){margin-left:.625rem}div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem)}@media(min-width: 45em){div{padding:var(--zui-table-cell-padding, 0.8125rem 1.25rem)}}div.header{float:left;width:33.333%;font-weight:600}div.header+div{padding:var(--zui-table-cell-padding, 0.3125rem 0.9375rem 0.3125rem 0)}zui-icon{--zui-icon-size: 1.125rem;vertical-align:middle;margin-left:.625rem;fill:var(--zui-table-cell-sort-color)}.is-selectable{cursor:pointer}`;

package/src/zui-table-cell.scss

@@ -8,9 +8,22 @@
   overflow-wrap: break-word;
 }
 
+:host([sort='ascending']) {
+  zui-icon {
+    --zui-icon-sort-ascending-color: var(--zui-table-cell-sort-active-color);
+  }
+}
+
+:host([sort='descending']) {
+  zui-icon {
+    --zui-icon-sort-descending-color: var(--zui-table-cell-sort-active-color);
+  }
+}
+
 :host([action]) {
   div {
     display: flex;
+
     @media (min-width: $bp-xs) {
       --zui-table-cell-padding: #{rem(6)} #{rem(20)};
       align-items: center;
@@ -22,33 +35,21 @@
   }
 }
 
-:host([sort='ascending']) {
-  zui-icon {
-    --zui-icon-sort-ascending-color: var(--zui-table-cell-sort-active-color);
-  }
-}
-
-:host([sort='descending']) {
-  zui-icon {
-    --zui-icon-sort-descending-color: var(--zui-table-cell-sort-active-color);
-  }
-}
-
 div {
   padding: var(--zui-table-cell-padding, #{rem(5)} #{rem(15)});
 
   @media (min-width: $bp-xs) {
     padding: var(--zui-table-cell-padding, #{rem(13)} #{rem(20)});
   }
-}
 
-div.header {
-  float: left;
-  width: 33.333%;
-  font-weight: 600;
+  &.header {
+    float: left;
+    width: 33.333%;
+    font-weight: 600;
 
-  + div {
-    padding: var(--zui-table-cell-padding, #{rem(5)} #{rem(15)} #{rem(5)} 0);
+    + div {
+      padding: var(--zui-table-cell-padding, #{rem(5)} #{rem(15)} #{rem(5)} 0);
+    }
   }
 }
 

package/src/zui-table-css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
 
-export const style = css`:host{contain:none;display:block}:host .no-results{display:none}:host([banded]) ::slotted(zui-table-row:not([header]):not([summary]):nth-child(even)){--zui-table-row-background: var(--zui-gray-25)}:host([banded]) ::slotted(zui-table-row:not([header],[summary])){border:0}:host([no-results]) .no-results{display:block;padding:.75rem 1.25rem;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){:host([no-results]) .no-results{background-color:rgba(0,0,0,0);box-shadow:none}}:host([loading]) ::slotted(zui-table-row:not([header])),:host([loading]) .no-results{visibility:hidden}:host([loading]) zui-spinner{position:absolute;top:calc(50% - var(--zui-spinner-size, 1.75rem)/2);left:calc(50% - var(--zui-spinner-size, 1.75rem)/2)}:host([loading]) .table-wrapper{min-height:var(--zui-table-loading-min-height, 20rem)}@media(width > 45em){:host([mode=fixed-sizing]){max-width:var(--zui-table-max-width, none)}:host([mode=fixed-sizing]) .table{max-height:var(--zui-table-max-height, none);overflow:auto}:host([mode=fixed-sizing]) ::slotted(zui-table-row[header]){position:sticky;top:0;left:0;width:fit-content;z-index:1}}::slotted(zui-table-row:not([header],[summary])){border-bottom:2px solid var(--zui-gray-100)}@media(min-width: 45em){::slotted(zui-table-row:not([header],[summary])){border-bottom-width:1px}}::slotted(zui-table-row:not([header]):has(+zui-table-row[summary])),::slotted(zui-table-row:not([header]):last-of-type){border-bottom:0}@media(min-width: 45em){.wrapper{background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}}.table-wrapper{display:flex;flex-direction:column;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){.table-wrapper{box-shadow:none}}.table{display:flex;flex-direction:column;flex:1}.body{position:relative;flex:1}`;
+export const style = css`:host{contain:none;display:block}:host .no-results{display:none}:host([banded]) ::slotted(zui-table-row:not([header]):not([summary]):nth-child(even)){--zui-table-row-background: var(--zui-gray-25)}:host([banded]) ::slotted(zui-table-row:not([header],[summary])){border:0}:host([no-results]) .no-results{display:block;padding:.75rem 1.25rem;background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){:host([no-results]) .no-results{background-color:rgba(0,0,0,0);box-shadow:none}}:host([loading]) ::slotted(zui-table-row:not([header])),:host([loading]) .no-results{visibility:hidden}:host([loading]) .table-wrapper{min-height:var(--zui-table-loading-min-height, 20rem)}:host([loading]) zui-spinner{position:absolute;top:calc(50% - var(--zui-spinner-size, 1.75rem)/2);left:calc(50% - var(--zui-spinner-size, 1.75rem)/2)}@media(width > 45em){:host([mode=fixed-sizing]){max-width:var(--zui-table-max-width, none)}:host([mode=fixed-sizing]) .table{max-height:var(--zui-table-max-height, none);overflow:auto}:host([mode=fixed-sizing]) ::slotted(zui-table-row[header]){position:sticky;top:0;z-index:1}}::slotted(zui-table-row:not([header],[summary])){border-bottom:2px solid var(--zui-gray-100)}@media(min-width: 45em){::slotted(zui-table-row:not([header],[summary])){border-bottom-width:1px}}::slotted(zui-table-row:not([header]):has(+zui-table-row[summary])),::slotted(zui-table-row:not([header]):last-of-type){border-bottom:0}@media(min-width: 45em){.wrapper{background-color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}}.wrapper .table-wrapper{display:flex;flex-direction:column;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.29)}@media(min-width: 45em){.wrapper .table-wrapper{box-shadow:none}}.wrapper .table-wrapper .table{display:flex;flex-direction:column;flex:1}.wrapper .table-wrapper .table .body{position:relative;flex:1}`;

package/src/zui-table-row-css.js

@@ -1,3 +1,3 @@
 import { css } from 'lit';
 
-export const style = css`:host{contain:none;display:flex}:host(:last-of-type:not([summary])) div,:host([summary]) div{margin-bottom:0}:host([header]){--zui-table-row-background: #fff;display:none;border-bottom:.0625rem solid var(--zui-gray-200)}@media(min-width: 45em){:host([header]){display:block}}:host([header]) div{box-shadow:none}:host([header]) ::slotted(zui-table-cell){--zui-table-cell-padding: 0.53125rem 1.25rem;font-weight:600;user-select:none}div{display:grid;flex:1;grid-template-columns:auto;margin-bottom:0;padding:.625rem 0;background-color:var(--zui-table-row-background, #fff)}@media(min-width: 45em){div{grid-template-columns:var(--zui-table-columns-template, repeat(auto-fit, minmax(0, 1fr)));padding:0;background-color:var(--zui-table-row-background, transparent);box-shadow:none}}:host([summary]){--zui-table-columns-template: 1fr;background-color:var(--zui-table-summary-background-color, var(--zui-gray-600)) !important}:host([summary]) div{margin-bottom:0;background-color:rgba(0,0,0,0)}:host([summary]) ::slotted(zui-table-cell){font-weight:600;color:var(--zui-table-summary-text-color, #fff)}`;
+export const style = css`:host{contain:none;display:flex}:host([header]){--zui-table-row-background: #fff;display:none}@media(min-width: 45em){:host([header]){display:flex}}:host([header]) div{border-bottom:.0625rem solid var(--zui-gray-200);box-shadow:none}:host([header]) ::slotted(zui-table-cell){--zui-table-cell-padding: 0.53125rem 1.25rem;font-weight:600;user-select:none}:host([summary]){--zui-table-columns-template: 1fr;background-color:var(--zui-table-summary-background-color, var(--zui-gray-600)) !important}:host([summary]) div{margin-bottom:0;background-color:rgba(0,0,0,0)}:host([summary]) ::slotted(zui-table-cell){font-weight:600;color:var(--zui-table-summary-text-color, #fff)}:host(:last-of-type:not([summary])) div,:host([summary]) div{margin-bottom:0}div{display:grid;flex:1;grid-template-columns:auto;margin-bottom:0;padding:.625rem 0;background-color:var(--zui-table-row-background, #fff)}@media(min-width: 45em){div{grid-template-columns:var(--zui-table-columns-template, repeat(auto-fit, minmax(0, 1fr)));padding:0;background-color:var(--zui-table-row-background, transparent);box-shadow:none}}`;

package/src/zui-table-row.scss

@@ -6,23 +6,16 @@
   display: flex;
 }
 
-:host(:last-of-type:not([summary])),
-:host([summary]) {
-  div {
-    margin-bottom: 0;
-  }
-}
-
 :host([header]) {
   --zui-table-row-background: #fff;
   display: none;
-  border-bottom: rem(1) solid var(--zui-gray-200);
 
   @media (min-width: $bp-xs) {
-    display: block;
+    display: flex;
   }
 
   div {
+    border-bottom: rem(1) solid var(--zui-gray-200);
     box-shadow: none;
   }
 
@@ -33,6 +26,28 @@
   }
 }
 
+:host([summary]) {
+  --zui-table-columns-template: 1fr;
+  background-color: var(--zui-table-summary-background-color, var(--zui-gray-600)) !important;
+
+  div {
+    margin-bottom: 0;
+    background-color: transparent;
+  }
+
+  ::slotted(zui-table-cell) {
+    font-weight: 600;
+    color: var(--zui-table-summary-text-color, #fff);
+  }
+}
+
+:host(:last-of-type:not([summary])),
+:host([summary]) {
+  div {
+    margin-bottom: 0;
+  }
+}
+
 div {
   display: grid;
   flex: 1;
@@ -48,18 +63,3 @@ div {
     box-shadow: none;
   }
 }
-
-:host([summary]) {
-  --zui-table-columns-template: 1fr;
-  background-color: var(--zui-table-summary-background-color, var(--zui-gray-600)) !important;
-
-  div {
-    margin-bottom: 0;
-    background-color: transparent;
-  }
-
-  ::slotted(zui-table-cell) {
-    font-weight: 600;
-    color: var(--zui-table-summary-text-color, #fff);
-  }
-}

package/src/zui-table.scss

@@ -40,19 +40,19 @@
     visibility: hidden;
   }
 
+  .table-wrapper {
+    min-height: var(--zui-table-loading-min-height, 20rem);
+  }
+
   zui-spinner {
     position: absolute;
     top: calc(50% - (var(--zui-spinner-size, 1.75rem) / 2));
     left: calc(50% - (var(--zui-spinner-size, 1.75rem) / 2));
   }
-
-  .table-wrapper {
-    min-height: var(--zui-table-loading-min-height, 20rem);
-  }
 }
 
-@media (width > $bp-xs) {
-  :host([mode='fixed-sizing']) {
+:host([mode='fixed-sizing']) {
+  @media (width > $bp-xs) {
     max-width: var(--zui-table-max-width, none);
 
     .table {
@@ -63,8 +63,6 @@
     ::slotted(zui-table-row[header]) {
       position: sticky;
       top: 0;
-      left: 0;
-      width: fit-content;
       z-index: 1;
     }
   }
@@ -88,26 +86,26 @@
     background-color: #fff;
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.29);
   }
-}
 
-.table-wrapper {
-  display: flex;
-  flex-direction: column;
-  background: #fff;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.29);
-
-  @media (min-width: $bp-xs) {
-    box-shadow: none;
-  }
-}
+  .table-wrapper {
+    display: flex;
+    flex-direction: column;
+    background: #fff;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.29);
 
-.table {
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-}
+    @media (min-width: $bp-xs) {
+      box-shadow: none;
+    }
 
-.body {
-  position: relative;
-  flex: 1;
+    .table {
+      display: flex;
+      flex-direction: column;
+      flex: 1;
+
+      .body {
+        position: relative;
+        flex: 1;
+      }
+    }
+  }
 }