:root {
	--bds-primary: #1058A8;
	--bds-secondary: #243B6B;
	--bds-accent: #00C2A8;
	--bds-bg: #EEF5FA;
	--bds-surface: #FFFFFF;
	--bds-text: #172033;
	--bds-muted: #6B7A90;
	--bds-line: rgba(107, 122, 144, 0.24);
	--bds-soft-line: rgba(107, 122, 144, 0.14);
	--bds-shadow: 0 12px 28px rgba(36, 59, 107, 0.10);
	--bds-radius: 8px;
}

* {
	box-sizing: border-box;
}

html {
	min-width: 0;
	background: var(--bds-bg);
}

body {
	margin: 0;
	background: var(--bds-bg);
	color: var(--bds-text);
	font-family: Pretendard, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;
	font-size: 14px;
	font-weight: 400;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0;
	overflow-x: hidden;
}

button,
input,
select,
textarea,
table {
	font-family: inherit;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: inherit;
}

.field-label {
	display: block;
	margin-bottom: 6px;
	color: var(--bds-text);
	font-size: 12px;
	font-weight: 600;
}

.bds-input,
.bds-select {
	width: 100%;
	height: 38px;
	border: 1px solid var(--bds-line);
	border-radius: 6px;
	padding: 0 11px;
	background: var(--bds-surface);
	color: var(--bds-text);
	font-size: 13px;
	font-weight: 400;
	outline: none;
}

textarea.bds-input {
	height: auto;
	min-height: 84px;
	padding-top: 10px;
	resize: vertical;
}

.bds-input:focus,
.bds-select:focus {
	border-color: var(--bds-primary);
	box-shadow: 0 0 0 3px rgba(16, 88, 168, 0.12);
}

.primary-btn,
.soft-btn,
.outline-btn,
.danger-btn,
.success-btn {
	min-height: 38px;
	border-radius: 6px;
	border: 1px solid transparent;
	padding: 0 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
}

.primary-btn {
	background: var(--bds-primary);
	color: var(--bds-surface);
}

.soft-btn {
	background: rgba(16, 88, 168, 0.08);
	color: var(--bds-primary);
	border-color: rgba(16, 88, 168, 0.18);
}

.outline-btn {
	background: var(--bds-surface);
	color: var(--bds-text);
	border-color: var(--bds-line);
}

.success-btn {
	background: var(--bds-accent);
	color: var(--bds-surface);
}

.danger-btn {
	background: rgba(107, 122, 144, 0.10);
	color: var(--bds-secondary);
	border-color: rgba(107, 122, 144, 0.18);
}

.primary-btn:disabled,
.success-btn:disabled,
.danger-btn:disabled,
.outline-btn:disabled {
	opacity: 0.52;
	cursor: not-allowed;
}

.avatar {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--bds-primary);
	color: var(--bds-surface);
	display: grid;
	place-items: center;
	font-weight: 700;
	flex: 0 0 auto;
}

.initials {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-size: 12px;
	font-weight: 600;
	color: var(--bds-secondary);
	background: rgba(36, 59, 107, 0.08);
}

.initials.green {
	background: rgba(0, 194, 168, 0.16);
	color: var(--bds-secondary);
}

.initials.blue {
	background: rgba(16, 88, 168, 0.12);
	color: var(--bds-primary);
}

.initials.yellow,
.initials.red {
	background: rgba(107, 122, 144, 0.12);
	color: var(--bds-secondary);
}

.badge,
.status-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 54px;
	height: 24px;
	padding: 0 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
}

.badge.in,
.badge.mobile,
.status-badge.normal,
.status-badge.closed {
	background: rgba(0, 194, 168, 0.15);
	color: var(--bds-secondary);
}

.badge.out,
.badge.system,
.status-badge.waiting {
	background: rgba(107, 122, 144, 0.12);
	color: var(--bds-muted);
}

.badge.web,
.status-badge.open {
	background: rgba(16, 88, 168, 0.10);
	color: var(--bds-primary);
}

.badge.admin,
.badge.late,
.badge.absent,
.status-badge.late {
	background: rgba(36, 59, 107, 0.12);
	color: var(--bds-secondary);
}

.row-title {
	color: var(--bds-text);
	font-weight: 600;
}

.row-sub {
	color: var(--bds-muted);
	font-size: 12px;
	font-weight: 400;
	margin-top: 3px;
}

.panel-link {
	color: var(--bds-primary);
	font-size: 12px;
	font-weight: 600;
}

.d-flex {
	display: flex !important;
}

.gap-2 {
	gap: .5rem !important;
}

.flex-wrap {
	flex-wrap: wrap !important;
}

.w-100 {
	width: 100% !important;
}

.mb-1 {
	margin-bottom: .25rem !important;
}

.mb-3 {
	margin-bottom: 1rem !important;
}

.mt-3 {
	margin-top: 1rem !important;
}

.d-block {
	display: block !important;
}

.text-end {
	text-align: right !important;
}

.text-center {
	text-align: center !important;
}

.py-4 {
	padding-top: 1.5rem !important;
	padding-bottom: 1.5rem !important;
}

.status-dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--bds-accent);
	display: inline-block;
	flex: 0 0 auto;
}