/* 提示条：浅底 + 左侧色条 + 图标；文字与底色对比度均 ≥ 6:1。 */
.alert {
  display: flex;
  gap: var(--距-3);
  padding: var(--距-3) var(--距-4);
  border: 1px solid;
  border-left-width: 3px;
  border-radius: var(--角-中);
  font-size: var(--字号-正文);
}

.alert > .icon {
  margin-top: 0.15rem;
}

.alert-body {
  display: grid;
  gap: var(--距-1);
  min-width: 0;
}

.alert-title {
  font-weight: var(--字重-粗);
}

.alert-id {
  font-size: var(--字号-小);
  overflow-wrap: anywhere;
}

.alert-id code {
  padding: 0 var(--距-1);
  border-radius: var(--角-小);
  background: rgb(255 255 255 / 0.6);
}

.alert-actions {
  margin-top: var(--距-1);
}

.alert a {
  color: inherit;
  font-weight: var(--字重-中);
}

.alert--success {
  background: var(--色-成功-浅);
  border-color: var(--色-成功-边);
  color: var(--色-成功-文字);
}

.alert--notice {
  background: var(--色-警示-浅);
  border-color: var(--色-警示-边);
  color: var(--色-警示-文字);
}

.alert--error {
  background: var(--色-危险-浅);
  border-color: var(--色-危险-边);
  color: var(--色-危险-文字);
}