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

.bes-highlight-spelling {
  color: rgb(242, 90, 90);
  background: hsla(0, 100%, 67%, 0.18);
}

.bes-highlight-ai {
  color: rgb(139, 62, 223);
  background: hsla(262, 70%, 56%, 0.18);
}

.bes-highlight-grammar {
  color: rgb(60, 120, 220);
  background: hsla(220, 80%, 56%, 0.18);
}

@media (prefers-color-scheme: dark) {
  .bes-highlight-spelling {
    color: rgb(255, 120, 120);
    background: hsla(0, 100%, 67%, 0.32);
  }

  .bes-highlight-ai {
    color: rgb(180, 120, 255);
    background: hsla(262, 70%, 56%, 0.32);
  }

  .bes-highlight-grammar {
    color: rgb(100, 164, 243);
    background: hsla(220, 80%, 56%, 0.32);
  }
}

/* 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;
}