.blockelement-labelblock-editor {
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: 4px;
    margin-top: 4px;
    width: 100%;
    min-height: 48px;
    border: 1px solid @gray-9;
    border-radius: @baseBorderRadius;
    cursor: pointer;
    color: @ui-action-discreet-type;
    background-color: white;
    text-align: left;
    padding: 0 20px;
    user-select: none;
    transition: border-color 120ms, background-color 120ms;

    > .icon {
        font-size: 22px;
        margin-right: 10px;
        display: inline-block;
    }

    > span {
        position: relative;
        display: inline-block;
        padding-top:2px;
        padding-bottom:2px;
    }

    &:hover {
        color: @ui-action-discreet-type-hover;
        background-color: @ui-action-hover;
    }

    &.--active {
        color: @ui-active-type;
        border-color: @ui-active;
        background-color: @ui-active;
    }

    ng-form.ng-invalid-val-server-match-content > .umb-block-list__block > .umb-block-list__block--content > div > & {
        color: @formErrorText;
        .show-validation-type-warning & {
            color: @formWarningText;
        }
    }
    ng-form.ng-invalid-val-server-match-content > .umb-block-list__block:not(.--active) > .umb-block-list__block--content > div > & {
        > span {
            &::after {
                content: "!";
                text-align: center;
                position: absolute;
                top: -6px;
                right: -15px;
                min-width: 10px;
                color: @white;
                background-color: @ui-active-type;
                border: 2px solid @white;
                border-radius: 50%;
                font-size: 10px;
                font-weight: bold;
                padding: 2px;
                line-height: 10px;
                background-color: @formErrorText;
                .show-validation-type-warning & {
                    background-color: @formWarningText;
                }
                font-weight: 900;

                animation-duration: 1.4s;
                animation-iteration-count: infinite;
                animation-name: blockelement-inlineblock-editor--badge-bounce;
                animation-timing-function: ease;
                @keyframes blockelement-inlineblock-editor--badge-bounce {
                    0%   { transform: translateY(0); }
                    20%  { transform: translateY(-4px); }
                    40%  { transform: translateY(0); }
                    55%  { transform: translateY(-2px); }
                    70%  { transform: translateY(0); }
                    100% { transform: translateY(0); }
                }
            }
        }
    }
}
