.contransBlur {
    background-color: rgba(255, 255, 255, 0.5);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    padding: 50px;
}

.workflow_api_row {
    background-color: #e7f3fa;
}

.workflow_api_connection_row {
    background-color: #ffeedf;
}

.workflow_if_row {
    background-color: #d9dadb;
}

.workflow_foreach_row {
    background-color: #ebedef;
}

a code {
    text-decoration: underline;
}

code {
    font-size: 12px !important;
}

code:after {
    display: inline-block;
    border-left: 1px solid rgba(0, 0, 0, 0.2);
    margin-left: 4px;
    padding-left: 4px;
    opacity: 0.5;
}

code.tag {
    color: #c29f00;
    background-color: #fff9d7;
    border: 1px solid #ffe700;
    white-space: nowrap;
}

    code.tag:after {
        content: "Tag";
    }

code.option {
    color: #D14;
    background-color: #fcf6f8;
    border: 1px solid #f7d6df;
    white-space: nowrap;
}

    code.option:after {
        content: "Option";
    }

code.api {
    color: #0c199c;
    background-color: #f4f5fc;
    border: 1px solid #c6cbe9;
    white-space: nowrap;
}

    code.api:after {
        content: "API";
    }

code.path {
    color: #095c05;
    background-color: #eef7ed;
    border: 1px solid #8ccb89;
    white-space: nowrap;
}

    code.path:after {
        content: "Path";
    }

code.type {
    color: #d119cf;
    background-color: #faebfa;
    border: 1px solid #f3aef2;
    white-space: nowrap;
}

    code.type:after {
        content: "Type";
    }

code.event {
    color: #2a839e;
    background-color: #f5fafb;
    border: 1px solid #a8ddec;
    white-space: nowrap;
}

    code.event:after {
        content: "Event";
    }

code.string {
    color: #c05f1d;
    background-color: #f5eee9;
    border: 1px solid #dfc4b2;
    white-space: nowrap;
}

    code.string:after {
        content: "String";
    }

code.field {
    color: #ad1ee8;
    background-color: #f9f1fc;
    border: 1px solid #ebc9f7;
    white-space: nowrap;
}

    code.field:after {
        content: "Field";
    }

code.button {
    color: #464e50;
    background-color: #f2f7f9;
    border: 1px solid #b8c3c5;
    white-space: nowrap;
}

    code.button:after {
        content: "Button";
    }

code.multiline {
    display: inline-block;
    width: 95%;
}

.nav-header {
    position: relative;
    overflow: hidden;
}

.nav-header .nav-header-tab {
    position: relative;
    background: var(--app-component-bg);
    list-style-type: none;
    margin: -10px 0 0;
    padding: 0 0 0 150px;
    border-radius: 0;
}

.nav-header .nav-header-tab .nav-item .nav-link {
    display: block;
/*    color: rgba(var(--app-component-color-rgb), 0.5);*/
    line-height: 20px;
    padding: 10px 20px;
    text-decoration: none; 
    font-weight: bold;
    font-size: 12px;
    border: none;
    border-radius: 0;
}

.field-validation-error {
    color: #e80c4d;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}