// input fields
// ------------------------------------------------------------
%input_fields {
  @include input_fields;
}

// disabled input fields
// ------------------------------------------------------------
%disabled_inputs {
  background-color: $input_disabled_bkg;
  border-color: $input_disabled_border;
  color: $input_disabled_text;
  &:hover {
    border-color: $input_disabled_border;
  }
}

// form labels 
// ------------------------------------------------------------
%form_labels {
  display: block;
  font-weight: bold;
  line-height: em(20);
  span {
    padding-left: .25em;
    font-weight: normal;
  }
  fieldset & {
    @include grid(12,12, $grid_uom:percent);
  }
}

// default error
// ------------------------------------------------------------
%fail {
  border-color: $form_field_border_fail !important;
  color: $form_field_text_fail !important;
  input & {
    background: $form_field_fail_bkg;
  }
  &:focus {
    background: $form_field_fail_bkg !important;
  }
  select, input[type="text"], input[type="date"] {
    background: $form_field_fail_bkg;
    border-color: $form_field_border_fail;
    color: $form_field_text_fail;
    @include input_placeholder($form_field_text_fail);
    &:focus {
      background: $form_field_fail_bkg;
    }
  }
  &:after {
    background: $form_field_fail_bkg;
    border-color: $form_field_border_fail;
  }
}

// notification alerts / panels 
// ------------------------------------------------------------
%default_alert_panel {
  @include alert_boxes ($alert_background_color, 10, 14, 10);
}

%notification_panel {
  @extend %default_alert_panel;
}

%alert_panel {
  @extend %default_alert_panel;
  background: $alpha_color;
  color: $white;
  font-weight: bold;
}

// form text 
// ------------------------------------------------------------
%instructional {
  color: $instructional_text;
}

%note {
  @extend %instructional;
  @include small;
  margin-top: #{5 / $em}em;
}

%informational {
  @extend %instructional;
  line-height: 1.3em;
  margin-bottom: 1em;
}