/* Mistake types styles */
.bes-highlight-rect {
  position: absolute;
  cursor: text;
}

.bes-highlight-spelling {
  color: hsl(211, 100%, 60%);
  background: hsla(211, 100%, 60%, 0.3);
}

.bes-highlight-grammar {
  color: hsl(27, 100%, 45%);
  background: hsla(27, 100%, 45%, 0.3);
}

@media (prefers-color-scheme: dark) {
  .bes-highlight-spelling {
    color: hsl(211, 100%, 55%);
    background: hsla(211, 100%, 55%, 0.3);
  }

  .bes-highlight-grammar {
    color: hsl(27, 100%, 65%);
    background: hsla(27, 100%, 65%, 0.3);
  }
}

/* Styles required to ensure full functionality and optimal user experience. */
.bes-correction-panel {
  position: relative;
  overflow: visible;
  float: left;
  display: inline;
  width: 0px;
  height: 0px;
  border: none;
  z-index: 1;
}

.bes-scroll-panel {
  position: relative;
  overflow: hidden;
  border-color: transparent;
  color: transparent;
  pointer-events: none;
}

.bes-canvas {
  position: relative;
  z-index: 3;
  cursor: text;
}

.bes-text-panel {
  position: absolute;
  margin: 0px;
  color: transparent;
  border-color: transparent;
  background: none;
  z-index: -1;
}

.bes-highlight-placeholder {
  display: none;
  visibility: hidden;
}