@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&display=swap');

/* =========================================================
   1. 기본 설정 및 화면 UI
   ========================================================= */
body {
    font-family: 'Noto Sans KR', sans-serif;
    background-color: #f5f5f5;
    margin: 0;
    padding: 20px;
    font-size: 10pt;
}

/* 화면용 UI (인쇄 시 숨김) */
.no-print {
    background: #fff; padding: 15px; margin-bottom: 20px;
    border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.control-bar { display: flex; justify-content: space-between; align-items: center; }
.tab-buttons button {
    padding: 8px 16px; margin-right: 5px; cursor: pointer;
    background: #eee; border: 1px solid #ddd; border-bottom: none;
    font-weight: bold; border-radius: 4px 4px 0 0;
}
.tab-buttons button.active { background: #fff; border-bottom: 2px solid #fff; color: #007bff; }
.add-row-btn {
    width: 100%; padding: 8px; margin-top: 5px;
    background: #f8f9fa; border: 1px dashed #ccc; cursor: pointer;
}

/* =========================================================
   2. 인쇄 페이지 컨테이너 및 레이아웃
   ========================================================= */
.sheet-container {
    background: #fff; margin: 0 auto; box-shadow: 0 0 10px rgba(0,0,0,0.1);
    box-sizing: border-box; display: none;
}
.sheet-container.active { display: block; }

.page-portrait { width: 210mm; min-height: 297mm; padding: 10mm; }
.page-landscape { width: 297mm; min-height: 210mm; padding: 8mm 10mm; }

/* =========================================================
   3. 테이블 및 입력 필드 공통 스타일
   ========================================================= */
table {
    width: 99%; border-collapse: collapse; table-layout: fixed; margin-bottom: 5px;
}
th, td {
    border: 1px solid #000; padding: 1px 2px;
    text-align: center; vertical-align: middle;
    font-size: 9pt; height: 24px; word-break: break-all;
}
/* 배경색 유틸리티 */
.bg-header { background-color: #f0f0f0 !important; font-weight: bold; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
td.bg-gray-cell { background-color: #f0f0f0 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.bg-yellow-cell { background-color: #fffcd0 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }

/* 텍스트 정렬 및 스타일 */
.text-left { text-align: left !important; padding-left: 5px; }
.text-right { text-align: right !important; padding-right: 5px; }
.text-bold { font-weight: bold; }
.border-none { border: none !important; }

/* 기본 입력 필드 */
input[type="text"], input[type="number"], input[type="date"] {
    width: 100%; height: 100%; border: none; background: transparent;
    text-align: center; font-family: inherit; font-size: inherit; outline: none; padding: 0;
}

/* 밑줄만 있는 입력 필드 (TALLY 상단 등) */
input.input-underline {
    border: none !important;
    border-bottom: 1px solid #000 !important;
    background: transparent !important;
    border-radius: 0 !important;
    text-align: left;
    padding-left: 5px;
}
input.input-underline.center, 
input.input-underline.fmt-time {
    text-align: center !important;
}

/* 여러 줄 입력용 Textarea */
.cell-textarea {
    width: 100%; height: 100%; border: none; resize: none; background: transparent;
    text-align: center; font-family: 'Noto Sans KR', sans-serif; font-size: 8.5pt;
    padding: 2px; box-sizing: border-box; overflow: hidden; white-space: pre-wrap; line-height: 1.2; display: block;
}

/* =========================================================
   4. 보고서 전용 스타일 (육상/본선/노조)
   ========================================================= */
/* [육상/본선] 2단 분리 셀 (pkg/ton) */
.split-cell { padding: 0 !important; height: 46px; vertical-align: top; }
.cell-row-container { display: flex; flex-direction: column; height: 100%; width: 100%; }
.half-row { flex: 1; display: flex; align-items: center; width: 100%; box-sizing: border-box; position: relative; }
.half-row.top { border-bottom: 1px dotted #555; z-index: 10; } /* 점선 */

.half-row input { flex-grow: 1; text-align: right; padding-right: 2px; font-size: 9pt; }
.half-row input.ton-input { font-size: 8pt; letter-spacing: -0.5px; font-family: 'Arial', sans-serif; }
.unit-label { width: 22px; font-size: 6pt; color: #555; text-align: left; padding-left: 1px; font-weight: normal; white-space: nowrap; }

/* [육상/본선] 헤더 (수동 너비 조절) */
.report-header-manual { display: flex; align-items: flex-end; border-bottom: 3px solid #ffffff; padding-bottom: 3px; margin-bottom: 3px; font-size: 10pt; font-weight: bold; }
.header-item { display: flex; align-items: center; }
.header-item input { border-bottom: 1px solid #000; margin-left: 5px; text-align: center; }

/* [공통] 타이틀 스타일 */
.tally-title { font-size: 18pt; font-weight: bold; border: none; }
.tally-sub { font-size: 9pt; border: none; }
.tally-main-title { font-size: 20pt; font-weight: bold; text-decoration: underline; border: none; }
.report-title { font-size: 22pt; font-weight: bold; text-align: center; padding: 5px 0; letter-spacing: 2px; }
.union-title { font-size: 24pt; font-weight: bold; text-align: center; margin-bottom: 8px; }

/* [공통] 결재란 스타일 */
.approval-table {
    width: 165px; float: right; margin-top: -17px; margin-right: 11px; background: #fff;
    table-layout: fixed; position: relative; z-index: 5;
}
.approval-table tr:last-child td { height: 40px !important; }
.approval-header-input { width: 100%; border: none; background: transparent; text-align: center; font-weight: bold; font-size: 9pt; padding: 0; }

/* =========================================================
   [최종] 노조 확인서용 '직접' 테두리 설정 도구
   ========================================================= */

/* 1. 기본 테이블 설정 */
#union-table {
    border-collapse: collapse;
    border: 2px solid #000; /* 전체 외곽선 */
}

/* 2. [만능 도구] 원하는 곳에 붙여넣으면 두꺼운 선이 생깁니다 */
.b-top    { border-top: 2px solid #000 !important; }    /* 위쪽 선 */
.b-bottom { border-bottom: 2px solid #000 !important; } /* 아래쪽 선 */
.b-left   { border-left: 2px solid #000 !important; }   /* 왼쪽 선 */
.b-right  { border-right: 2px solid #000 !important; }  /* 오른쪽 선 */

/* 3. 노란색 배경 (유지) */
.bg-yellow-cell {
    background-color: #fffcd0 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

/* 4. 헤더 폰트 */
#sheet-union th {
    font-size: 8pt;
    letter-spacing: -0.5px;
    padding: 1px;
}

@media print {
    .bg-yellow-cell { background-color: #fffcd0 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
/* 인쇄 설정 */
@media print {
    .b-top    { border-top: 2px solid #000 !important; }
    .b-bottom { border-bottom: 2px solid #000 !important; }
    .b-left   { border-left: 2px solid #000 !important; }
    .b-right  { border-right: 2px solid #000 !important; }
    .bg-yellow-cell { background-color: #fffcd0 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
/* =========================================================
   5. TALLY SHEET 상단 7행 레이아웃 (최종)
   ========================================================= */
.tally-header-7rows { width: 100%; margin-bottom: 10px; font-family: 'Times New Roman', serif; color: #000; }
/* (HTML에서 인라인 스타일로 제어되므로 추가 스타일 불필요) */
/* Tally 전용 textarea 스타일 보강 */
#sheet-tally .cell-textarea {
    height: 100%;
    min-height: 72px; /* 3행 높이(24px * 3)에 맞춤 */
    padding: 4px;
    font-size: 9pt;
    text-align: left; /* B/L, MARK는 왼쪽 정렬이 보기 좋습니다 */
    vertical-align: top;
    line-height: 1.4;
}

/* 인쇄 시 차량 total 강조 및 정수 표현 */
#tally-total-gt {
    font-weight: bold;
    font-size: 11pt;
}

/* =========================================================
   6. 인쇄 설정 (@media print) - 최적화됨
   ========================================================= */
@media print {
    /* 기본 초기화 */
    html, body { width: 100%; height: 100%; margin: 0 !important; padding: 0 !important; background: white; overflow: hidden !important; }
    .no-print { display: none !important; }
    
    /* 시트 표시 */
    .sheet-container { box-shadow: none; margin: 0 !important; padding: 0 !important; width: 100% !important; display: none; }
    .sheet-container.active { display: block !important; }
    
    /* 페이지 여백 */
    @page { size: auto; margin: 15mm; }

    /* 테이블 행 높이 (기본) */
    td, th { height: 25px !important; padding: 2px 2px !important; font-size: 9pt !important; line-height: 1.2 !important; }

    /* [가로 인쇄용] 육상/본선/노조 보고서 전용 축소 설정 */
    #sheet-report td, #sheet-report th,
    #sheet-ship td, #sheet-ship th,  /* [추가] 본선 보고서도 포함 */
    #sheet-union td, #sheet-union th {
        height: 25px !important; font-size: 8.5pt !important; padding: 1px 2px !important;
    }
    
    #sheet-report .split-cell,
    #sheet-ship .split-cell {
        height: 44px !important; /* 2단 셀 높이 */
    }
    
    #sheet-report .approval-table tr:last-child td,
    #sheet-ship .approval-table tr:last-child td,
    #sheet-union .approval-table tr:last-child td {
        height: 40px !important; /* 결재란 높이 */
    }

    /* 선명도 및 기타 */
    .bg-header, .bg-gray-cell, .bg-yellow-cell { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
    .thick-border-right { border-right: 3px solid #000 !important; }
    .half-row.top { border-bottom: 1px dotted #000 !important; }
    .unit-label { color: #000 !important; }
    .input-underline { border-bottom: 1px solid #000 !important; }
    .cell-textarea { white-space: pre-wrap; overflow: visible; }
    
    /* 페이지 넘김 방지 */
    table { page-break-inside: avoid; }
    tr { page-break-inside: avoid; page-break-after: auto; }
}
@media print {
    /* 인쇄 시 점선 두께 조절 */
    .half-row.top {
        border-bottom: 1px dotted #000 !important;
    }
}
/* 장비 투입 현황 내의 input 스타일 최적화 */
.report-grid input {
    padding: 0 1px !important; /* 좌우 여백을 줄여 글자 공간 확보 */
    letter-spacing: -0.5px;    /* 자간을 살짝 좁힘 */
}

/* 구분(자차/용차) 입력칸 전용 */
input[list="list-usage"] {
    font-size: 8.5pt !important; /* 글자 크기를 아주 살짝 줄여서 짤림 방지 */
}