/* Custom JSON Editor Styles */
.jsoneditor {
    background-color: var(--background-color);
    color: var(--text-color);
    font-family: var(--font-family);
}

.jsoneditor .jsoneditor-tree {
    background-color: var(--background-color);
    color: var(--text-color);
}

.jsoneditor .jsoneditor-tree .jsoneditor-field,
.jsoneditor .jsoneditor-tree .jsoneditor-value,
.jsoneditor .jsoneditor-tree .jsoneditor-readonly {
    color: var(--text-color);
}

.jsoneditor .jsoneditor-tree .jsoneditor-selected {
    background-color: magenta; /* Highlight color changed to magenta */
}

.jsoneditor .jsoneditor-menu {
    background-color: var(--panel-bg-color);
    color: var(--text-color);
}

.jsoneditor .jsoneditor-menu button {
    background-color: var(--button-bg-color);
    color: var(--text-color);
    border: 1px solid var(--button-border-color);
    border-radius: var(--border-radius);
}

.jsoneditor .jsoneditor-menu button:hover {
    background-color: var(--hilight-color);
}

#jsoneditor {
    width: 100%;
    height: 500px;
}

.jsoneditor-popover {
    background-color: var(--panel-bg-color);
    color: var(--text-color);
}

.jsoneditor-schema-error {
    color: var(--primary-color);
}

div.jsoneditor td,
div.jsoneditor th,
div.jsoneditor textarea {
    background-color: var(--background-color);
    color: var(--text-color);
    border: 1px solid var(--form-border-color);
}

div.jsoneditor-field,
div.jsoneditor-value {
    color: var(--text-color);
}

pre.jsoneditor-preview {
    background-color: var(--background-color);
    color: var(--text-color);
}

.jsoneditor-popover, .jsoneditor-schema-error, div.jsoneditor td, div.jsoneditor textarea, div.jsoneditor th, div.jsoneditor-field, div.jsoneditor-value, pre.jsoneditor-preview {
    font-family: var(--font-family);
    font-size: 10pt;
    color: #1a1a1a;
}

div.jsoneditor-field.jsoneditor-highlight, div.jsoneditor-field[contenteditable=true]:focus, div.jsoneditor-field[contenteditable=true]:hover, div.jsoneditor-value.jsoneditor-highlight, div.jsoneditor-value[contenteditable=true]:focus, div.jsoneditor-value[contenteditable=true]:hover {
    background-color: var(--hilight-color);

}