.entity-attribute-wrapper
  &.hidden
    visibility: hidden
    height: 0

    .entity-attribute
      margin: 0
      padding: 0

  &:last-of-type
    padding-bottom: 60px

.entity-attribute
  margin-top: 24px
  position: relative
  //min-height: grid-row(1) + 1px
  font-size: 1rem
  //line-height: grid-row(1)
  box-sizing: border-box

  label
    display: block
    width: 250px
    padding-left: 45px
    font-size: 0.7rem
    color: $light-gray
    text-transform: uppercase
    font-weight: $font-weight-bold
    white-space: nowrap

  &.error
    border: 1px solid $brand-danger
    label
      color: $brand-danger

  &.hidden
    display: none

  .content
    position: relative
    padding-left: 205px
    padding-right: grid-row(.5)
    line-height: grid-row(1)
    padding-top: grid-row(.5)
    padding-bottom: grid-row(.5)
    background-color: transparent
    border: 0
    display: block
    color: #5c5f65
    box-sizing: border-box

  .input-read-only
    text-indent: 205px
    font-size: 0.7rem
    color: $dark-gray
    opacity: 0.5
    user-select: none
    cursor: not-allowed

  input
    width: 100%
    min-height: 40px
    background-color: white
    text-indent: 10px
    font-size: 0.7rem
    margin-left: 45px
    border: 0
    z-index: 99999
    display: block
    color: $dark-gray
    box-sizing: border-box
    transition: border-color ease-in-out 0.25s, box-shadow ease-in-out 0.25s

    &[type='checkbox']
      margin-left: 0
      width: auto

  .explanation
    display: block
    padding: 10px 0
    color: #9ba0ae
    font-size: 0.7rem
    line-height: 1.2
    margin-left: 30px



@import "component"
@import "componentsArea"
@import "componentTabs"
@import "datePicker"
@import "documents"
@import "file"
@import "multiselect"
@import "number"
@import "link"
@import "onOffSwitch"
@import "password"
@import "select"
@import "seperator"
@import "text"
@import "textArea"
@import "title"
@import "view"
@import "video"