@import "variables";

.fieldset
{
  border        : 1px solid $body-secondary-bg-dark;
  border-radius : 0.4rem;
  margin-bottom : 0.5rem;
  padding       : 1rem;
}

.legend
{
  margin-top    : -0.75rem;
  margin-left   : -0.5rem;

  margin-bottom : 0.5rem;
  font-size     : 1.20rem;
  font-weight   : $lead-font-weight;
}

// Read-only input
.form-control[readonly]
{
  background-color : $readonly-input-bg;
  color            : $readonly-input-color;
  font-weight      : $readonly-font-weight;

  :-moz-placeholder
  {
    color : $gray-300;
  }

  ::-webkit-input-placeholder
  {
    color : $gray-300;
  }

  :-ms-input-placeholder
  {
    color : $gray-300;
  }
}

// Allow only vertical resizing of text-areas.
textarea
{
  -moz-resize : vertical;
  -ms-resize  : vertical;
  -o-resize   : vertical;
  resize      : vertical;
}

// Standard form button sizes
.btn-std
{
  min-width  : 75px;
  min-height : 23px;

  &:not(first-child)
  {
    margin-left : 0.25rem;
  }
}

//---------------------------------------------------------------------------------------
//  Styles specif to Angular forms
//---------------------------------------------------------------------------------------

input.ng-valid:not( form ),
.ng-valid.required:not( form )
{
  border-left : 5px solid $success;
}

input.ng-invalid:not( form )
{
  border-left : 5px solid $danger;
}

textarea.ng-valid:not( form ),
.ng-valid.required:not( form )
{
  border-left : 5px solid $success;
}

textarea.ng-invalid:not( form )
{
  border-left : 5px solid $danger;
}

select.ng-valid:not( form ),
.ng-valid.required:not( form )
{
  border-left : 5px solid $success;
}

select.ng-invalid:not( form )
{
  border-left : 5px solid $danger;
}

// Elements that are marked as required (like the asterisk in labels)
label[required]::after,
label[data-required]::after
{
  color   : $red-600;
  content : " *"
}

//---------------------------------------------------------------------------------------
//  Custom styles for forms
//---------------------------------------------------------------------------------------

/* Cool glyph for calendar inputs */
form .input-group.date > span
{
  background-color : $primary;
  color            : $body-bg;
}

.dl-horizontal dd
{
  /*border: solid 1px red;*/
  -ms-word-break : break-all;
  word-break     : break-word;
}