/* 铆接兔 RMA 售后工单 - 前台样式 */

.rivrab-rma-wrap {
	max-width: 1100px;
	margin: 0 auto;
}

.rivrab-rma-title {
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 14px;
}

.rivrab-rma-back {
	margin: 0 0 14px;
	font-size: 13px;
}

.rivrab-rma-message,
.rivrab-rma-error {
	padding: 10px 14px;
	border-radius: 4px;
	margin-bottom: 16px;
	font-size: 14px;
}

.rivrab-rma-message {
	background: #f6ffed;
	border: 1px solid #b7eb8f;
	color: #389e0d;
}

.rivrab-rma-error {
	background: #fff1f0;
	border: 1px solid #ffa39e;
	color: #cf1322;
}

/* 空状态 */
.rivrab-rma-empty {
	background: #fafafa;
	border: 1px solid #eee;
	border-radius: 6px;
	padding: 32px 20px;
	text-align: center;
	color: #666;
	font-size: 14px;
}

/* 状态徽标 */
.rivrab-rma-badge {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 3px;
	font-size: 12px;
	white-space: nowrap;
}

/* 列表表头 */
.rivrab-rma-thead {
	display: flex;
	align-items: stretch;
	background: #f7f7f7;
	border: 1px solid #eee;
	border-radius: 6px 6px 0 0;
	font-size: 13px;
	color: #666;
	font-weight: 500;
}

.rivrab-rma-thead .col-product {
	flex: 1 1 auto;
	padding: 12px 16px;
	text-align: left;
}

.rivrab-rma-thead .col-qty,
.rivrab-rma-thead .col-amount,
.rivrab-rma-thead .col-status,
.rivrab-rma-thead .col-action {
	flex: 0 0 130px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 12px 8px;
	text-align: center;
	border-left: 1px solid #eee;
}

/* 工单卡片 */
.rivrab-rma-card {
	background: #fff;
	border: 1px solid #eee;
	border-top: none;
}

.rivrab-rma-card:last-of-type {
	border-radius: 0 0 6px 6px;
}

.rivrab-rma-card-head {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	padding: 10px 16px;
	background: #fafafa;
	border-bottom: 1px solid #eee;
	font-size: 13px;
	color: #666;
}

.rivrab-rma-card-head .rivrab-rma-no {
	color: #333;
	font-weight: 500;
}

.rivrab-rma-card-body {
	display: flex;
	align-items: stretch;
}

.rivrab-rma-products {
	flex: 1 1 auto;
	min-width: 0;
}

.rivrab-rma-product {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 130px;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	border-bottom: 1px dashed #f0f0f0;
}

.rivrab-rma-product:last-child {
	border-bottom: none;
}

.rivrab-rma-product strong {
	display: block;
	font-size: 14px;
	font-weight: 500;
	color: #333;
	margin-bottom: 3px;
}

.rivrab-rma-attrs,
.rivrab-rma-spec,
.rivrab-rma-sku {
	margin: 0;
	font-size: 12px;
	color: #888;
	line-height: 1.5;
}

.rivrab-rma-product .col-qty {
	font-size: 13px;
	color: #333;
	text-align: center;
}

.rivrab-rma-unit {
	display: block;
	font-size: 12px;
	color: #999;
	margin-top: 2px;
}

.rivrab-rma-meta {
	flex: 0 0 390px;
	display: flex;
	border-left: 1px solid #eee;
}

.rivrab-rma-meta > div {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 12px 8px;
	border-right: 1px solid #f0f0f0;
	text-align: center;
}

.rivrab-rma-meta > div:last-child {
	border-right: none;
}

.rivrab-rma-amount {
	font-size: 15px;
	font-weight: 600;
	color: #333;
}

.rivrab-rma-qty-total {
	font-size: 12px;
	color: #999;
}

.rivrab-rma-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 6px 14px;
	border: 1px solid #0066cc;
	border-radius: 4px;
	color: #0066cc;
	font-size: 13px;
	text-decoration: none;
}

.rivrab-rma-btn:hover {
	background: #0066cc;
	color: #fff;
}

.rivrab-rma-card-foot {
	padding: 10px 16px;
	border-top: 1px dashed #f0f0f0;
}

/* 步骤条 */
.rivrab-rma-steps {
	display: flex;
	align-items: center;
	gap: 0;
	flex-wrap: wrap;
	font-size: 12px;
	color: #bbb;
}

.rivrab-rma-steps .rivrab-rma-step {
	display: inline-flex;
	align-items: center;
	color: #bbb;
}

.rivrab-rma-steps .rivrab-rma-step i {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #e0e0e0;
	margin-right: 6px;
}

.rivrab-rma-steps .rivrab-rma-step:not(:last-child)::after {
	content: "";
	display: inline-block;
	width: 28px;
	height: 1px;
	background: #e0e0e0;
	margin: 0 10px;
}

.rivrab-rma-steps .rivrab-rma-step.is-done {
	color: #52c41a;
}

.rivrab-rma-steps .rivrab-rma-step.is-done i {
	background: #52c41a;
}

