@import "../../styles/modules/importAll";

.DatasetTable {
    margin-top: 4rem;

    .toggle-groups {
        display: block;
        width: 50px;
        text-align: center;
        padding-top: 10px;

        span {
            margin: 10px;
            padding: 5px 10px;
            background: #e6e6e6;
            border-radius: 5px;
        }
    }

    .wrapper {
        width: calc(100% - 50px);
        height: calc(100vh - 4rem);
        display: flex;

        &.noSidebar {
            width: calc(100% - 50px);
        }

        &.hasSidebar {
            width: calc(100% - 300px);
        }

        .public_fixedDataTableCell_main {
            max-width: 200px;
            white-space: nowrap;
            overflow: hidden;
        }

        // table styles
        .public_fixedDataTable_header,
        .public_fixedDataTable_scrollbarSpacer, 
        .public_fixedDataTable_header .public_fixedDataTableCell_main {
            background: #fff;
            background-image: none;
        }

        .public_fixedDataTableRow_highlighted {
            background-color: #fff;
        }

        .public_fixedDataTableCell_main {
            background-color: #fff;
            border-bottom: 1px solid #e0e4e8;
        }

        .public_fixedDataTableCell_cellContent {
            padding: 0.8em 12px;
            font-size: 14px;
        }
    }

    .sidebarWrapper {
        &.collapsed {
            width: 0;
        }

        &.expanded {
            width: 300px;
        }
    }

    .sidebarTargetingColumn {
        background-color: $lightGrey;
    }

    .ColumnHeader {
        position: relative;
    }
}