/**
 * Beacon 系统弹窗（toast）品牌化覆盖。
 *
 * 父主题 showAlert() 生成的弹窗挂在 #alert_placeholder 容器内，
 * 使用 vc-* 变量体系。这里仅在 .alert-system 作用域内映射配色，
 * 不影响页面其他使用 vc-* 的按钮、徽章与标签。
 *
 * 设计令牌：品牌橙 #fc4c02、深橙 #b83b00、危险红 #dc2626、
 * 深蓝面 #1c2140、系统无衬线字体栈。
 */

.alert-system {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.alert-system .alert-body {
  border-radius: 10px 0 0 10px;
}

/* 成功（验证码发送成功等）→ 品牌橙 */
.alert-system .alert-body.vc-blue {
  --this-color: #fff3ef;
  --this-hover-color: #ffffff;
  --this-bg: #fc4c02;
  --this-hover-bg: #e04502;
  --this-shadow-bg: rgba(252, 76, 2, 0.7);
}

/* 警告 → 深橙 */
.alert-system .alert-body.vc-yellow {
  --this-color: #fff3ef;
  --this-hover-color: #ffffff;
  --this-bg: #b83b00;
  --this-hover-bg: #9c3200;
  --this-shadow-bg: rgba(184, 59, 0, 0.7);
}

/* 错误 → 令牌危险红 */
.alert-system .alert-body.vc-red {
  --this-color: #ffeceb;
  --this-hover-color: #ffffff;
  --this-bg: #dc2626;
  --this-hover-bg: #c41f1f;
  --this-shadow-bg: rgba(220, 38, 38, 0.7);
}

/* 提示信息 → 深蓝面 */
.alert-system .alert-body.vc-violet {
  --this-color: #e6e8f5;
  --this-hover-color: #ffffff;
  --this-bg: #1c2140;
  --this-hover-bg: #252f50;
  --this-shadow-bg: rgba(28, 33, 64, 0.7);
}

/* 加载中 → 中性灰蓝 */
.alert-system .alert-body.vc-gray {
  --this-color: #eef1f6;
  --this-hover-color: #ffffff;
  --this-bg: #484848;
  --this-hover-bg: #3d4451;
  --this-shadow-bg: rgba(72, 72, 72, 0.7);
}