@layer platform {
    data-table {
        background-color: var(--theme-bg-background);
    }

    data-table .table-body {
        background-color: inherit;
    }

    data-table .table-row:hover::before {
        background: linear-gradient(var(--theme-bg-hover), var(--theme-bg-hover));
    }

    data-table .table-row.selected {
        color: var(--theme-primary-lighter-contrast);
    }

    data-table .table-row.selected::before {
        background: linear-gradient(var(--theme-primary-lighter), var(--theme-primary-lighter));
    }

    data-table .table-row.selected:hover::before {
        background: linear-gradient(var(--theme-bg-hover), var(--theme-bg-hover)), linear-gradient(var(--theme-primary-lighter), var(--theme-primary-lighter));
    }

    data-table .table-cell {
        cursor: inherit;
    }

    data-table:not(.wide-table) .table-row,
    data-table:not(.wide-table) .table-header {
        border-radius: 0;
    }

    data-table:not(.wide-table) .table-cell:not(:first-child) {
        border-left: 1px solid var(--grid-border-color);
    }
}