.rivrab-rma-steps .rivrab-rma-step.is-current {
	color: #0066cc;
	font-weight: 600;
}

.rivrab-rma-steps .rivrab-rma-step.is-current i {
	background: #0066cc;
	box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.15);
}

.rivrab-rma-steps.is-rejected .rivrab-rma-step.is-rejected {
	color: #cf1322;
	font-weight: 600;
}

.rivrab-rma-reject-reason {
	margin-left: 10px;
	font-style: normal;
	color: #cf1322;
	font-size: 12px;
}

/* 分页 */
.rivrab-rma-pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 14px;
	margin-top: 18px;
	font-size: 13px;
	color: #666;
}

/* 申请表单 */
.rivrab-rma-order-info {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	font-size: 13px;
	color: #666;
	background: #fafafa;
	border: 1px solid #eee;
	border-radius: 6px;
	padding: 12px 16px;
	margin-bottom: 18px;
}

.rivrab-rma-tip {
	color: #d46b08;
}

.rivrab-rma-field {
	margin-bottom: 20px;
}

.rivrab-rma-label {
	display: block;
	font-size: 14px;
	font-weight: 500;
	color: #333;
	margin-bottom: 8px;
}

.rivrab-rma-label .required {
	color: #ff4d4f;
}

.rivrab-rma-radios label {
	margin-right: 22px;
	font-size: 14px;
	color: #333;
	cursor: pointer;
}

.rivrab-rma-form select,
.rivrab-rma-form textarea {
	width: 100%;
	max-width: 560px;
	padding: 8px 12px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 14px;
}

.rivrab-rma-shipnote {
	background: #fffbe6;
	border: 1px solid #ffe58f;
	border-radius: 4px;
	padding: 10px 14px;
	font-size: 13px;
	color: #874d00;
	margin-bottom: 20px;
}

/* 商品选择表 */
.rivrab-rma-items {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.rivrab-rma-items th,
.rivrab-rma-items td {
	border: 1px solid #eee;
	padding: 10px 12px;
	text-align: left;
	vertical-align: middle;
}

.rivrab-rma-items thead th {
	background: #f7f7f7;
	color: #666;
	font-weight: 500;
	text-align: center;
}

.rivrab-rma-items thead th.col-product {
	text-align: left;
}

.rivrab-rma-items .col-pick,
.rivrab-rma-items .col-price,
.rivrab-rma-items .col-bought,
.rivrab-rma-items .col-qty,
.rivrab-rma-items .col-subtotal {
	text-align: center;
	white-space: nowrap;
}

.rivrab-rma-items input[type="number"] {
	width: 80px;
	padding: 6px 8px;
	border: 1px solid #ddd;
	border-radius: 4px;
	text-align: center;
}

.rivrab-rma-items input[type="number"]:disabled {
	background: #f5f5f5;
	color: #bbb;
}

/* 图片上传 */
.rivrab-rma-uploader {
	display: flex;
	align-items: center;
	gap: 14px;
}

.rivrab-rma-upload-btn {
	display: inline-block;
	padding: 8px 18px;
	border: 1px dashed #0066cc;
	border-radius: 4px;
	color: #0066cc;
	font-size: 13px;
	cursor: pointer;
	background: #f7fbff;
}

.rivrab-rma-upload-tip {
	font-size: 12px;
	color: #999;
}

.rivrab-rma-previews {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 12px;
}

.rivrab-rma-preview {
	position: relative;
	width: 88px;
	height: 88px;
	border: 1px solid #eee;
	border-radius: 4px;
	overflow: hidden;
}

.rivrab-rma-preview img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rivrab-rma-preview .rivrab-rma-remove {
	position: absolute;
	top: 2px;
	right: 2px;
	width: 18px;
	height: 18px;
	line-height: 16px;
	text-align: center;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.6);
	color: #fff;
	font-size: 12px;
	cursor: pointer;
}

.rivrab-rma-preview.is-loading::after {
	content: "…";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.75);
	color: #0066cc;
	font-size: 18px;
}

.rivrab-rma-actions {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-top: 6px;
}

.rivrab-rma-submit {
	padding: 10px 30px;
	background: #0066cc;
	color: #fff;
	border: none;
	border-radius: 4px;
	font-size: 15px;
	cursor: pointer;
}

.rivrab-rma-submit:hover {
	background: #0055aa;
}

.rivrab-rma-cancel {
	font-size: 14px;
	color: #666;
	text-decoration: none;
}

/* 工单详情 */
.rivrab-rma-detail-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	font-size: 13px;
	color: #666;
	margin-bottom: 14px;
}

.rivrab-rma-detail-steps {
	padding: 14px 16px;
	background: #fafafa;
	border: 1px solid #eee;
	border-radius: 6px;
	margin-bottom: 20px;
}

.rivrab-rma-section-title {
	font-size: 15px;
	font-weight: 600;
	margin: 22px 0 10px;
	color: #333;
}

