/**
  * @file
  * Site alerts region (not status messages).
  **/

.view-alerts .view-content {
  display: flex;
  justify-content: center;
  margin-right: 0;
  margin-left: 0;
  margin-top: 0;
}

.alert-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  justify-content: start;
  margin: var(--gutter-y) 0;
  border-bottom: 3px solid var(--laurier-gold);
  width: 100%;
  background-color: var(--grey);
  color: var(--black);
  font-size: 1.3em;
}

.alert-row .alert {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-content: center;
  justify-content: center;
  align-items: center;
  column-gap: 0.3em;
  row-gap: 0.3em;
  border-radius: 0;
  width: 100%;
  margin: 0;
  padding: 0 0 0.5rem 0;
}

.alert-row .fa-circle-exclamation {
  padding: 5px;
  margin: 5px;
  background-color: var(--laurier-gold);
  color: var(--white);
  font-family: "Font Awesome 6 Free";
  text-align: center;
}

.alert-row .alert-message {
  margin: 0 1rem;
  text-align: center;
}

/** Note: the class name alert-link is already taken by bootstrap **/
.alert-row .site-alert-link {
  margin: 0;
  text-align: center;
}