/* ---------------------------------------------------------------------------
   불량 유형 선택 메뉴 (다중선택 토글)
   qmsc3370 / qmsc3380 검사 등록 확인 모달, qmsc1190 출하 재검사, wmsc1160 재검등록 공용.
   외부 폰트·아이콘 사용 없음(폐쇄망).
   --------------------------------------------------------------------------- */

.faulty-type-select {
	position: relative;
	display: inline-block;
}

.faulty-type-select .fts-toggle {
	min-width: 110px;
	white-space: nowrap;
}

.faulty-type-select .fts-toggle.fts-has-value {
	background-color: #d9534f;
	border-color: #d43f3a;
}

.faulty-type-select .fts-count {
	display: inline-block;
	min-width: 20px;
	margin-left: 4px;
	padding: 0 5px;
	border-radius: 10px;
	background-color: #fff;
	color: #d9534f;
	font-weight: 700;
	font-size: 0.85em;
	line-height: 1.5;
}

.faulty-type-select .fts-menu {
	position: absolute;
	z-index: 1080; /* 부트스트랩 모달(1050) 위 */
	left: 0;
	top: calc(100% + 4px);
	width: 340px;
	max-width: 90vw;
	background-color: #fff;
	border: 1px solid #b5b5b5;
	border-radius: 4px;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
	text-align: left;
}

/* 모달 하단에 두는 경우 위쪽으로 펼친다 */
.faulty-type-select .fts-menu.fts-dropup {
	top: auto;
	bottom: calc(100% + 4px);
}

.faulty-type-select .fts-menu-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 6px 8px;
	border-bottom: 1px solid #e3e3e3;
	background-color: #f5f7fa;
}

.faulty-type-select .fts-menu-close {
	border: 0;
	background: transparent;
	font-size: 20px;
	line-height: 1;
	color: #666;
	cursor: pointer;
	padding: 0 4px;
}

.faulty-type-select .fts-menu-body {
	max-height: 320px;
	overflow-y: auto;
	padding: 4px 8px 8px 8px;
}

.faulty-type-select .fts-group + .fts-group {
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px dashed #e3e3e3;
}

.faulty-type-select .fts-group-title {
	font-weight: 700;
	font-size: 0.9em;
	color: #4a6785;
	margin-bottom: 2px;
}

.faulty-type-select .fts-item {
	display: inline-flex;
	align-items: center;
	width: 49%;
	margin: 0;
	padding: 3px 2px;
	font-weight: 400;
	cursor: pointer;
	overflow: hidden;
}

.faulty-type-select .fts-item > span {
	margin-left: 5px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.faulty-type-select .fts-item-all {
	width: auto;
	font-weight: 700;
}

.faulty-type-select .fts-item input[type="checkbox"] {
	width: 16px;
	height: 16px;
	flex: 0 0 16px;
	margin: 0;
}

.faulty-type-select .fts-group-etc .fts-item {
	width: 100%;
}

/* 항목별 텍스트 입력칸(비고 · 기타(공정성) · 기타(원자재성)).
   .fts-item 이 width:49% 로 두 개씩 붙는 흐름이라, form-control 의 display:block 이
   자연히 줄을 끊어 준다. 어느 항목에 딸린 칸인지 보이도록 살짝 들여쓴다. */
.faulty-type-select .fts-item-text {
	height: 32px;
	margin-top: 2px;
	margin-bottom: 2px;
}

.faulty-type-select .fts-group:not(.fts-group-etc) .fts-item-text {
	width: calc(100% - 21px);
	margin-left: 21px;	/* 체크박스(16px) + span margin-left(5px) 만큼 */
}


/* inline 모드 — 메뉴를 띄우지 않고 버튼 바로 아래에 펼친다. (하위 호환용, 현재 화면에서는 popout 사용) */
.faulty-type-select.fts-inline {
	display: block;
	width: 100%;
}

.faulty-type-select.fts-inline .fts-menu {
	position: static;
	width: 100%;
	margin-top: 4px;
	box-shadow: none;
}

/* 읽기 전용 — 목록을 열어 확인은 할 수 있고 변경만 막힌 상태임을 눈으로 구분해 준다. */
.faulty-type-select.fts-readonly .fts-menu-body {
	background-color: #f7f7f7;
}

.faulty-type-select.fts-readonly .fts-item {
	cursor: default;
	color: #6c757d;
}

/* '조회 전용' 표시는 '전체 선택' 라벨 바로 뒤에 붙인다.
   머리줄(.fts-menu-head)의 ::after 로 두면 닫기(×) 버튼 뒤 세 번째 flex 항목이 되어
   오른쪽 끝에서 잘렸다('조회 전' 으로 보임 — 2026-09-17 실기동 확인). */
.faulty-type-select.fts-readonly .fts-item-all::after {
	content: '· 조회 전용';
	margin-left: 8px;
	font-size: 0.85em;
	font-weight: 400;
	color: #6c757d;
	white-space: nowrap;
}

/* ---------------------------------------------------------------------------
   popout 모드 (qmsc1190 출하 재검사, wmsc1160 재검등록)
   메뉴를 body 로 옮겨 position:fixed 로 버튼 아래에 띄운다. 좌표는 JS(placePopout)가 넣는다.
   사이드바의 overflow 스크롤 영역·테이블 안에 갇히지 않고 밖으로 떠야 해서 도입.
   --------------------------------------------------------------------------- */
.faulty-type-select.fts-portal {
	/* body 끝에 붙는 빈 호스트 — 레이아웃에 자리를 차지하지 않게 */
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	display: block;
}

.faulty-type-select.fts-portal .fts-menu,
.faulty-type-select.fts-portal .fts-menu.fts-dropup {
	position: fixed;
	top: 0;
	bottom: auto;	/* dropup 의 bottom 이 남으면 top 과 함께 늘어나므로 반드시 해제 */
	left: 0;
	z-index: 1060;	/* 사이드바·헤더 위, 토스트(toastr) 아래 */
}