//
// Angular Xeditable
// --------------------------------------------------

.editable {
  &-wrap {
    display: inline-block;
    white-space: nowrap;
    margin: 0;

    .editable-controls,
    .editable-error {
      margin-bottom: 0;
    }

    .editable-controls {
      & > input,
      & > select,
      & > textarea {
        margin-bottom: 0;
      }
    }

    .editable-input {
      display: inline-block;
    }
  }

  &-buttons {
    display: inline-block;
    vertical-align: top;

    button {
      margin-left: $grid-unit-x;
    }
  }

  &-input {
    &.editable-has-buttons {
      width: auto;
    }
  }

  &-range output {
    display: inline-block;
    min-width: $grid-unit-x * 4;
    vertical-align: top;
    text-align: center;
  }

  &-hide {
    display: none !important;
  }
}