.wrap {
  @include outer_shadow();
  padding: $gap;
  background: $content_bg;

  textarea {
    padding-bottom: 0 !important;
  }
}

.content {
  @include inner_shadow();
  background: $input_bg_color;
  border-radius: $input_radius;
}

.buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  padding: 0 $gap / 2 $gap / 2 $gap / 2;
  border-radius: 0 0 $radius $radius;

  :global(.loader-circle) {
    svg {
      fill: $wisegreen;
    }
  }
}

.error {
  position: absolute;
  top: 100%;
  padding: 10px;
  left: 5%;
  width: 90%;
  background: linear-gradient($red, transparentize($red, 0.1));
  z-index: 1;
  box-sizing: border-box;
  text-align: center;
  border-radius: 0 0 $radius $radius;
}

.loader {
  position: absolute;
  right: 50%;
  bottom: 0;
  z-index: 2;
  padding: $gap;
  text-transform: uppercase;
  background: $wisegreen;
  border-radius: $radius;
  transform: translate(50%, -10px);

  svg {
    fill: white;
  }
}