/**
 * @file
 * Visual styles for messages.
 */

.message {
  --headingColor: var(--messageColor);
  --linkColor: var(--messageLinkColor);
  padding: var(--spacing05) var(--spacing07);
  word-wrap: break-word;
  color: var(--messageColor);
  border: 1px solid var(--grey);
  border-left-width: 4px;
  border-radius: 4px;
  background: var(--white) no-repeat 0.5rem 1.2rem;
  background-size: 1rem 1rem;
  overflow-wrap: break-word;
}

.message + .message {
  margin-top: var(--layout02);
}

.message__text {
  margin: 0;
  padding: 0;
}

.message__text + .message__text {
  margin-top: var(--layout02);
}

.message--status {
  border-left-color: var(--statusColor);
  background-image: url("images/check.svg");
}

.message--warning {
  border-left-color: var(--warningColor);
  background-image: url("images/warning.svg");
}

.message--error {
  border-left-color: var(--errorColor);
  background-image: url("images/error.svg");
}

.message--no-icon {
  background-image: none;
}