/* =============================================================================
 * /admin Legacy class compatibility
 *
 * .alta-slideover 내부의 옛 /usa 마크업(.form-group / .col-sm-* / .form-control /
 * .btn* / .basic_tb / radio-inline 등)을 admin 디자인 토큰으로 시각만 통일.
 * 마크업은 변경하지 않고 scoped CSS로만 호환 — 점진 마이그레이션 동안 유지.
 * 마이그레이션 완료 시 이 파일과 head.jsp의 link 한 줄만 제거하면 됨.
 *
 * 새 페이지/영역에서는 .alta-* 클래스 직접 사용. 이 파일에 추가 금지.
 * =========================================================================== */

.alta-slideover .form-group {
	display: grid;
	grid-template-columns: 120px 1fr;
	gap: var(--space-sm);
	align-items: center;
	margin: 0 0 var(--space-sm);
	padding: 0;
	border: 0;
	background: transparent !important;
}
.alta-slideover .form-group > [class*="col-sm-"] {
	width: auto;
	max-width: none;
	padding: 0;
	margin: 0;
	float: none;
}
.alta-slideover [class*="col-sm-"] {
	float: none;
	width: auto;
	max-width: none;
	min-height: 0;
	padding-left: 0;
	padding-right: 0;
}
.alta-slideover .form-group .control-label {
	font-size: var(--font-sm);
	color: var(--text-muted);
	text-align: left;
	padding: 0;
	margin: 0;
	line-height: 28px;
	font-weight: 500;
}
.alta-slideover .form-control {
	display: block;
	width: 100%;
	height: 28px;
	padding: 0 var(--space-sm);
	font-size: var(--font-sm);
	line-height: 28px;
	border: 1px solid var(--border-strong);
	border-radius: 4px;
	background: var(--surface);
	color: var(--text);
	font-family: inherit;
	box-shadow: none;
	margin: 0 !important;
}
.alta-slideover .form-control:focus {
	border-color: var(--brand);
	box-shadow: 0 0 0 2px rgba(46, 134, 216, 0.15);
	outline: none;
}
.alta-slideover .form-control[disabled],
.alta-slideover .form-control:disabled {
	background: var(--bg);
	color: var(--text-muted);
	cursor: not-allowed;
}
.alta-slideover textarea.form-control {
	height: auto;
	min-height: 60px;
	line-height: 1.4;
	padding: var(--space-xs) var(--space-sm);
	resize: vertical;
}
.alta-slideover select.form-control {
	padding-right: var(--space-md);
}
.alta-slideover input[type="text"],
.alta-slideover input[type="number"],
.alta-slideover input[type="password"],
.alta-slideover input[type="email"],
.alta-slideover input[type="tel"],
.alta-slideover input[type="time"] {
	font-family: inherit;
}
.alta-slideover input[type="time"],
.alta-slideover input[type="text"]:not(.form-control),
.alta-slideover input[type="number"]:not(.form-control) {
	height: 28px;
	padding: 0 var(--space-sm);
	font-size: var(--font-sm);
	border: 1px solid var(--border-strong);
	border-radius: 4px;
	background: var(--surface);
	color: var(--text);
}
.alta-slideover input[type="checkbox"],
.alta-slideover input[type="radio"] {
	vertical-align: middle;
}

/* /usa 시절 인라인 색상(회색 등)이 들어간 wrapper들 무효 */
.alta-slideover .form-group[style],
.alta-slideover li[style],
.alta-slideover [style*="background"],
.alta-slideover #li_detail_item,
.alta-slideover #div_detail_item,
.alta-slideover .tab-content,
.alta-slideover .tab-pane {
	background: transparent !important;
}
.alta-slideover #div_detail_item,
.alta-slideover #li_detail_item,
.alta-slideover .tab-content {
	height: auto !important;
}
.alta-slideover ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.alta-slideover li {
	display: block !important;
	width: 100% !important;
	margin: 0 0 var(--space-sm);
}

