.quick-replies {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  .icon {
    cursor: pointer;
    width: 100%;
    height: 2.5em;
    &:before {
      position: relative;
      top: 0.75em;
    }
  }
  .last-button {
      display: flex;
      align-items: center;
      white-space: nowrap;
      .quick-reply {
        margin-right: 0.4em;
        white-space: normal;
      }
      .icon {
        width: unset;
        height: unset;
        &:before {
          top: unset;
        }
      }
  }
  > * {
    margin: 0.12em 0.25em;
  }
  padding: 0.12em;

  &.fluid {
    flex-direction: column;
    .quick-reply {
      max-width: unset;
      width: 100%;
    }
  }
}

.quick-reply {
  cursor: pointer;
  height: max-content;
  max-width: 250px;
  min-height: 2.5em;
  display: inline-block;
  border: solid 1.5px #2185d0;
  padding: 0.25em 0.75em;
  text-align: center;
  color: #2185d0;
  border-radius: 2rem;
  background: #ffffff;
  word-break: break-word;

  &.invalid {
    border: dotted  1.5px ;
    color: rgba(0, 0, 0, 0.4);
    background: transparent;
  }
}
.utterance-container {
    i.grey.icon.add-quick-reply {
      cursor: pointer;
      margin-top: 6px;
      color: rgba(0, 0, 0, 0.25) !important;
    }
  }

.response-button-editor {
  &.ui.grid>.row {
    padding-bottom: 0.4em;
  }

  .ui.selection.dropdown{
    min-width: 0;
  }

  .payload-title {
    font-size: .97857143em !important;
  }
}

.carousel {
  width: 100%;
  min-height: 250px;
  overflow-x: auto;
  display: flex;
}

.carousel-slide {
  max-width: 200px;
  min-width: 180px;
  margin: 5px 7.5px;
  padding: 8px;
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.1);

  &.blank {
    padding: auto 7.5px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .ui.header {
    margin: 1rem 0;
  }

  input, textarea {
    resize: none;
    border: 1px transparent solid;
    border-radius: 4px;
    width: 100%;
    font-family: @fontFamily;
    font-weight: bolder;
    outline: 0;
    &:hover, &:focus {
      border: 1px #ddd solid;
    }
  }

  .sub.header textarea {
    color: #666;
    font-weight: unset;
  }
}
