.table-responsive {
  max-height: 80vh;
  overflow: auto;
}
#orderCheckTable thead th {
  position: sticky;
  top: 0px; /* 상단 고정 네비게이션 바(높이 약 56px) 바로 아래에 위치하도록 설정 */
  z-index: 10;
  text-align: center; /* 모든 헤더 가운데 정렬 */
  vertical-align: middle; /* 헤더 세로 중앙 정렬 */
  background-color: #356854; /* 헤더 배경색 */
  color: white; /* 헤더 글자색 */
}
#orderCheckTable tbody td {
  text-align: center; /* 모든 데이터 셀 기본 가운데 정렬 */
  vertical-align: middle; /* 데이터 셀 세로 중앙 정렬 */
  padding: 0.1rem 0.2rem; /* 행 높이를 줄이기 위해 상하 여백(padding) 조절 */
  line-height: 2; /* 행 높이를 줄이기 위해 줄 간격(line-height) 조절 */
}
/* 특정 열만 왼쪽 정렬로 덮어쓰기 */
#orderCheckTable tbody td:nth-child(6),  /* 상품명 */
#orderCheckTable tbody td:nth-child(10) { /* 납품부족사유 */
  text-align: left;
}

/* '확정수량' 열(9번째)만 굵게 표시 */
#orderCheckTable tbody td:nth-child(9) {
  font-weight: bold;
}
/* 테이블 레이아웃을 고정하여, 설정된 너비 값을 엄격하게 적용 */
#orderCheckTable {
  table-layout: fixed;
  width: auto; /* 테이블 너비를 내용에 맞게 자동 조절 */
}
/* 각 열의 너비를 개별적으로 설정합니다. */
#orderCheckTable th:nth-child(1) { width: 40px; }   /* 순번 */
#orderCheckTable th:nth-child(2),
#orderCheckTable th:nth-child(3) { 
  width: 120px; /* 너비 확장 */
  word-break: keep-all; /* 단어 단위로 줄바꿈 방지 */
  white-space: nowrap; /* 공백에서 줄바꿈 방지 */
}
#orderCheckTable th:nth-child(1) { width: 40px; }  /* 순번 */
#orderCheckTable th:nth-child(2) { width: 60px; }  /* 발주합계 */
#orderCheckTable th:nth-child(3) { width: 60px; }  /* 확정합계 */
#orderCheckTable th:nth-child(4) { width: 80px; }  /* 발주번호 */
#orderCheckTable th:nth-child(5) { width: 80px; }  /* 상품번호 */    
#orderCheckTable th:nth-child(6) { width: 400px; }  /* 상품명 */
#orderCheckTable th:nth-child(7) { width: 50px; }   /* 발주수량 */
#orderCheckTable th:nth-child(8) { width: 50px; }   /* 체크 */
#orderCheckTable th:nth-child(9) { width: 50px; }   /* 확정수량 */
#orderCheckTable th:nth-child(10) { width: 300px; } /* 납품부족사유 */
#orderCheckTable th:nth-child(11) { width: 60px; }  /* 이지넷 매입 */
#orderCheckTable th:nth-child(12) { width: 70px; }  /* 제품별 확정 합계 */
#orderCheckTable th:nth-child(13) { width: 60px; }  /* 창고1 */
#orderCheckTable th:nth-child(14) { width: 60px; }  /* 창고2 */
#orderCheckTable th:nth-child(15) { width: 60px; }  /* 창고3 */
#orderCheckTable th:nth-child(16) { width: 60px; }  /* 창고4 */
#orderCheckTable th:nth-child(17) { width: 60px; }  /* 창고5 */
#orderCheckTable th:nth-child(18) { width: 80px; }  /* 위치 */
#orderCheckTable th:nth-child(19) { width: 100px; } /* ER 상품코드 */
/* 추가 열이 있다면 여기에 너비를 계속 정의할 수 있습니다. */
.editable-cell {
  background-color: #fffacd; /* 편집 가능한 셀 배경색 (LemonChiffon) */
}
/* td.modified로 선택자를 더 구체적으로 만들어 우선순위를 높입니다. */
td.modified {
  color: #198754; /* Bootstrap success green */
}

