/**
 * @file
 * Styles for system messages.
 */

.messages {
  padding: 20px;
  word-wrap: break-word;
  color: inherit;
  overflow-wrap: break-word;
}
.messages__content {
  padding-inline-start: 24px;
  background-position-x: left;
  background-position-y: center;
}
[dir="rtl"] .messages__content {
  background-position-x: right;
}
.messages--status {
  background-color: #e6eee0;
}
.messages--warning {
  background-color: #fcf1d4;
}
.messages--error {
  background-color: #f9e6eb;
}
.messages--error .error {
  color: inherit;
}
.messages a {
  color: #cc2a00;
}
.messages__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.messages__item + .messages__item {
  margin-top: 0.769em;
}
.messages__wrapper {
  display: grid;
  gap: 1.538em;
}
.close-button {
  right: 1rem;
  top: 1rem;
  width: 3rem;
  height: 3rem;
  background-color: $white;
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  border-radius: 5000px;
  z-index: 9999;
}