@import '../../style/core/_font';
@import '../../style/theme/color';

.devui-quadrant-region {
  position: absolute;
}

.devui-quadrant-title {
  font-size: $devui-font-size-data-overview;
  line-height: 32px;
  margin: 20px;
  user-select: none;

  span {
    display: block;
  }
}

.devui-quadrant-region-1 {
  background: rgba(246, 111, 106, 0.04);
  border-bottom: 1px solid $devui-dividing-line;
  border-left: 1px solid $devui-dividing-line;

  .devui-quadrant-title {
    color: rgba(246, 111, 106, 0.3);
  }
}

.devui-quadrant-region-2 {
  background: rgba(250, 194, 10, 0.04);
  border-bottom: 1px solid $devui-dividing-line;

  .devui-quadrant-title {
    color: rgba(250, 194, 10, 0.3);
  }
}

.devui-quadrant-region-3 {
  background: rgba(80, 212, 171, 0.04);

  .devui-quadrant-title {
    color: rgba(80, 212, 171, 0.3);
  }
}

.devui-quadrant-region-4 {
  background: rgba(81, 112, 255, 0.04);
  border-left: 1px solid $devui-dividing-line;

  .devui-quadrant-title {
    color: rgba(81, 112, 255, 0.3);
  }
}
