/*---------------------------------------------------------------------------------------------
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
* See LICENSE.md in the project root for license terms and full copyright notice.
*--------------------------------------------------------------------------------------------*/
@import "~@bentley/ui-core/lib/ui-core/style/baseline";
@import "~@bentley/ui-core/lib/ui-core/style/themecolors";
@import "~@bentley/ui-core/lib/ui-core/style/variables";

.components-column-drag-layer {
  border: 1px solid $buic-foreground-disabled;
  border-radius: $uicore-border-radius;
  padding: 0px;
  margin: 0px;
  line-height: $uicore-line-height;
  color: $buic-foreground-disabled;
  font-weight: bold;
}

.components-table-header-drag-drop {
  &.dragging .react-grid-HeaderCell {
    background: $buic-background-table-header;
  }
  &.left .react-grid-HeaderCell {
    border-left: solid $buic-foreground-activehover 2px;
  }
  &.right .react-grid-HeaderCell {
    border-right: solid $buic-foreground-activehover 2px;
  }
}

.components-table-drop-target {
  border-top: solid transparent 1px;
  border-bottom: solid transparent 1px;

  &.above {
    border-top: solid $buic-foreground-activehover 1px;
  }

  &.on {
    .react-grid-Row * {
      /* !important used because react-data-grid did. only way to override */
      background-color: $buic-foreground-primary !important;
    }
  }

  &.below {
    border-bottom: solid $buic-foreground-activehover 1px;
  }

  &.dragging {
    .react-grid-Row * {
      color: $buic-foreground-muted;
    }
  }
}