.horizontal {
  --gap: var(--spacing-sm);
}

.horizontal[data-size='sm'] {
  --gap: var(--spacing-xs);
}

.labelContainer {
  gap: var(--gap);
}

.label {
  color: var(--color-fg-default);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
}

.horizontal .errorText,
.horizontal .helpText {
  margin-left: calc(var(--label-width) + var(--gap));
}

.helpText {
  color: var(--color-fg-subtle);
  font-size: var(--font-size-sm);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.helpTextAddition {
  color: var(--color-fg-subtle);
}

.horizontal label {
  width: var(--label-width);
}

.errorText {
  color: var(--color-status-error);
  font-size: var(--font-size-sm);
}

.required {
  color: var(--color-status-error);
  font-weight: bold;
}

.messageRow {
  min-height: 1lh;
}