@import "compass/css3";
@import "compass/css3/border-radius";
@import "compass/css3/images";
@import "compass/css3/text-shadow";

@mixin hover-link {
  text-decoration: none;
  &:hover {
    text-decoration: underline;
  }
}

@mixin locomotive-link {
  a {
    @include hover-link;
    color: #1F82BC;
  }
}

@mixin default-input-style {
  padding: 4px 5px;

  color: #17171B;
  font-size: 14px;
  font-weight: bold;

  border: 1px solid #b5b7c4;
  @include background-image(linear-gradient(top, #f0f0f0, #f9f9f9 25%, #f9f9f9 25%, #ffffff 50%, #ffffff));
}

@mixin path-input-style {
  background: transparent;
  outline: none;

  margin: 0 5px;

  width: 30%;

  border: none;
  border-bottom: 1px solid #B5B7C4;

  color: #787A89;
  font-size: 14px;
}

@mixin editable {
  padding: 2px 25px 2px 6px;
  color: #1e1f26;
  outline: none;
  cursor: pointer;

  &:hover {
    text-decoration: none;
    background: #fffbe5 image-url("locomotive/form/pen.png") no-repeat right 5px;
    border-bottom: 1px dotted #efe4a5;
  }
}

@mixin label {
  display: inline-block;
  position: relative;

  background-color: #858585;
  @include border-radius(3px);
  padding: 1px 3px 2px;

  line-height: 16px;
  font-size: 11px;
  font-weight: bold;
  color: #fff;
  @include single-text-shadow(rgba(0, 0, 0, 0.6), 0px, -1px, 0px);
}