/**
 * @file
 * Styles for system messages.
 *
 * These styles are from the Classy theme.
 */

.messages {
  margin: var(--spacing-md) auto;
  padding: var(--spacing-md) var(--spacing-lg) var(--spacing-md) var(--spacing-xl);
  word-wrap: break-word;
  border: 1px solid;
  border-width: 1px 1px 1px 0;
  border-radius: var(--border-radius-base);
  background: no-repeat var(--spacing-2xs) 21px;
  overflow-wrap: break-word;
}

.messages a {
  color: var(--color-black);
  text-decoration: underline;
  text-underline-offset: var(--underline-offset);
}

.messages a:hover {
  text-decoration: none;
}

[dir="rtl"] .messages {
  padding-right: var(--spacing-xl);
  padding-left: var(--spacing-lg);
  text-align: right;
  border-width: 1px 0 1px 1px;
  background-position: right var(--spacing-2xs) top 21px;
}

.messages+.messages {
  margin-top: var(--spacing-xl);
}

.messages__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.messages__item+.messages__item {
  margin-top: var(--spacing-xs);
}

.messages--status {
  color: var(--color-status-text);
  border-color: var(--color-status-border) var(--color-status-border) var(--color-status-border) transparent;
  background-color: var(--color-status-background);
  background-image: url(../../../../../core/misc/icons/73b355/check.svg);
  box-shadow: -8px 0 0 var(--color-status-shadow);
}

[dir="rtl"] .messages--status {
  margin-left: 0;
  border-color: var(--color-status-border) transparent var(--color-status-border) var(--color-status-border);
  box-shadow: 8px 0 0 var(--color-status-shadow);
}

.messages--warning {
  color: var(--color-warning-text);
  border-color: var(--color-warning-border) var(--color-warning-border) var(--color-warning-border) transparent;
  background-color: var(--color-warning-background);
  background-image: url(../../../../../core/misc/icons/e29700/warning.svg);
  box-shadow: -8px 0 0 var(--color-warning-shadow);
}

[dir="rtl"] .messages--warning {
  border-color: var(--color-warning-border) transparent var(--color-warning-border) var(--color-warning-border);
  box-shadow: 8px 0 0 var(--color-warning-shadow);
}

.messages--error {
  color: var(--color-error-text);
  border-color: var(--color-error-border) var(--color-error-border) var(--color-error-border) transparent;
  background-color: var(--color-error-background);
  background-image: url(../../../../../core/misc/icons/e32700/error.svg);
  box-shadow: -8px 0 0 var(--color-error-shadow);
}

[dir="rtl"] .messages--error {
  border-color: var(--color-error-border) transparent var(--color-error-border) var(--color-error-border);
  box-shadow: 8px 0 0 var(--color-error-shadow);
}

.messages--error p.error {
  color: var(--color-error-text);
}
