.form-element {
    display: flex;
    flex-flow: column;
    gap: var(--space-x2);
}

.form-element__label {
    max-width: 100%;
    overflow: hidden;
    font: var(--theme-paragraph-30-medium);
    color: var(--theme-label-color);
    letter-spacing: var(--theme-paragraph-30-letter-spacing);
}

.form-element__sublabel {
    font-weight: var(--theme-font-weight-light);
    color: var(--theme-label-color);
}

.form-element__label--row {
    display: flex;
    flex-flow: column;
}

.form-element__pill--collapsible {
    margin-right: var(--space-x2_5);
}

.form-element__label--collapsible {
    position: relative;
    cursor: pointer;
}

.form-element__label--collapsible::after {
    position: absolute;
    top: 4px;
    right: 2px;
    box-sizing: border-box;
    display: block;
    width: var(--theme-form-collapsible-icon-size);
    height: var(--theme-form-collapsible-icon-size);
    color: var(--theme-label-color);
    content: '';
    border-right: 2px solid;
    border-bottom: 2px solid;
    transform: rotate(45deg);
}

.form-element__label--collapsible-expanded::after {
    top: 8px;
    transform: rotate(225deg);
}

.form-element__label--primary {
    display: flex;
    justify-content: space-between;
}

.form-element__label--sublabel {
    text-transform: none;
}

.form-element__label--truncate {
    display: inline-block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.form-element__label--collapsible.form-element__label--truncate {
    padding-right: calc(var(--space) + var(--theme-form-collapsible-icon-size));
}

.form-element__label--secondary,
.form-element__label--row .form-element__sublabel {
    font: var(--theme-paragraph-10);
    color: var(--theme-sublabel-color);
    letter-spacing: var(--theme-paragraph-10-letter-spacing);
}

.form-element__label--collapsible .form-element__label--secondary {
    margin-right: var(--space-x3);
}

.form-text-option {
    display: flex;
    flex-flow: column;
    gap: var(--space-x2);
}

.form-text-option__inputs {
    display: flex;
    flex-flow: column;
    gap: var(--space);
}

