span.bg__editable-text {
    border-bottom: 1px dotted transparent;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;

    &:hover {
        border-bottom: 1px dotted $clPrimary;
    }
}

input.bg__editable-text {
    display: inline-block;
    padding: 0;
    border: 0;
    background-color: transparent;
    border-radius: 0;
    margin: 0;
    border: none;
    padding-left: 5px;
    border-bottom: 1px dotted $clPrimary;
    width: auto;
}