.poised
  &.control
    padding 16px
    transition max-height ease-in-out 300ms, padding ease-in-out 300ms
    overflow hidden
    max-height 200px

    &.hidden
      max-height 0
      padding 0 16px

    .info
      position relative
      display table
      table-layout fixed
      width 100%

      label, .hint, .input
        display table-cell

      .hint
        width 20%

  &.linked-control
    width 100%
    margin 0

    .info
      display block

      label
        margin 16px 0
        display inline-block

    .info
    .control
      padding 0 16px

    .control
    .link
      display table-cell

    .link
      width 2%
      text-align center
      line-height 50px
      cursor pointer

    .control
      width 49%

      .textfield
        width 100%
        input
          width 100%
      .slider
        width 100%

  &.control
  &.linked-control
    &.invalid
      .info
        label
          color $foreground-invalid
        .hint
          float right
          width 24px

          &:before
            position absolute
            content "\f06a"
            font-family FontAwesome
            font-size 1em
            color $foreground-invalid
            margin-top 10px

        .textfield
          input
            holo-input-border($textfield-border-invalid)

  &.button-group
    margin 16px

    li
      padding 0 0.5em
      display table-cell
      width 1%
      border 0

      &:first-of-type
        padding-left 0
      &:last-of-type
        padding-right 0

      button
      input
        width 100%

  &.slider
    relative()
    $drag-handle-size = 20px
    $drag-bar-height = 2px
    $slider-margin = 25px
    height $drag-handle-size + 2*$slider-margin
    margin -10px 0
    cursor pointer

    .handle
      absolute $slider-margin none none 0
      margin-left -($drag-handle-size/2)
      width $drag-handle-size
      height $drag-handle-size
      border 5px solid lighten($header-background, 30%)
      border-radius 10px
      background-color $header-background
      cursor pointer

    .bar
      absolute ($slider-margin + $drag-handle-size / 2 - $drag-bar-height / 2)
      background-color lighten($header-background, 40%)
      height $drag-bar-height
      width 100%

  &.textfield
    relative()

    input
      z-layer 'textfield', 'input'

    abbr
      absolute none 8px 8px
      z-layer 'textfield', 'abbrev'