.error {
  .form-input {
    background-color: #FFE7E7;
  }

  .error-label {
    display: block;
    position: absolute;
    background-color: #EF4040;
    color: #fff;
    top: 0;
    right: 0;
    margin-top: -28px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    font-size: 12px;
    padding: 0 10px;
    line-height: 28px;

    &::after {
      position: absolute;
      content: '';
      background-image: url(data:image/svg+xml,%3Csvg%20width%3D%227%22%20height%3D%225%22%20viewBox%3D%220%200%207%205%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ctitle%3ETriangle%2017%3C%2Ftitle%3E%3Cpath%20d%3D%22M3.5%205L7%200H0%22%20fill%3D%22%23EF4040%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E);
      width: 7px;
      height: 5px;
      bottom: 0;
      right: 15px;
      margin-bottom: -5px;
    }
  }
}

.error-label {
  display: none;
}