Styling selected text .CodeMirror-selected

Why overlap happens when I selected text ?
How fix this? In style.scss

.CodeMirror-selected {
  background: rgba($color-text,.3);
}
.CodeMirror-focused .CodeMirror-selected {
  background: rgba($color-text,.3);
}

.CodeMirror-line::selection,
.CodeMirror-line > span::selection,
.CodeMirror-line > span > span::selection {
  background: transparent;
  color: $color-text;
}

When I set background: $color-text; overlays are not visible, but I need transparency.