@import '../../../../../../styles/core.scss';

.TutorialReview {
  background: #fff;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  flex: 0 1 auto;
  max-height: 100%;
  overflow: visible;

  &-Fieldset {
    border: 0;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    margin: 0;
    overflow: auto;
    padding: 10px;

    &_emojiPicker {
      overflow: visible;
    }

    &_endpoints {
      flex: 1 1 auto;
    }

    + .TutorialReview-Fieldset {
      border-top: 1px solid get(color 'ivory');
    }

    &-Header {
      flex: 0 0 auto;
    }

    &-Avatar {
      cursor: pointer;

      &_empty :global(.Avatar-Text) {
        transform: scale(0.5);
      }

      &_nobg {
        border: 1px solid get(color 'ivory');
      }
    }

    &-ClearWrapper {
      margin-top: -40px;
      padding-top: 40px;
    }

    &-Box {
      max-height: 325px;
      max-width: 312px;
      overflow-y: auto;
      padding: 5px;
    }

    &-Color {
      margin-left: 10px;
    }

    &-Label {
      font-size: 14px;
      font-weight: 600;
    }

    &-Input,
    &-Textarea {
      width: 100%;
    }

    &-Textarea {
      height: 120px;
    }
  }
}