/* 납품부족사유 드롭다운 스타일 */
.shortage-reason-cell select {
  width: 100%;
  border: none;
  background-color: transparent;
  -webkit-appearance: none; /* 기본 화살표 제거 (Chrome, Safari) */
  -moz-appearance: none;    /* 기본 화살표 제거 (Firefox) */
  appearance: none;         /* 기본 화살표 제거 */
  background-image: none;   /* Bootstrap의 화살표 배경 이미지 제거 */
}
.saving {
  transition: background-color 0.2s ease-in-out;
  background-color: #ffc107; /* Bootstrap 'warning' yellow */
}

.box-over-limit {
  background-color: #f8d7da !important; /* Bootstrap's danger background color */
  color: #721c24 !important; /* Bootstrap's danger text color */
}

/* --- 발주서/확정 체크 페이지 그룹화 스타일 --- */
/* tr이 아닌 td에 직접 스타일을 적용하여 다른 스타일에 덮어씌워지는 것을 방지합니다. */
#orderCheckTable tr.group-header > td {
  background-color: #dbdddd; /* Bootstrap gray-700 */
  color: rgb(0, 0, 0); /* 어두운 배경에 맞춰 텍스트 색상을 흰색으로 변경 */
  cursor: pointer;
}

/* (신규) 파일이 새로 시작되는 그룹 헤더의 배경색 */
/* !important를 사용하여 다른 그룹 헤더 스타일보다 우선 적용되도록 합니다. */
#orderCheckTable tr.group-header.new-file-start > td, #orderCheckTable tr.group-header.new-file-start:hover > td {
  background-color: #8FBC8F !important; /* DarkSeaGreen */
  color: #212529;
}

/* 그룹 헤더의 요약 정보 셀은 왼쪽 정렬 */
#orderCheckTable tr.group-header > td.group-summary-cell {
  text-align: left;
}

/* 마우스 오버 시 스타일 */
#orderCheckTable tr.group-header:hover > td {
  background-color: #94bce4;
}

.group-toggle-cell {
  width: 40px; /* 순번 열과 너비를 맞춤 */
}

.group-toggle-btn {
  padding: 0.1rem 0.3rem; /* 버튼 크기 미세 조정 */
}

/* --- 조건부 배경색 --- */
/* 조건 1: '체크' 열 내용이 '확인'일 때 */
.cell-status-confirm {
  background-color: #d9ead3 !important;
}

/* 조건 2: '체크' 열 내용이 '단종'일 때 */
.cell-status-discontinued {
  background-color: #ffdfbe !important;
}

/* 조건 3: 발주수량과 확정수량이 다를 때 */
.cell-quantity-mismatch {
  background-color: #d5e0f4 !important;
}

/* 문제 검사 시 하이라이트 스타일 */
.problem-cell { /* 사유 누락 등 일반적인 문제 */
  border: 2px solid red !important;
}

.problem-font { /* 체크 값과 수량이 불일치하는 특정 문제 */
  color: red !important;
  font-weight: bold !important;
}

/* 문제 행 번호 링크 스타일 */
.problem-row-link {
  text-decoration: underline;
  cursor: pointer;
  margin: 0 2px;
}

/* 행 스크롤 시 하이라이트 효과 */
.row-highlight td {
  background-color: #fff3cd !important; /* Bootstrap 'warning' 배경색 */
  transition: background-color 0.5s ease-out;
}

/* 상단 요약 정보 스타일 */
#summaryInfo {
  /* font-size 속성을 제거하여 부모 요소의 폰트 크기를 상속받도록 합니다. */
}