//ms2form form
$well-bg: #f5f5f5 !default
$body-bg: #fff !default
$has-error: #a94442 !default


.has-error
  textarea
    border: 1px solid  $has-error !important

#ms2form
  position: relative
  #question
    position: absolute
    top: 10px
    right: 20px
    font-size: 20px
    cursor: pointer
    display: block
    z-index: 10
  .form-group
    position: relative

.md-editor
  display: block
  border: 1px solid #dddddd
  > .md-header, .md-footer
    display: block
    padding: 6px 4px
    background: white
  >
    .md-header
      margin: 0
      .btn-default
        padding: 8px 10px 9px 10px
    .md-preview
      padding: 12px
      background-color: $well-bg
      border-top: 1px dashed #ddd
      border-bottom: 1px dashed #ddd
      min-height: 10px
      overflow: auto
    textarea
      min-height: 300px
      border: 0
      padding: 12px
      border-top: 1px dashed #ddd
      background: $body-bg
      &:focus
        box-shadow: none
        background: white
      &.a ctive
        border-color: #66afe9
        outline: 0
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6)
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075)


/* Messages

.tickets-message-success
  background-color: green !important

.tickets-message-error
  background-color: brown !important

.tickets-message-info
  background-color: black !important

/* Form files

#ticket-files-container
  margin-top: 10px

#ticket-files-select
  font-weight: bold

#ticket-files-progress, #ticket-files-list .ticket-file-template
  display: none

#ticket-files-progress-percent
  float: right

#ticket-files-progress-bar
  height: 1.5em
  background: lightblue
  margin-top: 5px
  width: 0

.clearfix
  clear: both

#ticket-files-list
  padding: 10px 0
  background: #fff
  border: 1px solid #ccc
  border-radius: 5px
  min-height: 50px
  .note
    color: #ccc
    margin-left: 10px
  .ticket-file
    width: 120px
    float: left
    margin: 5px 0 5px 10px
    outline: 1px solid #efefef
  .ticket-file-image-wrapper
    width: 120px
    height: 90px
    overflow: hidden
  .ticket-file-image
    width: 120px
    border: 1px solid #efefef
  .ticket-file-size
    color: #777
    float: right
  &.droppable
    border-width: 3px
    border-style: dashed
  &.dragover
    border-color: darkgreen
  .ticket-file-meta
    font-size: .8em
    padding: 0 5px
  .ticket-file
    &.new
      outline-color: lightblue
    &.deleted
      outline-color: darkred
    .ticket-file-restore
      color: darkgreen
    .ticket-file-delete
      color: darkred
    .ticket-file-restore
      display: none
    &.deleted
      .ticket-file-delete
        display: none
      .ticket-file-restore
        display: inline

//mse2form
.mse2-ac-wrapper
  font-size: 12px
  padding: 2px 5px

.mse2-ac-link
  padding: 0 !important
  font-size: 12px
  border: 1px solid transparent
  border-bottom-color: #efefef

.mse2-ac-wrapper:last-child .mse2-ac-link
  border-color: transparent

.mse2-ac-link.ui-state-focus
  background-image: none !important
  border-color: transparent !important
  margin: 0 !important

.mse2-ac-item
  padding: 2px 5px
  &:hover
    cursor: pointer
  .mse2-ac-weight
    display: inline-block
    float: right

.form-group .input-sm
  width: 50%
  display: inline-block

.ui-autocomplete-loading
  background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat

/*.ui-autocomplete {height: 200px;overflow: auto;}

.quill-wrapper
  background-color: #fff
  border-left: 1px solid #ccc
  border-right: 1px solid #ccc
  box-shadow: 0px 0px 10px #ccc
  min-width: 320px
  width: 100%
  .toolbar
    border-bottom: 1px solid #ccc
    border-top: 1px solid #ccc
  .editor
    height: auto !important
    .ql-editor
      min-height: 300px