.sl-popup-messages {
  position: absolute;
  right: 50%;
  width: 30%;
  transform: translateX(50%);
}
.sl-popup-message {
  margin: 6px 0px;
  display: flex;
  padding: 12px;
  align-self: center;
  gap: 16px;
  width: 100%;
  align-items: flex-start;
  border-radius: 4px;
  font-weight: bold;
  background-color: white;
  z-index: 1001;
  position: relative;
  top: 0px;
  transition: transform 300ms, opacity 300ms;
  color: black;
}
.sl-popup-message .text {
  width: 100%;
}
.sl-popup-message.open {
  transform: translateY(0%);
  opacity: 1;
}
.sl-popup-message.closed {
  transform: translateY(-100%);
  opacity: 0;
}
.sl-popup-message.warning {
  border: solid orange 2px;
  height: unset;
  min-height: unset;
  max-height: unset;
}
.sl-popup-message.warning .icon-message-type {
  color: orange;
}
.sl-popup-message.error {
  border: solid red 2px;
  height: unset;
  min-height: unset;
  max-height: unset;
}
.sl-popup-message.error .icon-message-type {
  color: red;
}
.sl-popup-message.info {
  border: solid blue 2px;
  height: unset;
  min-height: unset;
  max-height: unset;
}
.sl-popup-message.info .icon-message-type {
  color: blue;
}
.sl-popup-message .icon {
  font-size: 24px;
}
.sl-popup-message .icon.clickable {
  color: grey;
}