/* Change the editor's background and font color */
.CodeMirror {
    background-color: #1e1e2f; /* Dark background */
    color: #c5c8c6; /* Text color */
    font-family: 'Fira Code', monospace; /* Custom font */
    font-size: 16px; /* Adjust font size */
}

/* Customize line numbers */
.CodeMirror-gutter {
    background-color: #282c34; /* Gutter background */
    color: #5c6370; /* Line numbers color */
}

/* Highlight the active line */
.CodeMirror-activeline-background {
    background-color: rgba(255, 255, 255, 0.1); /* Subtle highlight */
}

/* Style the selection */
.CodeMirror-selected {
    background-color: rgba(100, 149, 237, 0.3); /* Light blue */
}

/* Style matching brackets */
.CodeMirror-matchingbracket {
    color: #56b6c2; /* Teal */
    font-weight: bold;
    text-decoration: underline;
}

/* Customize the cursor */
.CodeMirror-cursor {
    border-left: 2px solid #61dafb; /* Blue cursor */
}

/* Adjust scrollbar styles */
.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
    background-color: #1e1e2f;
}

.CodeMirror-vscrollbar {
    background-color: #3a3f44;
}

.CodeMirror-hscrollbar {
    background-color: #3a3f44;
}