@import '@/styles/common.less';
@import '@/styles/variables.less';

.join-group-hint {
  .flex-row();
  background: #FFFFFF;
  border-radius: 16px;
  padding: 32px 24px;
  margin-top: 24px;
  margin-bottom: 24px;

  &__icon {
    width: 80px;
    height: 80px;
    margin-right: 32px;
  }

  &__left {
    flex: 1;
    padding-left: 8px;
    &-title {
      font-weight: 500;
      font-size: 32px;
      line-height: 40px;
      margin-bottom: 16px;
    }
    &-desc {
      font-weight: 400;
      font-size: 28px;
      line-height: 40px;
    }
  }

  &__right {
    flex: 0 0 auto;
  }

  &__button {
    .button(@width: 186px, @height: 64px, @fontSize: 28px, @fontWeight: 400, @borderRadius: 32px, @highlight: 0);
  }
}