/* 리셋·타이포그래피·포커스·숫자 유틸리티 */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: calc(var(--header-height-site) + var(--space-4));
}

body {
	margin: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-sans);
	font-size: var(--fs-body);
	line-height: var(--lh-body);
	word-break: keep-all;
	overflow-wrap: anywhere;
}

h1, h2, h3, h4 {
	margin: 0 0 var(--space-3);
	line-height: var(--lh-tight);
	font-weight: 700;
	letter-spacing: -0.01em;
}
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); }
h4 { font-size: var(--fs-body); }

p { margin: 0 0 var(--space-3); }
ul, ol { margin: 0; padding: 0; list-style: none; }
img, svg { display: block; max-width: 100%; }
table { border-collapse: collapse; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
legend { padding: 0; }
hr { border: 0; border-top: 1px solid var(--color-border); margin: var(--space-5) 0; }

a {
	color: var(--color-primary);
	text-decoration: underline;
	text-underline-offset: 3px;
}
a:hover { color: var(--color-primary-hover); }

:focus-visible {
	outline: 3px solid var(--color-focus);
	outline-offset: 2px;
	border-radius: 2px;
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	left: var(--space-3);
	top: -100px;
	z-index: var(--z-toast);
	padding: var(--space-3) var(--space-4);
	background: var(--color-text);
	color: var(--color-surface);
	border-radius: var(--radius-input);
}
.skip-link:focus { top: var(--space-3); }

/* 숫자: 오른쪽 정렬·등폭. 주문번호·송장번호는 .code 로 문자열 표기 */
.num {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.code {
	font-family: var(--font-mono);
	font-size: var(--fs-small);
	letter-spacing: 0;
}

.text-muted { color: var(--color-text-muted); }
.text-small { font-size: var(--fs-small); }
.text-caption { font-size: var(--fs-caption); }
.text-danger { color: var(--color-danger); }
.text-success { color: var(--color-success); }
.text-warning { color: var(--color-warning); }
[hidden] { display: none !important; }

.icon {
	width: 20px;
	height: 20px;
	flex: none;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.icon-sm { width: 16px; height: 16px; }
.icon-lg { width: 28px; height: 28px; }

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* SVG 스프라이트 컨테이너: 화면에는 보이지 않고 symbol 만 제공 */
.sprite {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}
