.richtext {
  padding-top: 10px;
  border-top: 1px solid $background;

  .DraftEditor-root {
    min-height: 350px;
    max-height: 350px;
    overflow-y: auto;
  }

  &-toolbar {
    padding-bottom: 20px;
    margin: 0 -0.75rem;

    &-btn {
      color: $text-gray;
      font-weight: 400;

      &-active,
      &:hover {
        color: $soft-blue;
      }

      &-bold {
        font-weight: 700;
      }

      &-italic {
        font-style: italic;
      }

      &-underline {
        text-decoration: underline;
      }

      &-header-two,
      &-header-three,
      &-header-four {
        font-weight: 700;
      }

      &-blockquote {

        &::before {
          content: '“';
        }

        &::after {
          content: '”';
        }
      }

      &-unordered-list-item {

        &::before {
          content: '';
          display: inline-block;
          line-height: 1;
          height: 4px;
          width: 4px;
          border-radius: 50%;
          background-color: $text-gray;
          position: relative;
          top: -8px;
          left: -2px;
        }
      }

      &-ordered-list-item {

        &::before {
          content: '123';
          font-size: 8px;
          display: inline-block;
          line-height: 1;
          height: 10px;
          position: relative;
          top: -8px;
        }
      }

      &-code-block {

        &::before {
          content: '<'
        }

        &::after {
          content: '/>'
        }
      }

      &-image-upload {

        input {
          display: none;
        }
      }
    }
  }

  pre {
    padding: 10px;
    border-radius: 3px;
    background-color: lighten($background, 2%);

    pre {
      margin: 0;
      padding: 0;
    }
  }

  blockquote {
    padding: 10px;
    border-left: 3px solid $background;
  }
}
