@import '~@ripedata/components/src/common';

.login {
  margin: 20px;

  &-instruction {
    @extend %text-chart;
    color: $color-black;
    margin-bottom: 10px;

    &-link {
      color: $color-orange;
      cursor: pointer;
    }
  }

  &-input {
    border-radius: 2;
    border: 2px solid $color-med-gray;
    box-shadow: unset;
    margin-bottom: 10px;
  }

  &-controls {
    padding-top: 10px;
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  &-button {
    flex: 1 1 0;
    margin: 0px;
  }

  &-lost {
    text-align: end;
    padding-right: 5px;
    @extend %text-chart;
  }

  &-error {
    margin-left: 10px;
    margin-right: 10px;
    @extend %text-chart;
    color: red;
    font-style: italic;
  }

}