@import '../../lib/commonStyles/colors.scss';

.inviteBox {
  flex-shrink: 0;
  padding: 5px 16px 16px 16px;
  background-color: transparent;
  box-shadow: none;
  &.noCheckbox {
    padding-top: 16px;
  }
}

.withShadow {
  border-top: 1px solid rc-palette('neutral', 'l02');
  position: relative;
  background-color: $snow;
}

.onlyButton {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  margin-top: -20px;
}

.button {
  outline: none;
  border: none;
  background-color: $primary-color;
  width: 100%;
  height: 35px;
  line-height: 35px;
  border-radius: 17.5px;
  text-align: center;
  /*
    Reason of important
    According to the current Button style design, we can't ensure this attribute will cover  Button component origin style.
    We added important here.
  */
  color: $snow !important;
  font-size: 13px;
  &:hover {
    color: $silver !important;
  }
}

.disabled {
  background-color: $silver;
  &:hover {
    color: $snow !important;
  }
}

.actionPrompt {
  color: #212121;
  font-size: 14px;
  text-align: left;
  // top: 65px;
  margin-top: -63px;
  position: absolute;
  line-height: 24px;
  padding: 0 20px;
  // font-weight: bold;
  left: 0;
  span {
    font-size: 13px;
    color: #616161;
    line-height: 20px;
    font-weight: normal;
    display: block;
    margin-top: 16px;
  }
}

.notShowAgain {
  margin-bottom: 10px;
}