/* Shared table foundation for Leads, Kontakte, Booking, Deals and Interessenten-Analyse.
   A page keeps its own layout/interaction styles in *.razor.css.
   Normal is the unmodified legacy appearance: factor 1, no font-size overrides.
   Only on-screen tables opt in via app-data-table; print tables do not.
   Font scale values are defined in css/common/ui-variables.css. */
:root {
    --app-table-header-background: #f5f8ff;
    --app-table-header-foreground: #4a5c87;
    --app-table-header-border: #e0e7f6;
    --app-table-row-border: #ebf0fb;
    --app-table-row-hover-background: #f8fbff;
}

/* Scale only opted-in tables. Explicit sizes in page styles multiply by this.
   Elements with an inherited font-size also scale with the table in compact/large. */
table.app-data-table.table-view-compact { --app-table-font-scale: var(--app-table-scale-compact); }
table.app-data-table.table-view-normal { --app-table-font-scale: var(--app-table-scale-normal); }
table.app-data-table.table-view-large { --app-table-font-scale: var(--app-table-scale-large); }

:where(table.app-data-table:is(.table-view-compact, .table-view-large)) {
    font-size: calc(1rem * var(--app-table-font-scale));
}

/* Shared header appearance for the four operational tables and Booking details.
   Report tables and nested customer tables intentionally retain their different header design. */
table.app-data-table:not(.report-table):not(.nested-customer-table) > thead > tr > th {
    background: var(--app-table-header-background) !important;
    color: var(--app-table-header-foreground);
    border-top: 1px solid var(--app-table-header-border);
    border-bottom: 1px solid var(--app-table-header-border);
    font-weight: 800;
}

/* Reports use a distinct header palette, but share typographic weight. */
table.app-data-table.report-table > thead > tr > th,
table.app-data-table.nested-customer-table > thead > tr > th {
    font-weight: 800;
}

/* All table selectors use the same compact right-aligned slot, immediately
   preceding their respective table/results (never inside the page title). */
.app-table-view-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin: 0 0 12px;
    min-width: 0;
}

@media print { .app-table-view-toolbar { display: none !important; } }