/* tab nav inside slideover */
.alta-slideover .nav-tabs {
	display: flex;
	gap: var(--space-xs);
	border-bottom: 1px solid var(--border-strong);
	margin: 0 0 var(--space-md);
	padding: 0;
	list-style: none;
	overflow-x: auto;
	white-space: nowrap;
}
.alta-slideover .nav-tabs > li > a {
	display: block;
	padding: var(--space-xs) var(--space-md);
	font-size: var(--font-sm);
	color: var(--text-muted);
	border: 0;
	border-bottom: 2px solid transparent;
	background: transparent;
	margin: 0;
	border-radius: 0;
}
.alta-slideover .nav-tabs > li.active > a,
.alta-slideover .nav-tabs > li > a:hover {
	color: var(--brand);
	border-bottom-color: var(--brand);
	background: transparent;
}
.alta-entity-inspector .nav-tabs {
	gap: 0;
	padding: 3px;
	border: 1px solid var(--border);
	border-radius: 6px;
	background: #f6f8fa;
}
.alta-entity-inspector .nav-tabs > li { margin: 0; }
.alta-entity-inspector .nav-tabs > li > a {
	min-width: 72px;
	padding: 5px var(--space-sm);
	text-align: center;
	border: 0;
	border-radius: 4px;
}
.alta-entity-inspector .nav-tabs > li.active > a,
.alta-entity-inspector .nav-tabs > li > a:hover {
	background: var(--surface);
	color: var(--brand-dark);
	box-shadow: var(--shadow-sm);
}

/* 버튼 호환 */
.alta-slideover .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-xs);
	height: 28px;
	min-width: 0;
	padding: 0 var(--space-md) !important;
	margin: 0 !important;
	font-size: var(--font-sm);
	line-height: 1;
	border: 1px solid var(--border-strong);
	background: var(--surface);
	color: var(--text);
	border-radius: 4px;
	cursor: pointer;
	box-shadow: none !important;
	text-shadow: none;
	background-image: none;
	font-weight: normal;
}
.alta-slideover .btn:hover { border-color: var(--brand); color: var(--brand); }
.alta-slideover .save-button-container {
	display: flex;
	justify-content: flex-end;
	margin: var(--space-md) 0 0 !important;
}
.alta-slideover .save-button-container .btn {
	width: auto !important;
	min-width: 88px;
	height: 28px !important;
}
.alta-slideover .btnblue,
.alta-slideover .btnred {
	background: var(--brand);
	border-color: var(--brand);
	color: #fff;
}
.alta-slideover .btnblue:hover,
.alta-slideover .btnred:hover {
	background: var(--brand-dark);
	border-color: var(--brand-dark);
	color: #fff;
}
.alta-slideover .btngray {
	background: var(--surface);
	border-color: var(--border-strong);
	color: var(--text);
}
.alta-slideover .btngray:hover { border-color: var(--brand); color: var(--brand); }

/* basic_tb */
.alta-slideover .basic_tb {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--font-sm);
	margin: var(--space-sm) 0;
}
.alta-slideover .basic_tb th,
.alta-slideover .basic_tb td {
	padding: var(--space-xs) var(--space-sm);
	border-bottom: 1px solid var(--border);
	text-align: left;
	vertical-align: middle;
}
.alta-slideover .basic_tb th {
	background: transparent;
	color: var(--text-muted);
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.4px;
	font-weight: 600;
	border-bottom: 1px solid var(--border-strong);
}

/* radio/checkbox inline 정렬 */
.alta-slideover .radio-inline,
.alta-slideover .checkbox-inline {
	display: inline-flex;
	align-items: center;
	gap: var(--space-xs);
	margin: 0 var(--space-md) 0 0;
	padding: 0;
	font-size: var(--font-sm);
	color: var(--text);
	font-weight: normal;
}
.alta-slideover .radio-inline input[type="radio"],
.alta-slideover .checkbox-inline input[type="checkbox"] {
	margin: 0;
}

/* h4 등 섹션 제목 */
.alta-slideover h4,
.alta-slideover h5 {
	font-size: var(--font-md);
	font-weight: 600;
	color: var(--text);
	margin: var(--space-md) 0 var(--space-sm);
}
.alta-slideover h4:first-child,
.alta-slideover h5:first-child { margin-top: 0; }

/* 옛 btn_small 호환 */
.alta-slideover .btn_small,
.alta-table .btn_small,
.alta-slideover .sbtn,
.alta-slideover .base-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 22px;
	padding: 0 var(--space-sm);
	font-size: 11px;
	border: 1px solid var(--border-strong);
	background: var(--surface);
	color: var(--text);
	border-radius: 4px;
	text-decoration: none;
	cursor: pointer;
}
.alta-slideover .btn_small:hover,
.alta-table .btn_small:hover,
.alta-slideover .sbtn:hover,
.alta-slideover .base-button:hover { border-color: var(--brand); color: var(--brand); }
.alta-slideover #meta_image_view {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border: 1px solid var(--border);
	border-radius: 4px;
	background: var(--bg);
	overflow: hidden;
}
.alta-slideover #meta_image_view img {
	width: 64px !important;
	height: 64px !important;
	object-fit: contain;
}