input, textarea
  font-family: $default-font
  color: $dark-text
  background: #fff
  border: 1px solid rgba(#000, 0.2)
  box-shadow: none
  font-size: 12px
  border-radius: 3px
  padding: 8px 10px
  box-shadow: inset 0px 0px 1px rgba(#000, 0.1)
  box-sizing: border-box

  +placeholder
    font-family: $default-font
    font-weight: 400
    color: hsl(0,0,65)

.prefixed-input
  position: relative
  > span
    display: inline-block
    background: hsl(0, 0, 92)
    height: 100%
    position: absolute
    box-sizing: border-box
    border: 1px solid rgba(#000, 0.08)
    border-right: none
    border-top-left-radius: 100px
    border-bottom-left-radius: 100px
    width: 35px
    text-align: center

    > img
      max-width: 16px
      max-height: 16px
      position: relative
      display: inline-block
      top: 50%
      transform: translateY(-50%)
      left: 1px

  input
    margin-left: 35px
    border-top-left-radius: 0px
    border-bottom-left-radius: 0px

form
  fieldset:not(:last-of-type)
    margin-bottom: 12px
    width: 100%

    input
      width: 100%

  input[type=text], input[type=password], input[type=email], textarea
    &[disabled]
      cursor: not-allowed
      outline: none
      background: hsl(0,0,96)

  radio[disabled], checkbox[disabled], select[disabled]
    cursor: not-allowed

  button, input[type=submit]
    width: 100%

    &:not([disabled]):hover
      background: $light-blue

    .small-loader
      position: relative
      top: 2px

  .msg
    margin-bottom: 20px
    color: rgba(#fff, 0.9)
    font-size: 14px
    line-height: 140%

form.object-form
  width: 100%
  box-sizing: border-box
  padding: 15px

  button
    background: $orange
    transition: opacity 0.15s ease-out, background 0.15s ease-out

    &:not([disabled]):hover
      background: darken(desaturate($orange, 5%), 5%)

    &[disabled]
      cursor: not-allowed
      opacity: 0.5

    &.secondary
      background: transparent
      border: 1px solid rgba(#000, 0.1)

      &:not([disabled]):hover
        background: rgba(#fff, 0.1)

  .full-select
    margin: 15px 0
    select
      width: 100%
      font-size: 12px
      color: hsl(0,0,30)

  .small-loader

.org-role-select
  +clearfix

  label
    display: inline
    float: left

  select
    float: right
    position: relative
    top: -1px

.org-admin-toggle
  +clearfix
  display: block
  padding: 10px
  border: 1px solid hsl(0,0,90)
  border-radius: 3px
  margin-bottom: 15px
  transition: background 0.2s ease-out

  > span
    font-family: $condensed-font
    font-weight: 500
    font-size: 13px
    text-transform: uppercase
    color: hsl(0,0,70)

    em
      color: rgba($light-blue, 0.8)

  > input
    float: right
    font-size: 16px

  > small
    display: block
    color: hsl(0,0,65)
    font-size: 11.5px
    margin-top: 10px

  &, *
    cursor: pointer

  &:hover
    background: rgba($light-blue, 0.025)
    > span
      color: hsl(0,0,65)

      em
        color: rgba($light-blue, 0.9)

    > small
      color: hsl(0,0,70)

  &.selected, &.selected:hover
    background: rgba($light-blue, 0.075)
    > span
      color: hsl(0,0,60)

      em
        color: rgba($light-blue, 1)

    > small
      color: hsl(0,0,65)

.new-page .new-form
  width: 300px

form .radio-opts
  label
    +clearfix
    display: block
    margin-bottom: 10px
    line-height: 100%
    padding: 7.5px 15px
    text-align: left
    cursor: pointer

    input
      width: auto
      display: inline-block
      cursor: pointer

    > strong
      display: inline-block
      float: right

