/**
 * Prelogin Notification Styles
 * 
 * Styles for announcement/notification boxes displayed on the pre-login page.
 * Supports multiple severity levels: informational, warning, and critical.
 */

.prelogin-notifications-wrapper {
  margin-bottom: 14px;
}

.prelogin-notification-box {
  position: relative;
  border-radius: 6px;
  padding: 14px 40px 12px 50px;
  margin-bottom: 10px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}

.prelogin-notification-box--informational {
  border: 2px solid #03A9F4;
  background: linear-gradient(to bottom, #81D4FA 0%, #E1F5FE 100%);
  color: #01579B;
}

.prelogin-notification-box--warning {
  border: 2px solid #F59E0B;
  background: linear-gradient(to bottom, #FCD34D 0%, #FEF3C7 100%);
  color: #78350F;
}

.prelogin-notification-box--critical {
  border: 2px solid #991B1B;
  background: linear-gradient(to bottom, #DB4F4F 0%, #FCEDED 100%);
  color: #7F1D1D;
}

.prelogin-notification-icon {
  position: absolute;
  top: 14px;
  left: 14px;
  font-size: 1.3rem;
}

.prelogin-notification-item + .prelogin-notification-item {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(0, 0, 0, 0.15);
}

.prelogin-notification-title {
  margin: 0 0 6px 0;
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.25;
}

.prelogin-notification-description {
  margin: 0;
  line-height: 1.4;
  word-break: break-word;
}

.prelogin-notification-close {
  position: absolute;
  top: 8px;
  right: 10px;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1;
  padding: 0;
  cursor: pointer;
  opacity: 0.7;
}

.prelogin-notification-close:hover {
  opacity: 1;
}

.prelogin-notification-close:focus {
  outline: 2px solid currentColor;
  outline-offset: 1px;
}