/*
 * Copyright 2019 The CodeWorld Authors. All rights reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.CodeMirror {
    font-family: "Source Code Pro", monospace;
    font-size: 12pt;
}

.CodeMirror-ruler {
    z-index: 1;
}

pre.cm-s-default span.cm-builtin,
div.CodeMirror span.cm-builtin {
    color: var(--builtin);
    font-weight: bold
}

pre.cm-s-default span.cm-builtin-2,
div.CodeMirror span.cm-builtin-2 {
    color: var(--builtin-2);
    font-weight: bold
}

pre.cm-s-default span.cm-keyword,
div.CodeMirror span.cm-keyword {
    color: var(--keyword);
    font-weight: bold
}

pre.cm-s-default span.cm-deprecated,
div.CodeMirror span.cm-deprecated {
    color: var(--deprecated);
    font-weight: bold;
    text-decoration: line-through
}

pre.cm-s-default span.cm-variable,
div.CodeMirror span.cm-variable {
    color: var(--variable);
}

pre.cm-s-default span.cm-variable-2,
div.CodeMirror span.cm-variable-2 {
    color: var(--variable2);
}

pre.cm-s-default span.cm-comment,
div.CodeMirror span.cm-comment {
    color: var(--comment);
}

pre.cm-s-default span.cm-string,
div.CodeMirror span.cm-string {
    color: var(--string);
}

pre.cm-s-default span.cm-meta,
div.CodeMirror span.cm-meta {
    color: var(--meta);
}

pre.cm-s-default span.cm-qualifier,
div.CodeMirror span.cm-qualifier {
    color: var(--qualifier);
}

pre.cm-s-default span.cm-number,
div.CodeMirror span.cm-number {
    color: var(--number);
}

pre.cm-s-default span.cm-bracket,
div.CodeMirror span.cm-bracket {
    color: var(--bracket);
}

pre.cm-s-default span.cm-bracket-0,
div.CodeMirror span.cm-bracket-0 {
    font-weight: bold;
    color: var(--bracket-0);
    font-size: 1.25em;
    letter-spacing: -0.12em;
}

span.cm-bracket-0.cm-layout:before {
    font-size: calc(0.8em);
}

pre.cm-s-default span.cm-bracket-1,
div.CodeMirror span.cm-bracket-1 {
    font-weight: bold;
    color: var(--bracket-1);
    font-size: 1.12em;
    letter-spacing: -0.064em;
}

span.cm-bracket-1.cm-layout:before {
    font-size: 0.893em;
}

pre.cm-s-default span.cm-bracket-2,
div.CodeMirror span.cm-bracket-2 {
    font-weight: bold;
    color: var(--bracket-2);
}

pre.cm-s-default span.cm-bracket-3,
div.CodeMirror span.cm-bracket-3 {
    font-weight: bold;
    color: var(--bracket-3);
}

pre.cm-s-default span.cm-bracket-4,
div.CodeMirror span.cm-bracket-4 {
    font-weight: bold;
    color: var(--bracket-4);
}

pre.cm-s-default span.cm-bracket-5,
div.CodeMirror span.cm-bracket-5 {
    font-weight: bold;
    color: var(bracket-5);
}

pre.cm-s-default span.cm-bracket-6,
div.CodeMirror span.cm-bracket-6 {
    font-weight: bold;
    color: var(bracket-6);
}

pre.cm-s-default span.cm-bracket-7,
div.CodeMirror span.cm-error {
    color: var(bracket-7);
}

/* Make bracket matching look nicer. */
div.CodeMirror span.CodeMirror-matchingbracket {
    outline: solid var(--matchingbracket) 0.1em
}

div.CodeMirror span.CodeMirror-nonmatchingbracket {
    outline: solid var(--nonmatchingbracket) 0.1em
}

/* Highlighting for matches to the selected word. */
div.CodeMirror span.cm-matchhighlight {
    background-color: var(--matchhighlight);
}

.CodeMirror-selection-highlight-scrollbar {
    background-color: var(--selection-highlight-scrollbar)
}

/* Grayed-out style for the empty editor placeholder. */
.CodeMirror pre.CodeMirror-placeholder {
    color: var(--cm-placeholder);
}

/* Style overrides for the autocomplete box and doc-on-hover. */

#function-details {
    z-index: 10;
}

.CodeMirror-hint,
.hover-decl {
    color: var(--hover-decl);
    font-family: "Source Code Pro", monospace;
    font-size: 9pt;
    white-space: pre-line;
}

.hover-decl {
    padding-left: 2em;
    text-indent: -2em;
}

.CodeMirror-hint .hint-word,
.hover-decl .hint-word {
    font-weight: bold;
    color: var(--hint-word);
}

.CodeMirror-hint .hint-keyword,
.hover-decl .hint-keyword {
    font-weight: bold;
    color: var(--hint-keyword);
}

.CodeMirror-hints {
    background: var(--hints-list-bg)
}

.CodeMirror-hint {
    max-width: 40em;
}

li.CodeMirror-hint-active {
    background: var(--hint-active-bg);
    color: var(--hint-active);
}

.CodeMirror-hover-tooltip,
.CodeMirror-lint-tooltip,
.hint-description,
.function-tooltip-styling {
    background-color: var(--hover-tooltip);
    border-radius: 0.5em;
    border: 1px solid var(--hover-tooltip-border);
    box-shadow: 0.1em 0.1em 0.1em var(--hover-tooltip-shadow);
    min-height: 1em;
    max-height: 20em;
    min-width: 5em;
    overflow: hidden;
    padding: 0.3em 0.5em;
    transition: opacity .4s;
    -moz-transition: opacity .4s;
    -ms-transition: opacity .4s;
    -o-transition: opacity .4s;
    -webkit-transition: opacity .4s;
}

