/*ErrorCard Style v0.0.3 Copyright 2025 anzhuo Team*/
/*By Cat in 24 Januray,17:10:48*/

/* 设置通知的基本样式 */
.error-notification {
  background-color: #f8d7da;
  padding: 10px;
  text-align: center;
  margin-bottom: 10px;
  display: none;
  position: relative; /* 确保动画效果正常 */
  opacity: 0; /* 初始状态透明 */
  transition: opacity 0.5s ease, margin-top 0.5s ease; /* 平滑过渡透明度和位置变化 */
}

/* 定义关键帧动画 */
@keyframes slideDown {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(0); }
}

/* 定义滑动回原位的关键帧动画 */
/*@keyframes slideUp {
  0% { transform: translateY(0); }
  100% { transform: translateY(-100%); }
}*/
/*敬告: 从v0.0.3开始，我们便不再使用此项，用于NoScript上。如果您实在需要，您可以取消注释。*/

/* 应用动画到通知上 */
.error-notification.active {
  display: block;
  animation: slideDown 0.5s ease forwards, slideUp 0.5s ease 3s forwards;
  z-index: 9;
  opacity: 1; /* 显示时完全不透明 */
}

/* 在动画结束后隐藏通知卡片 */
.error-notification.hidden {
  display: none;
}