/* Full HD 이상 화면일 때 .container 최대 너비 1920px */
@media (min-width: 1920px) {
    .container {
        max-width: 1920px;
    }
}

/* optional: 다크모드에서 본문 배경·텍스트 색 강제 지정 */
body {
    background-color: #262c34;
    color: #e0e0e0;
}

/* 숫자 입력 필드의 스피너(화살표) 제거 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"] {
    -moz-appearance: textfield; /* Firefox */
}

/* 1) 테이블 배경을 body 배경과 동일하게, 투명 처리 */
/*.table {*/
/*  background-color: transparent !important;*/
/*  border-color: rgba(255,255,255,0.2);*/
/*}*/

.table {
    /* 기본 배경 투명화 */
    --bs-table-bg: transparent !important;
    /* 줄무늬 백그라운드(홀수행) */
    --bs-table-striped-bg: rgba(255, 255, 255, 0.05) !important;
    /* hover 백그라운드 */
    --bs-table-hover-bg: rgba(255, 255, 255, 0.15) !important;
}

/*!* 3) hover 시 배경 강조 *!*/
/*.table-hover tbody tr {*/
/*  transition: background-color 0.2s ease;*/
/*}*/
/*.table-hover tbody tr:hover {*/
/*  background-color: rgba(255, 255, 255, 0.15) !important;*/
/*}*/

/* 결과 Table Click 시 Table row Color 변경 */
tr.clickable {
    cursor: pointer;
}

tr.clickable.selected {
    background-color: rgba(255, 255, 0, 0.2);
}

/* Table Header Centering */
table th {
    text-align: center !important;
    vertical-align: middle !important;
}

/* Claude 작성 CSS */
/*.form-control, .form-select {
    min-height: 38px;
}*/

.section-divider {
    border-top: 1px solid #495057;
    margin: 1rem 0;
}

.label-text {
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    /*margin-left: 0.7rem;*/
    /*margin-right: 0.5rem;*/
}

.compact-form .row {
    --bs-gutter-x: 0.5rem;
}

.compact-form .col-form-label {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    margin-bottom: 0;
    font-size: 0.875rem;
}

/* sticky table header by Claude */
.table-scroll {
    max-height: 50vh;
    overflow: auto;
}

.table-sticky thead th {
    position: sticky;
    z-index: 2;
    background: var(--bs-dark);
    height: 42px;
    padding: 0.5rem;
    line-height: 1.2;
    box-sizing: border-box;
    border-bottom: 1px solid var(--bs-border-color);
    vertical-align: middle;
    text-align: center;
    white-space: nowrap;
}

.table-sticky thead tr:first-child th {
    top: 0;
}

.table-sticky thead tr:nth-child(2) th {
    /* 핵심 해결: 1px 겹치게 하여 간격 완전 제거 */
    top: 41px; /* 42px - 1px = 첫 번째 행과 1px 겹침 */
}

.table-sticky thead th[rowspan="2"] {
    height: 84px;
    vertical-align: middle;
}

.table-dark thead th {
    background-color: var(--bs-dark) !important;
}

.table-sticky thead tr {
    border-collapse: collapse;
}

/* 인건비 관리: 근로자 지급정보 탭 Table */
/* ── 테두리 제거 + 간격 최소화 ───────────────────────────────── */
.payroll-table {
    border-collapse: collapse;
}

.payroll-table thead, .payroll-table tbody, .payroll-table tr,
.payroll-table th, .payroll-table td {
    border: 0 !important;
}

.payroll-table th, .payroll-table td {
    padding: .32rem .45rem;
}

/* 항목 라벨(th)은 좌측 정렬(요구 3) */
.payroll-table th {
    text-align: left !important;
    vertical-align: middle;
}

/* 숫자 입력 박스: 낮은 높이 + 우측 정렬 */
.payroll-table input.form-control {
    height: calc(1.55rem + 2px);
    padding: .15rem .45rem;
    text-align: right;
}

/* ★ 시작부 들여쓰기 제거: 첫 번째 셀/헤더의 좌측 패딩 축소 */
.payroll-table th:first-child,
.payroll-table td:first-child {
    padding-left: .15rem !important;
}

