// Dependencies
@import "./bootstrap.less";
@import "./caret.less";
@import "./buttons.less";
@import "./react-select.less";

@import (css) "../../../node_modules/highlight.js/styles/github.css";
@import "palette.less";
@import "fontawesome.less";
@import "fonts.less";
@import "mms-icons.less";

// Configuration
@import "./palette.less";
@sidebar-width: 250px;

// Tweaks to bootstrap
@import "./message-background.less";

html, body {
  height: 100%;
  width: 100%;
  overflow: hidden;
  font-family: "Akzidenz", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: @gray1;
  -webkit-font-smoothing: antialiased;
}

* {
  user-select: text;
  -webkit-user-select: text;
}
// disable highlighting for most of the schema and document viewers
.schema-field-list *, .document-list * {
  user-select: none;
  -webkit-user-select: none;
}
// re-enable field names and individual documents
.schema-field-name > span, .document-property-body * {
  user-select: text;
  -webkit-user-select: text;
}

// make all help buttons consistent
i.help,
i.syntax-help {
  .fa-icon;
  margin: 0 5px;
  cursor: pointer;
  color: @gray5;

  &:hover {
    color: @alertOrange;
  }
  &:before {
    content: @fa-var-info-circle;
  }
}

.input-group.has-error {
  i.syntax-help {
    color: #a94442; // same color as bootstrap validation error borders
  }
}

//action-bar, just a drop-shadow for now but should think about where to put these styles eventually
.action-bar {
  height: 32px;
  background: @gray8;
  border-bottom: 1px solid @gray7;
  padding-top: 4px;
  padding-left: 15px;
}