.macro-editor {
    padding-top: @base-unit;
    padding-left: @base-unit;
    padding-right: @base-unit;
    padding-bottom: @base-unit;

    .editor {
        float: left;
        width: calc(~"100% - 508px");
    }

    .add-clause {
        float: left;
        width: @base-unit * 3;
    }

        .add-clause button {
            margin-left: @base-unit * 0.5;
        }

    .rules {
        float: left;
        width: 458px;
    }

        .rules .editing-form-label-cell {
            padding-right: @base-unit;
        }
}

.conditionn-builder {
    font-size: 0;
}

.MacroRuleArea {
    width: 95%;
    margin: 10px 0 10px 10px;
}

.MacroRuleAreaBorder {
    border-left: 2px solid @color-gray-130;
    border-bottom: 2px solid @color-gray-130;
    border-right: 2px solid @color-gray-130;
    overflow: auto;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.MacroRuleToolbar {
    padding: 5px;
    border-top: 2px solid @color-gray-130;
    border-left: 2px solid @color-gray-130;
    border-right: 2px solid @color-gray-130;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    height: 30px;
    background-color: @color-gray-150;
}

.MacroRuleToolbarSeparator {
    background: url("../../CMSPages/GetResource.ashx?image=Design/Controls/UniMenu/RightBorder.png") no-repeat scroll left center transparent;
    margin: 3px 2px 0 6px;
    padding: 2px;
    float: left;
}

.MacroRuleToolbarButton {
    border: 1px solid transparent;
    float: left;
    padding: 2px;
}

.MacroRuleInfo {
    color: #808080;
}

.MacroRule {
    padding-left: 15px;
}

.MacroRuleParameter {
    text-decoration: underline;
    cursor: pointer;
}

.MacroRuleOperator {
    text-decoration: underline;
    cursor: pointer;
    margin: 3px;
    width: 30px;
}

.MacroRuleHandle {
    cursor: move;
}

.MacroRuleText {
    border: 1px solid transparent;
    padding: 2px;
}

.MacroRuleCue {
    border: dashed 1px #ff0000;
    display: none;
    margin: 5px;
    min-height: 20px;
}

.MacroRuleDialogBody {
    padding: 20px 20px 50px 20px;
}

.MacroRuleDialogButton {
    margin: 10px;
}

.MacroRuleTextActive {
    border: 1px dashed #000000;
    padding: 2px;
}

.RuleSelected {
    background-color: #AAE2FF;
    border: 1px solid #CCCCCC;
}

.ConditionBuilder {
    width: 292px;
}

.IE9 .ConditionBuilder, .Safari .ConditionBuilder, .Opera .ConditionBuilder {
    padding-top: 0;
}

.ConditionBuilder .code-mirror-scroll {
    height: 100px;
}

.ConditionBuilderRule {
    height: auto;
    word-wrap: break-word;
}

.ConditionBuilderRuleParam {
    border-bottom: 1px dashed #888;
}

.ConditionBuilderOperator {
    color: #888;
}

.macro-tree-editor-form-control .code-mirror-lines {
    padding: 0;
}

.CM.form-control {
    font-family: @font-family-base;
    font-size: @font-size-base;
}

.CM-singleline pre {
    font-family: @font-family-base;
    font-size: @font-size-base;
}

.CM.form-control.code-mirror-focused {
    background-color: #fff;
    border-bottom: @input-border-width solid @input-border-focus;
}

.CM-singleline .code-mirror-lines {
    padding: 0;
}