.CodeMirror-lint-tooltip {
    color: var(--lint-tooltip-color);
}

.hint-description {
    color: var(--hint-description-color);
}

.function-tooltip-styling .hover-decl {
    white-space: nowrap;
}

.CodeMirror-hover-tooltip {
    opacity: 0;
    position: fixed;
    max-width: 30em;
}

.hint-description {
    position: absolute;
    height: 14.2em;
    width: 20em;
    z-index: 11;
}

div.fade {
    position: absolute;
    top: 0px;
    bottom: 0px;
    width: 100%;
    height: 100%;
    display: block;
}

.CodeMirror-hover-tooltip div.fade {
    background-image: linear-gradient(to bottom,
            var(--hover-tooltip-grad-start) 0em,
            var(--hover-tooltip-grad-start) 17em,
            var(--hover-tooltip) 20em);
}

.hint-description div.fade {
    background-image: linear-gradient(to bottom,
            var(--hover-tooltip-grad-start) 0em,
            var(--hover-tooltip-grad-start) 11.2em,
            var(--hover-tooltip) 14.2em);
}

.hover-doc {
    color: var(--hover-doc-color);
    padding-top: 0.5em;
    font-size: 11pt;
}

div.CodeMirror-lint-message-warning,
div.CodeMirror-lint-message-error {
    padding-left: calc(18px + 0.5em);
}

div.CodeMirror-lint-message-warning:not(:last-child):after,
div.CodeMirror-lint-message-error:not(:last-child):after {
    content: "";
    border-bottom: solid var(--lint-message-border-bottom) 1px;
    display: block;
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
}

/* Styles needed for the dialog add-on, used for search. */

.CodeMirror-dialog {
    position: absolute;
    left: 0;
    right: 0;
    background-color: var(--dialog-bg);
    z-index: 15;
    padding: .1em .8em;
    overflow: hidden;
    color: var(--dialog);
}

.CodeMirror-dialog-top {
    border-bottom: 1px solid var(--dialog-border);
    top: 0;
}

.CodeMirror-dialog-bottom {
    border-top: 1px solid var(--dialog-border);
    bottom: 0;
}

.CodeMirror-dialog input {
    border: none;
    outline: none;
    background: transparent;
    width: 20em;
    color: inherit;
    font-family: "Source Code Pro", monospace;
}

.CodeMirror-dialog button {
    font-size: 70%;
}

.marked {
    background: var(--marked-bg);
}

/* source-code-pro-regular - latin */
@font-face {
    font-family: "Source Code Pro";
    font-style: normal;
    font-weight: 400;
    src: url('../SourceCodePro/source-code-pro-v7-latin-regular.eot');
    /* IE9 Compat Modes */
    src: local('Source Code Pro'), local('SourceCodePro-Regular'),
        url('../SourceCodePro/source-code-pro-v7-latin-regular.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../SourceCodePro/source-code-pro-v7-latin-regular.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('../SourceCodePro/source-code-pro-v7-latin-regular.woff') format('woff'),
        /* Modern Browsers */
        url('../SourceCodePro/source-code-pro-v7-latin-regular.ttf') format('truetype'),
        /* Safari, Android, iOS */
        url('../SourceCodePro/source-code-pro-v7-latin-regular.svg#SourceCodePro') format('svg');
    /* Legacy iOS */
}

/* source-code-pro-bold - latin */
@font-face {
    font-family: "Source Code Pro";
    font-style: normal;
    font-weight: 700;
    src: url('../SourceCodePro/source-code-pro-v7-latin-700.eot');
    /* IE9 Compat Modes */
    src: local('Source Code Pro Bold'), local('SourceCodePro-Bold'),
        url('../SourceCodePro/source-code-pro-v7-latin-700.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../SourceCodePro/source-code-pro-v7-latin-700.woff2') format('woff2'),
        /* Super Modern Browsers */
        url('../SourceCodePro/source-code-pro-v7-latin-700.woff') format('woff'),
        /* Modern Browsers */
        url('../SourceCodePro/source-code-pro-v7-latin-700.ttf') format('truetype'),
        /* Safari, Android, iOS */
        url('../SourceCodePro/source-code-pro-v7-latin-700.svg#SourceCodePro') format('svg');
    /* Legacy iOS */
}

span.cm-layout {
    position: relative;
}

span.cm-layout:first-child:before,
span:not(.cm-layout)+span.cm-layout:before {
    content: "\00BB";
    position: absolute;
    left: -0.65em;
    top: 0;
    color: var(--cm-layout);
    font-weight: normal;
    letter-spacing: 0;
}

.CodeMirror pre.CodeMirror-line,
.CodeMirror pre.CodeMirror-placeholder {
    padding-left: 0.5em;
}

.CodeMirror-buttonsPanel {
    font-size: 1.25em;
    background-color: var(--buttonsPanel-bg);
    border-bottom: solid var(--border-bottom) 1px;
    white-space: nowrap;
    overflow: hidden;
}

.CodeMirror-buttonsPanel div.cw-toolbar-button {
    display: inline-block;
    margin: 2px 0.2em 0em 0.2em;
    text-align: center;
    width: 2em;
    height: 1em;
    color: var(--cw-toolbar-button);
}

.CodeMirror-buttonsPanel div.cw-toolbar-button:hover {
    color: var(--cw-toolbar-button-hover);
}

.CodeMirror-buttonsPanel div.cw-toolbar-button:active {
    transform: translate(1px, 1px);
    color: var(--cw-toolbar-button-active);
}


.cm-s-default.CodeMirror {
    line-height: 1.4em;
}

.cm-s-default .CodeMirror-linenumber {
    padding: 0 5px;
}

.cm-s-ambiance .cm-comment {
    font-style: normal;
}