@ebay/skin/dist/field/field.css

Skin - CSS modules that represent the brand eBay

span.field {
    display: inline-block;
}
span.field + span.field {
    margin-left: 8px;
}
.field-group,
div.field {
    margin: 16px 0;
}
.field-group {
    display: flex;
}
.field-group > div.field {
    margin: 0;
}
span.field--table {
    display: inline-table;
}
div.field--table {
    display: table;
}
.field__description--group {
    display: flex;
    justify-content: flex-end;
}
.field__description--group > :last-child {
    margin-inline-start: 5px;
    text-align: right;
}
.field__description--group > :first-child {
    flex: 1;
}
.field__label {
    margin-right: 8px;
}
.field__description {
    color: var(--field-description-color, var(--color-foreground-secondary));
    font-size: var(--font-size-small);
    line-height: var(--spacing-200);
    margin-top: var(--spacing-50);
}
.field__description--confirmation {
    color: var(
        --field-description-confirmation-color,
        var(--color-foreground-success)
    );
}
.field__description--information {
    color: var(
        --field-description-information-color,
        var(--color-foreground-accent)
    );
}
.field__description--attention {
    color: var(
        --field-description-attention-color,
        var(--color-foreground-attention)
    );
}
.field__group > .field__description,
.field__group > .field__label {
    align-self: center;
}
span.field__group {
    display: inline-flex;
}
div.field__group {
    display: flex;
}
.field__control + span.field__description {
    margin-left: 8px;
}
.field__description .icon {
    display: inline-block;
    margin-right: var(--spacing-50);
}
div.field__description {
    margin: var(--spacing-100) 0 0;
}
.field__row {
    display: table-row;
}
.field__row > .field__control,
.field__row > .field__description,
.field__row > .field__label {
    display: table-cell;
}
.field__row .field__label {
    margin-right: auto;
    padding-right: 8px;
}
.field__row .field__control + span.field__description {
    margin-left: 0;
    padding-left: 8px;
}
.field__row:first-child > .field__description {
    padding-bottom: 8px;
}
.field__row:last-child > .field__description {
    padding-top: 8px;
}
.field__label--end {
    margin-left: 4px;
    margin-right: auto;
}
.field__label--stacked {
    display: block;
    margin-bottom: 8px;
}
.field__label--disabled {
    color: var(--field-label-color-disabled, var(--color-foreground-disabled));
}
.field--fluid,
.field__control--fluid,
.field__group--fluid {
    width: 100%;
}
.field--align-top .field__label {
    display: inline-block;
    margin-top: 16px;
}
.field--align-top .textbox {
    vertical-align: top;
}
.field__group--align-top > .field__label {
    align-self: flex-start;
    margin-top: 16px;
}
[dir="rtl"] .field__description--group > :last-child {
    text-align: left;
}