.root {}

.label {
    display: inline-block;
    padding-right: 5px;
}

.label[required]:after {
    content: '*';
    color: $brand-error;
}

.field {
    display: inline-block;
    position: relative;
}

.message {
    margin-left: 5px;
    padding: 0 5px;
    background: $background-color-base;
}

.message[color="error"] {
    background: $brand-error;
    color: white;
}

.root[placement="bottom"] .message {
    position: absolute;
    top: 100%;
    left: 0;
    margin-left: 0;
}

.root[label-size$="normal"] .label { width: 80px; }
.root[label-size$="normal"] .field { max-width: calc(100% - 80px); }

.root[layout="block"] .field {
    vertical-align: top;
}

.root {}

.label {
    display: inline-block;
    padding-right: 5px;
}

.label[required]:after {
    content: '*';
    color: $brand-error;
}

.field {
    display: inline-block;
    position: relative;
}

.message {
    margin-left: 5px;
    padding: 0 5px;
    background: $background-color-base;
}

.message[color="error"] {
    background: $brand-error;
    color: white;
}

.root[placement="bottom"] .message {
    position: absolute;
    top: 100%;
    left: 0;
    margin-left: 0;
}

.root[label-size$="normal"] > .label { width: 80px; }
.root[label-size$="normal"] > .field { max-width: calc(100% - 80px); }

.root[layout="block"] > .field {
    vertical-align: top;
}

Fix problem of nested <u-form-item> layout=block
:bug: Fix problem of nested <u-form-item> layout=block
