ANTOOZA-FRONTEND/app/styles/stock-common.scss

// ─────────────────────────────────────────────────────────────
// 종목 공용 표시 요소 — 시장/거래상태 뱃지 + 등락 색 (토큰 변수만 사용)
// 사용처: /stock 목록, /stock/[code] 상세, HeaderSearch 자동완성
// ─────────────────────────────────────────────────────────────

// 시장·거래상태 뱃지
.stock-badge {
	display: inline-block;
	padding: 1px 6px;
	border: 1px solid var(--border-strong);
	border-radius: 4px;
	font-size: var(--fs-2xs);
	line-height: 1.5;
	color: var(--text-secondary);
	white-space: nowrap;
	vertical-align: middle;

	&--kospi {
		color: var(--color-blue);
		border-color: var(--color-blue);
	}

	&--kosdaq {
		color: var(--color-purple);
		border-color: var(--color-purple);
	}

	&--konex {
		color: var(--text-muted);
	}

	&--halted {
		color: var(--color-danger);
		border-color: var(--color-danger);
	}

	&--watch {
		color: var(--color-warning-text);
		background: var(--color-warning-bg);
		border-color: var(--color-warning-text);
	}
}

// 등락 색 — 상승 빨강 / 하락 파랑 / 보합 (부호 기호 병행은 마크업에서)
.stock-change {
	font-variant-numeric: tabular-nums;

	&--up {
		color: var(--price-up);
	}

	&--down {
		color: var(--price-down);
	}

	&--flat {
		color: var(--price-flat);
	}
}