// Component settings: Form feedback
// ------------------------------------------

$c-form-feedback: (
  'color':		palette(neutral, 800),
  'bgcolor':	rgba(palette(feedback, warning), 0.2),
  'border': 	palette(feedback, warning),
);

// ------------------------------------------


.c-form-feedback {
  @include font-size(s);
  @include border-radius(s);
  margin: 0 0 space(1);
  padding: space(3) space(4);
  color: map-get($c-form-feedback, 'color');
  background-color: map-get($c-form-feedback, 'bgcolor');
  border: 1px solid map-get($c-form-feedback, 'border');

  &:not(:empty) {
    display: block;
  }

  &:before{
    content: attr(data-feedback);
    display: inline-block;
    margin-left: space(-2);
    margin-bottom: space(1);
    font-weight: 500;
  }

  li::first-letter {
    text-transform: uppercase;
  }
}