/* Make the DataTable transparent so the board card's opacity-controlled background shows through. The mantine-datatable defaults to var(--mantine-color-body) which is opaque. */ .downloads-table, .downloads-table .mantine-datatable-table, .downloads-table .mantine-datatable-table thead, .downloads-table .mantine-datatable-table tbody, .downloads-table .mantine-datatable-table tfoot, .downloads-table th, .downloads-table td { background-color: transparent !important; } .downloads-table .mantine-datatable-table tr { background-color: transparent; } .downloads-table .mantine-datatable-table tbody tr:hover { background-color: color-mix(in srgb, var(--mantine-color-default-hover) 40%, transparent) !important; } .downloads-table th { white-space: nowrap; background-color: color-mix(in srgb, var(--mantine-color-body) 60%, transparent) !important; backdrop-filter: blur(8px); } .downloads-table td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .downloads-table td .mantine-Text-root, .downloads-table td .mantine-Group-root { white-space: nowrap; flex-wrap: nowrap; } .downloads-table .mantine-datatable-header-cell-sortable-icon { opacity: 0; transition: opacity 150ms; } .downloads-table th:hover .mantine-datatable-header-cell-sortable-icon { opacity: 1; } /* Row expansion styling */ .downloads-table .mantine-datatable-row-expansion-cell { background-color: color-mix(in srgb, var(--mantine-color-body) 40%, transparent) !important; }