/* Modernized site-wide flash alert banner (layouts/_errors.rhtml), rendered at the top of #content on every
   page for flash[:error] (action/validation failures) and flash[:info] (success confirmations). Not scoped to a
   .modernXPage wrapper since it lives in the base layout outside any single page's content -- scoped to
   #errorsContainer instead, which only ever wraps these two Bootstrap alerts. Overrides Bootstrap's flat default
   alert-danger/alert-success colors with the light-tint + left-border-accent callout style already used
   elsewhere (e.g. projected_results_modern.css's .ptfgAlert, scorecard_modern.css's .scorecardEmptyState). */

/* Full-width-below-800px/90%-above sizing lives in responsive_width_utility_modern.css. */
#errorsContainer .alert {
  border: none;
  border-radius: 8px;
  padding: 12px 40px 12px 16px;
  margin-top: 4px;
  margin-bottom: 10px;
  font-size: 14px;
  line-height: 1.6;
  box-shadow: none;
}

#errorsContainer .alert-danger {
  background: #fdecea;
  border-left: 4px solid #c30900;
  color: #7a1a10;
}

#errorsContainer .alert-success {
  background: #eaf7ec;
  border-left: 4px solid #0b6726;
  color: #1c4a28;
}

#errorsContainer .alert img {
  vertical-align: middle;
  margin-right: 4px;
}

#errorsContainer .close {
  color: inherit;
  opacity: 0.5;
  text-shadow: none;
  font-size: 20px;
}

#errorsContainer .close:hover,
#errorsContainer .close:focus {
  opacity: 0.9;
}