/**
 * Shared post-purchase visual tokens (Orders List + View Order + Tracking).
 * Checkpoint 2A — extend pfk-opp; do not invent a competing namespace.
 */

:root,
.pfk-opp,
.pfk-orders {
	--pfk-opp-canvas: #f7f8fa;
	--pfk-opp-content-padding: 20px;
	--pfk-opp-gap-xs: 6px;
	--pfk-opp-gap-sm: 10px;
	--pfk-opp-gap-md: 16px;
	--pfk-opp-gap-lg: 24px;
	--pfk-opp-radius-sm: 10px;
	--pfk-opp-radius-md: 12px;
	--pfk-opp-radius-lg: 16px;
	--pfk-opp-border: #e4e7ec;
	--pfk-opp-border-strong: #d0d5dd;
	--pfk-opp-surface: #ffffff;
	--pfk-opp-surface-muted: #f2f4f7;
	--pfk-opp-text: #101828;
	--pfk-opp-text-muted: #667085;
	--pfk-opp-status-success: #15803d;
	--pfk-opp-status-success-bg: #eaf7ed;
	--pfk-opp-status-warning: #b45309;
	--pfk-opp-status-warning-bg: #fff4e5;
	--pfk-opp-status-danger: #a61b1b;
	--pfk-opp-status-danger-bg: #fff0f0;
	--pfk-opp-status-neutral: #344054;
	--pfk-opp-status-neutral-bg: #eef2f6;
	--pfk-opp-status-info: #175cd3;
	--pfk-opp-status-info-bg: #eff8ff;
	--pfk-opp-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
	--pfk-opp-focus-ring: 0 0 0 3px rgba(16, 24, 40, 0.18);
	--pfk-opp-node: #101828;

	/* Back-compat aliases used by existing View Order / Tracking CSS */
	--pfk-opp-muted: var(--pfk-opp-text-muted);
	--pfk-opp-success: var(--pfk-opp-status-success);
	--pfk-opp-success-bg: var(--pfk-opp-status-success-bg);
	--pfk-opp-warning: var(--pfk-opp-status-warning);
	--pfk-opp-warning-bg: var(--pfk-opp-status-warning-bg);
	--pfk-opp-danger: var(--pfk-opp-status-danger);
	--pfk-opp-danger-bg: var(--pfk-opp-status-danger-bg);

	/* View Order hero — semantic order-status tokens */
	--pfk-order-pending-fg: #b45309;
	--pfk-order-pending-bg: #fff7ed;
	--pfk-order-pending-border: #fed7aa;
	--pfk-order-waiting-fg: #a15c07;
	--pfk-order-waiting-bg: #fffbeb;
	--pfk-order-waiting-border: #fde68a;
	--pfk-order-shipped-fg: #0369a1;
	--pfk-order-shipped-bg: #f0f9ff;
	--pfk-order-shipped-border: #bae6fd;
	--pfk-order-pickup-fg: #7e22ce;
	--pfk-order-pickup-bg: #faf5ff;
	--pfk-order-pickup-border: #e9d5ff;
	--pfk-order-delivered-fg: #15803d;
	--pfk-order-delivered-bg: #ecfdf3;
	--pfk-order-delivered-border: #bbf7d0;
	--pfk-order-returning-fg: #c2410c;
	--pfk-order-returning-bg: #fff7ed;
	--pfk-order-returning-border: #fed7aa;
	--pfk-order-returned-fg: #0f766e;
	--pfk-order-returned-bg: #f0fdfa;
	--pfk-order-returned-border: #99f6e4;
	--pfk-order-refused-fg: #be123c;
	--pfk-order-refused-bg: #fff1f2;
	--pfk-order-refused-border: #fecdd3;
	--pfk-order-cancelled-fg: #b42318;
	--pfk-order-cancelled-bg: #fef3f2;
	--pfk-order-cancelled-border: #fecdca;
	--pfk-order-failed-fg: #991b1b;
	--pfk-order-failed-bg: #fef2f2;
	--pfk-order-failed-border: #fecaca;
	--pfk-order-neutral-fg: #475467;
	--pfk-order-neutral-bg: #f2f4f7;
	--pfk-order-neutral-border: #d0d5dd;
}

.pfk-opp-badge {
	display: inline-flex;
	align-items: center;
	gap: var(--pfk-opp-gap-xs);
	max-width: 100%;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.25;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.pfk-opp-badge--success {
	color: var(--pfk-opp-status-success);
	background: var(--pfk-opp-status-success-bg);
}

.pfk-opp-badge--warning {
	color: var(--pfk-opp-status-warning);
	background: var(--pfk-opp-status-warning-bg);
}

.pfk-opp-badge--danger {
	color: var(--pfk-opp-status-danger);
	background: var(--pfk-opp-status-danger-bg);
}

.pfk-opp-badge--neutral,
.pfk-opp-badge--info {
	color: var(--pfk-opp-status-info);
	background: var(--pfk-opp-status-info-bg);
}

.pfk-opp-badge--neutral {
	color: var(--pfk-opp-status-neutral);
	background: var(--pfk-opp-status-neutral-bg);
}

.pfk-opp-badge--pending {
	color: var(--pfk-order-pending-fg);
	background: var(--pfk-order-pending-bg);
}

.pfk-opp-badge--waiting {
	color: var(--pfk-order-waiting-fg);
	background: var(--pfk-order-waiting-bg);
}

.pfk-opp-badge--shipped {
	color: var(--pfk-order-shipped-fg);
	background: var(--pfk-order-shipped-bg);
}

.pfk-opp-badge--pickup {
	color: var(--pfk-order-pickup-fg);
	background: var(--pfk-order-pickup-bg);
}

.pfk-opp-badge--delivered {
	color: var(--pfk-order-delivered-fg);
	background: var(--pfk-order-delivered-bg);
}

.pfk-opp-badge--returning {
	color: var(--pfk-order-returning-fg);
	background: var(--pfk-order-returning-bg);
}

.pfk-opp-badge--returned {
	color: var(--pfk-order-returned-fg);
	background: var(--pfk-order-returned-bg);
}

.pfk-opp-badge--refused {
	color: var(--pfk-order-refused-fg);
	background: var(--pfk-order-refused-bg);
}

.pfk-opp-badge--cancelled {
	color: var(--pfk-order-cancelled-fg);
	background: var(--pfk-order-cancelled-bg);
}

.pfk-opp-badge--failed {
	color: var(--pfk-order-failed-fg);
	background: var(--pfk-order-failed-bg);
}