@import '../common/variables';

.bce-item-grid {
    flex: 1;

    // sass-lint:disable class-name-format
    .ReactVirtualized__Table__Grid {
        outline: none;
    }
}

.bce-item-row {
    border-top: 1px solid $bdl-gray-10;
    border-left: 2px solid transparent;
    outline: none;

    .bce-item-coloumn {
        color: $bdl-gray-62;
    }

    .bce-more-options {
        opacity: 0;

        .btn {
            margin-left: 8px;
            background-color: transparent;
        }

        .be-is-touch & {
            opacity: 1;
        }
    }

    &:hover,
    &:active,
    &:focus {
        background-color: $lighter-light-blue;
        border-left-color: $dark-cerulean;

        .bce-more-options {
            opacity: 1;
        }

        .bce-item-coloumn,
        .be & .btn-plain {
            color: $dark-cerulean;
            outline: none;
        }
    }

    &.bce-item-row-selected {
        background-color: $light-blue;
        border-top-color: $grey-blue;

        .bce-more-options {
            opacity: 1;
        }

        .bce-item-coloumn,
        .be & .btn-plain {
            color: $dark-cerulean;
        }
    }

    &:first-child {
        /* stylelint-disable declaration-no-important */
        border-top-color: transparent !important;
        /* stylelint-enable declaration-no-important */
    }

    &:last-child {
        border-bottom: 1px solid $bdl-gray-10;

        &.bce-item-row-selected {
            border-bottom-color: $grey-blue;
        }
    }

    &.bce-item-row-selected + & {
        border-top-color: $grey-blue;
    }
}

.bce-item-header-row {
    border-bottom: 1px solid $bdl-gray-10;
    box-shadow: 0 4px 6px -2px $transparent-black;

    .ReactVirtualized__Table__headerColumn {
        color: $bdl-gray-62;
        font-weight: normal;
        text-transform: none;
    }

    .ReactVirtualized__Table__sortableHeaderColumn {
        cursor: pointer;

        &:active,
        &:hover,
        &:focus {
            color: $dark-cerulean;
            outline: none;
        }
    }
}