/**
 * 左侧圆角竖条（pill）+ 浅底 + 深字 — 用于 Dtoast、表单行内错误等（样品页 S07.2 / 图二）
 * 用法：引入本文件后使用下方 HTML 结构；与 S07.1「整块深色前导条+图标」是两种视觉层级。
 */
.sanxio-alert-rail {
	position: relative;
	box-sizing: border-box;
	border-radius: 10px;
	padding: 12px 16px 12px 26px;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.45;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	word-break: break-word;
}

.sanxio-alert-rail::before {
	content: "";
	position: absolute;
	left: 10px;
	top: 10px;
	bottom: 10px;
	width: 6px;
	border-radius: 999px;
	pointer-events: none;
}

/* 错误（红）— 样品页 S07.2 / 资料页行内错误（略偏粉浅底） */
.sanxio-alert-rail--error {
	background: #fee8e8;
	color: #991b1b;
}

.sanxio-alert-rail--error::before {
	background: #dc2626;
}

/* 可选：成功 / 信息 / 警告，便于同一结构扩展 */
.sanxio-alert-rail--success {
	background: #dcfce7;
	color: #166534;
}

.sanxio-alert-rail--success::before {
	background: #16a34a;
}

.sanxio-alert-rail--info {
	background: #e0f2fe;
	color: #075985;
}

.sanxio-alert-rail--info::before {
	background: #0284c7;
}

.sanxio-alert-rail--warning {
	background: #fef9c3;
	color: #854d0e;
}

.sanxio-alert-rail--warning::before {
	background: #ca8a04;
}