/* … 기존 .payroll-table 스타일 … */
/* 지급총액/공제총액과 동일 폭 */
.payroll-table .net-td input.form-control {
    width: 100%;
    max-width: 140px;
}

/* 총액 지급 정보 탭 */
.totalpay-title {
    font-size: 1.1rem; /* 살짝 크게 */
    font-weight: 700;
    color: #e9ecef; /* Darkly에서 잘 보이는 연한 흰색 */
}

/* 테이블: 테두리 제거 + 간격 축소 */
.totalpay-table {
    border-collapse: collapse;
}

.totalpay-table th, .totalpay-table td {
    border: 0 !important;
    padding: .35rem .5rem;
}

.totalpay-table th {
    text-align: left !important;;
    color: #cfd3da;
}

/* 숫자 입력: 낮은 높이 + 우측정렬 */
.totalpay-table input.form-control {
    height: calc(1.6rem + 2px);
    padding: .2rem .5rem;
    text-align: right;
    min-width: 120px;
}

/* 회색(읽기전용) 입력 */
.totalpay-table .readonly input.form-control {
    height: calc(1.6rem + 2px);
    padding: .2rem .5rem;
    text-align: right;
    min-width: 120px;
    color: #ced4da;
    background-color: #495057; /* Darkly에 어울리는 은은한 회색 */
}

/* 좌우 패딩 최소화해 왼쪽에 붙게 */
.totalpay-wrap {
    padding-left: 0;
    padding-right: 0;
}

/* 인건비 관리 결과 테이블 */
.payroll-list {
    min-width: 4200px;
}

.payroll-list th, .payroll-list td {
    white-space: nowrap;
    vertical-align: middle;
    padding: .35rem .5rem;
}

.payroll-list.table-bordered > :not(caption) > * > * {
    border-color: var(--bs-secondary);
}

/* 헤더 고정(2행)만 유지 */
.payroll-scroll thead th {
    position: sticky;
    z-index: 3;
}

.payroll-scroll thead tr:nth-child(1) th {
    top: 0;
    z-index: 6;
}

.payroll-scroll thead tr:nth-child(2) th {
    top: 38px;
    z-index: 5;
}

/* 필요시 높이 조정 */

/* 탭 UI 가독성 개선을 위한 Custom CSS
  (Bootstrap 5 Darkly 테마 기준)
*/

/* 탭 전체의 하단 테두리를 설정하여 콘텐츠 영역과 구분선을 만듭니다. */
.nav-tabs {
    border-bottom: 1px solid #4e5d6c; /* Darkly 테마의 어두운 경계선 색상 */
}

/* 비활성 상태의 탭 링크 스타일 */
.nav-tabs .nav-link {
    background-color: transparent; /* 배경색을 투명하게 하여 상위 요소의 배경색과 같게 함 */
    color: #adb5bd; /* 비활성 텍스트 색상 (밝은 회색) */
    border: 1px solid transparent;
    border-bottom: none; /* 하단 테두리 제거 */
}

/* 비활성 탭에 마우스를 올렸을 때의 스타일 (선택된 상태가 아닐 때만) */
.nav-tabs .nav-link:hover:not(.active) {
    border-color: #444;
    isolation: isolate; /* z-index 문제를 방지 */
    background-color: #3a3a3a; /* 살짝 밝은 배경으로 피드백 제공 */
}

/* ✨ 핵심: 활성(active) 상태의 탭 링크 스타일 */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: #fff; /* 활성 텍스트는 흰색으로 강조 */
    /* 콘텐츠 영역의 배경색과 동일하게 지정하여
      탭과 콘텐츠가 연결된 것처럼 보이게 합니다.
    */
    background-color: #343a40; /* Darkly 테마의 card, bg-dark 색상과 유사 */
    border-color: #4e5d6c #4e5d6c transparent; /* 좌, 우, 상단 테두리만 적용 */
    font-weight: 500;
}

