// ============================================================================
// :: New Account
// ============================================================================
/**
 * Component which builds upon the card molecule, adding extra content & modifiers to show a new account.
 */

// ============================================================================
// :: Root
// ============================================================================
// .m-new-account {}

// ============================================================================
// :: Elements
// ============================================================================

.m-new-account__intro {
  color: $text-color-medium;

  @include respond-at($breakpoint-tablet-default) {
    font-size: $font-size-base;
    line-height: $line-height-base;
  }
}

.m-new-account__list {
  text-align: left;
}

.m-new-account__rate {
  margin: 1rem 0;

  color: $primary-color-base;

  @include respond-at($breakpoint-tablet-default) {
    margin: 2rem 0;
  }
}

.m-new-account__perc {
  font-weight: $font-weight-light;
}

.m-new-account__toggle {
  margin-top: 2rem;
  display: flex;

  > * {
    width: 100%;

    &:not(:last-child) {
      margin-right: 2rem;
    }
  }
}