import { styled, Text } from 'tamagui'

// Form field text primitives — the repeated "label / helper / error" Text
// variants used across settings forms and auth screens. Each reads from a
// semantic token so the colours re-tint automatically on theme switch, and
// the sizes resolve through the Halflight type ramp (see `tamagui.config.ts`)
// so changing "what a field label looks like" is a one-line edit there.

export const FieldLabel = styled(Text, {
  name: 'FieldLabel',
  fontSize: '$label',
  color: '$colorTertiary',
})

export const FieldHelperText = styled(Text, {
  name: 'FieldHelperText',
  fontSize: '$helper',
  color: '$colorTertiary',
})

export const FieldErrorText = styled(Text, {
  name: 'FieldErrorText',
  fontSize: '$error',
  color: '$colorDanger',
})

// Standard "title" text for detail/description cards — e.g. the "Contains
// Sensitive Media" heading on the post/edit sensitive card, or the row
// headings in settings/appearance. Paired with FieldHelperText for the
// secondary line.
export const FieldTitle = styled(Text, {
  name: 'FieldTitle',
  fontSize: '$title',
  fontWeight: 'bold',
  color: '$color',
})