/* 탭 콘텐츠 영역 스타일 */
.tab-content {
    /* 활성 탭의 배경색과 동일하게 설정 */
    background-color: #343a40;
    padding: 1.5rem 1rem; /* 내부 여백 추가 */
    border: 1px solid #4e5d6c;
    border-top: none; /* 상단 테두리는 탭이 대신하므로 제거 */
    border-radius: 0 0 .25rem .25rem; /* 하단 모서리를 둥글게 처리 */
    min-height: 208px;
}

/* 세금 관리 */
/* 세금 집계금액과 확정 금액 차이 발생 시 처리 */
/* 글자색만 빨강, disabled 상태에서도 유지 */
.amount-diff,
.amount-diff:disabled {
    color: #dc3545 !important; /* Bootstrap/Bootswatch danger */
}

/* form: input field readonly */
/* 입력/텍스트 영역 - readonly */
.form-control[readonly],
textarea.form-control[readonly],
input.form-control[readonly],
.readonly-box { /* 템플릿에서 쓰던 보조 클래스 */
    background-color: #2f343a; /* 어두운 회색(눈부심 완화) */
    color: #cfd8dc; /* 밝은 회색 글자 */
    border-color: #495057;
}

/* readonly 포커스 시 테두리/그림자 억제 */
.form-control[readonly]:focus,
.readonly-box:focus {
    box-shadow: none;
    border-color: #6c757d;
}

/* 셀렉트는 readonly가 없으므로 disabled 스타일도 통일 */
.form-select:disabled,
select[disabled] {
    background-color: #2b3035;
    color: #9aa4ae;
    border-color: #495057;
    opacity: 1; /* 부트스트랩 기본 희미화 제거 */
    cursor: not-allowed;
}

/* 숫자 요약 박스가 있을 경우(합계/잔액) 약간의 시각적 구분 */
.readonly-box {
    background-color: #2b3035;
    color: #cfd8dc;
    border-color: #495057;
}

/*프로젝트 관리 CSS*/
/* 스크롤 래퍼: 가로/세로 스크롤 */
.table-wrap {
    position: relative;
    overflow: auto; /* X/Y 스크롤 모두 */
    max-height: 60vh; /* 필요시 조절 */
}

/* 테이블 최소 너비 확보 → 수평 스크롤 유도 */
.table-wrap .table {
    min-width: 1400px; /* 칼럼 수에 맞게 조절 */
    margin-bottom: 0;
}

/* Sticky header (두 줄 헤더 대응) */
.table-sticky thead th {
    position: sticky;
    z-index: 5;
    background-color: #2b3035; /* Darkly 톤 유지 */
}

/* 1행 헤더: top 0, 2행 헤더: JS에서 높이만큼 offset 지정 */
.table-sticky thead tr:nth-child(1) th {
    top: 0;
    z-index: 6;
}

.table-sticky thead tr:nth-child(2) th {
    z-index: 5;
}

.table-active > * {
    background-color: #2f4668 !important;
}

/* === 상단 프로젝트 목록: 한 줄 고정 + 말줄임 === */
#tbl-projects {
    table-layout: fixed;
}

/* 칼럼 고정폭 기준 렌더 */
#tbl-projects th, #tbl-projects td {
    white-space: nowrap;
}

/* 말줄임 컨테이너 */
#tbl-projects .truncate {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 칼럼 폭 (필요시 값만 조정) */
#tbl-projects th.col-company {
    width: 70px;
}

/* 프로젝트명 */
#tbl-projects th.col-name {
    width: 150px;
}

/* 사업관리 */
#tbl-projects th.col-pm {
    width: 90px;
}

/* 발주처 */
#tbl-projects th.col-client {
    width: 150px;
}

/* 사업자등록번호*/
#tbl-projects th.col-brn {
    width: 100px;
}

/* 사업기간 */
#tbl-projects th.col-period {
    width: 200px;
}

#tbl-projects th.col-amount {
    width: 110px;
}

/* 메모 */
#tbl-projects th.col-memo {
    width: 150px;
}

/* 수주금액 등 숫자열 */
/* 숫자 칼럼은 줄바꿈 방지만(폭이 부족하면 가로 스크롤) */
#tbl-projects td.text-end {
    white-space: nowrap;
}