.app-importer
  p strong
    font-weight: 400
    color: $lighter-blue

  .tabs
    +clearfix
    height: 220px
    width: 80%
    margin: 0 auto
    font-family: $condensed-font
    text-transform: uppercase
    font-size: 14px
    margin-bottom: 40px

  .tab-bar
    width: 25%
    height: 100%
    float: left
    > span
      display: block
      width: 100%
      text-align: right
      padding: 12px 20px
      box-sizing: border-box
      cursor: pointer
      transition: background 0.15s ease-out

      > span, > small
        position: relative
        top: 0px

      > small
        margin-right: 5px

  .selected-tab
    width: 75%
    height: 100%
    float: right

    textarea
      width: 100%
      height: 100%
      border-radius: 2px
      padding: 15px
      box-sizing: border-box
      font-family: $code-font
      font-size: 13px

      +placeholder
        color: hsl(0,0,70)

  .actions
    button
      width: 200px
      margin: 0 10px

.new-form .app-importer
  min-width: 590px
  padding: 0

  p
    line-height: 140%
    margin-bottom: 30px
    strong
      color: $darker-blue

  .tabs
    width: 100%

  .tab-bar
    background: hsl(0,0,96)

    > span
      border-bottom: 1px solid rgba(#000, 0.1)
      color: hsl(0,0,60)

      &.selected
        background: rgba($dark-blue, 0.15)
        color: $dark-blue

  .selected-tab > textarea
    border: 1px solid hsl(0,0,90)