.rivrab-rma-address-box {
	background: #fffbe6;
	border: 1px solid #ffe58f;
	border-radius: 6px;
	padding: 16px;
	margin-bottom: 20px;
}

.rivrab-rma-address-box h3 {
	margin: 0 0 10px;
	font-size: 15px;
	color: #874d00;
}

.rivrab-rma-address-box pre {
	margin: 0;
	white-space: pre-wrap;
	font-family: inherit;
	font-size: 14px;
	color: #333;
	line-height: 1.7;
}

.rivrab-rma-tracking-form {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px dashed #ffe58f;
}

.rivrab-rma-tracking-form h4 {
	margin: 0 0 10px;
	font-size: 14px;
	color: #874d00;
}

.rivrab-rma-tracking-form input[type="text"] {
	width: 220px;
	padding: 8px 12px;
	margin-right: 10px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 14px;
}

.rivrab-rma-summary {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	font-size: 14px;
	color: #666;
	padding: 14px 16px;
	background: #fafafa;
	border: 1px solid #eee;
	border-radius: 6px;
	margin-top: 14px;
}

.rivrab-rma-refund-amount strong {
	color: #ff4d4f;
	font-size: 16px;
}

.rivrab-rma-block {
	margin-bottom: 18px;
}

.rivrab-rma-images {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.rivrab-rma-images img {
	width: 100px;
	height: 100px;
	object-fit: cover;
	border: 1px solid #eee;
	border-radius: 4px;
}

.rivrab-rma-timeline {
	margin: 0;
	padding: 0 0 0 4px;
	list-style: none;
}

.rivrab-rma-timeline li {
	position: relative;
	padding: 0 0 14px 18px;
	border-left: 1px solid #eee;
	font-size: 13px;
	color: #666;
	line-height: 1.7;
}

.rivrab-rma-timeline li:last-child {
	border-left-color: transparent;
	padding-bottom: 0;
}

.rivrab-rma-timeline li::before {
	content: "";
	position: absolute;
	left: -4px;
	top: 6px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #0066cc;
}

.rivrab-rma-tl-time {
	color: #999;
	margin-right: 10px;
}

/* 订单页售后进度 */
.rivrab-rma-progress-block {
	margin-top: 26px;
}

.rivrab-rma-progress-block h2 {
	font-size: 16px;
	margin-bottom: 12px;
}

.rivrab-rma-progress-item {
	border: 1px solid #eee;
	border-radius: 6px;
	padding: 14px 16px;
	margin-bottom: 12px;
	background: #fff;
}

.rivrab-rma-progress-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	font-size: 13px;
	color: #666;
	margin-bottom: 12px;
}

.rivrab-rma-view-link {
	color: #0066cc;
	text-decoration: none;
	margin-left: auto;
}

.rivrab-rma-view-link:hover {
	text-decoration: underline;
}

/* 订单列表内联的售后标签 */
.rivrab-order-rma-tag {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 4px 10px;
	border-radius: 4px;
	font-size: 12px;
	color: #0066cc;
	background: #e6f4ff;
	border: 1px solid #91caff;
	text-decoration: none;
	white-space: nowrap;
}

.rivrab-order-rma-tag:hover {
	background: #0066cc;
	color: #fff;
}

/* 移动端 */
@media (max-width: 768px) {
	.rivrab-rma-thead {
		display: none;
	}

	.rivrab-rma-card-body {
		flex-direction: column;
	}

	.rivrab-rma-meta {
		flex: 1 1 auto;
		border-left: none;
		border-top: 1px solid #eee;
	}

	.rivrab-rma-product {
		grid-template-columns: minmax(0, 1fr) 90px;
	}

	.rivrab-rma-items .col-sku,
	.rivrab-rma-items .col-price {
		display: none;
	}
}

/* 退款明细 */
.rivrab-rma-breakdown {
	width: 100%;
	max-width: 520px;
	border-collapse: collapse;
	font-size: 14px;
}

.rivrab-rma-breakdown td {
	padding: 8px 10px;
	border-bottom: 1px solid #f0f0f0;
	color: #333;
}

.rivrab-rma-breakdown td:last-child {
	text-align: right;
	white-space: nowrap;
}

.rivrab-rma-breakdown .is-minus {
	color: #cf1322;
}

.rivrab-rma-breakdown .is-plus {
	color: #389e0d;
}

.rivrab-rma-breakdown .is-total td {
	border-top: 2px solid #eee;
	border-bottom: none;
	font-weight: 700;
	font-size: 15px;
}

.rivrab-rma-breakdown-note {
	margin: 10px 0 0;
	font-size: 12px;
	color: #999;
	line-height: 1.6;
}

/* 责任归属提示（放在步骤条下方） */
.rivrab-rma-liability {
	margin: 14px 0 20px;
	padding: 12px 16px;
	background: #f7f7f7;
	border: 1px solid #eee;
	border-radius: 6px;
	font-size: 14px;
	line-height: 1.6;
}

.rivrab-rma-liability strong {
	font-weight: 500;
	color: #333;
}

.rivrab-rma-liability-note {
	margin-left: 10px;
	color: #666;
}