/* 温和双色通知样式 - 绿色和橙色 */

/* 登录成功通知 - 温和绿色（类似联系客服按钮） */
.notification-area .notification-item.success {
  background: linear-gradient(135deg, #34d399 0%, #10b981 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.3) !important;
  box-shadow: 0 4px 12px rgba(52, 211, 153, 0.25) !important;
}

.notification-area .notification-item.success .notification-title,
.notification-area .notification-item.success .notification-message {
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* 退出登录通知 - 温和橙色（参考封彩第二组背景色） */
.notification-area .notification-item.info {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%) !important;
  border: 1px solid rgba(251, 191, 36, 0.3) !important;
  box-shadow: 0 4px 12px rgba(251, 191, 36, 0.25) !important;
}

.notification-area .notification-item.info .notification-title,
.notification-area .notification-item.info .notification-message {
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* 错误通知 - 与封彩按钮相同的背景色 */
.notification-area .notification-item.error {
  background: #f59e0b !important;
  border: 1px solid rgba(245, 158, 11, 0.3) !important;
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3) !important;
}

.notification-area .notification-item.error .notification-title,
.notification-area .notification-item.error .notification-message {
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* 警告通知 - 温和橙色（参考封彩第二组背景色） */
.notification-area .notification-item.warning {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%) !important;
  border: 1px solid rgba(251, 191, 36, 0.3) !important;
  box-shadow: 0 4px 12px rgba(251, 191, 36, 0.25) !important;
}

.notification-area .notification-item.warning .notification-title,
.notification-area .notification-item.warning .notification-message {
  color: #ffffff !important;
  font-weight: 600 !important;
}