.umb-node-preview {
    padding: 5px 0;
    display: flex;
    box-sizing: border-box;
    border-bottom: 1px solid @gray-9;
    flex-wrap: wrap;
}

.umb-editor-wrapper .umb-node-preview {
    .umb-property-editor--limit-width();
}

.umb-node-preview:last-of-type {
    border-bottom: none;
}

.umb-node-preview--sortable {
    cursor: move;
}

.umb-node-preview--unpublished {
    .umb-node-preview__icon,
    .umb-node-preview__name,
    .umb-node-preview__description {
        opacity: 0.6;
    }
}

.umb-node-preview__icon {
    display: flex;
    height: 100%;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    margin-right: 10px;
    flex: 0 0 auto;
}

.umb-node-preview__content {
    flex: 1 1 auto;
    margin-right: 25px;
    overflow: hidden;
}

.umb-node-preview__name {
    color: @black;
    margin-top: 3px;
}

.umb-node-preview__description {
    font-size: 12px;
    line-height: 1.5em;
    color: @gray-3;
}

.umb-node-preview__name,
.umb-node-preview__description {
    /*text-overflow: ellipsis;
    overflow: hidden;*/
    word-wrap: break-word;
}

.umb-node-preview__actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    margin-left: auto;
}

.umb-node-preview__action {
    background: transparent;
    padding: 0;
    border: 0 none;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 13px;
    font-weight: bold;
    color: @ui-action-type;
    cursor: pointer;
}

.umb-node-preview__action:hover {
    color: @ui-action-type-hover;
    text-decoration: none;
    opacity: 1;
}

.umb-node-preview__action--red:hover {
    color: @red;
}

.umb-node-preview-add {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px dashed @ui-action-discreet-border;
    color: @ui-action-discreet-type;
    font-weight: bold;
    padding: 5px 15px;
    box-sizing: border-box;
    width: 100%;
}

.umb-node-preview-add:hover {
    color: @ui-action-discreet-type-hover;
    border-color: @ui-action-discreet-border-hover;
    text-decoration: none;
}

.umb-node-preview-add:disabled {
    cursor: not-allowed;

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

.umb-editor-wrapper .umb-node-preview-add {
    .umb-property-editor--limit-width();
}

.umb-overlay, 
.umb-modal {
    .umb-node-preview {
        max-width: none;
    }
    .umb-node-preview-add {
        max-width: none;
    }
}

//  Single
.umb-node-preview[single] {
    border: 1px solid @gray-9;
    padding: 12px 15px;
    border-radius: @baseBorderRadius;
}