$input = lighten($UI.colors.dark, 75%)
$thead = $UI.colors.darkLight
$header = $UI.colors.secondaryText
$darkHeader = $UI.colors.whiteLight
$value = $UI.colors.success
$type = $UI.colors.additional1

.input
  background-color white
  border-color $input
  border-width 1px
  padding 0 0.5u

.header
  font-size 12px
  letter-spacing 1px
  fontFamily('normal', 600)
  color $header
  &.right
    text-align right

.possibleValue
  flex-direction row

.value
  color $value
  font-style italic

.type
  color $type
  font-style italic

.dark
  &.header
    color $darkHeader
  &.value
    color lighten($value, 30%)
  &.type
    color lighten($type, 30%)

.checkbox
  align-self flex-end

.unsupported
  color $UI.colors.secondaryText
  text-align right

.separator
  color $UI.colors.darkLighter

.vCenter
  justify-content center

.required
  margin-top 0.5u
  align-self flex-start

.badJSON
  color: $UI.colors.error