/* 한글파일 이미지 문맥 리포트 - 도구 전용 스타일 (공통은 common.css) */

/* 설정 행 */
.control-row {
    display: flex;
    gap: 16px;
    align-items: flex-end;
    flex-wrap: wrap;
}
.field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.field-grow {
    flex: 1;
    min-width: 200px;
}
/* 폴더 선택 버튼이 field(column flex)에서 가로로 늘어나지 않고 내용 크기가 되도록 */
#pickFolderBtn {
    align-self: flex-start;
}
.field-label {
    font-size: 13px;
    color: #6b7280;
    font-weight: 600;
}
.num-input {
    width: 120px;
    padding: 8px 10px;
    border: 1px solid #d5d9e6;
    border-radius: 8px;
    font-size: 14px;
    background: #fff;
}
.num-input:focus {
    outline: none;
    border-color: #a3bffa;
    box-shadow: 0 0 0 3px rgba(163, 191, 250, 0.25);
}
.hint-text {
    margin-top: 12px;
    font-size: 12.5px;
    color: #8a90a2;
    line-height: 1.5;
}

/* 진행률 */
.progress-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
}
.progress-bar {
    flex: 1;
    height: 10px;
    background: #edf0f7;
    border-radius: 6px;
    overflow: hidden;
}
.progress-fill {
    height: 100%;
    width: 0;
    background: linear-gradient(135deg, #a8e6cf 0%, #7fd8be 100%);
    transition: width 0.15s ease;
}
.progress-label {
    font-size: 13px;
    color: #6b7280;
    min-width: 90px;
    text-align: right;
}

/* 결과 영역 */
.result-area { margin-top: 20px; }

#resultBody h2 {
    font-size: 16px;
    margin: 26px 0 8px;
    border-bottom: 1px solid #e0e4ee;
    padding-bottom: 4px;
    color: #4b5563;
}
.rp-summary {
    background: #f0f7ff;
    border: 1px solid #dbe6f5;
    border-radius: 10px;
    padding: 12px 16px;
    font-size: 14px;
    color: #445;
}
.rp-empty { color: #8a90a2; font-size: 14px; }

/* 표 */
.rp-table {
    border-collapse: collapse;
    width: 100%;
    background: #fff;
    margin-top: 6px;
}
.rp-table th, .rp-table td {
    border: 1px solid #e0e4ee;
    padding: 6px 10px;
    font-size: 13px;
    text-align: left;
}
.rp-table th { background: #eef1fb; color: #4b5563; }
.rp-table a { color: #2e9e6b; text-decoration: none; }
.rp-table a:hover { text-decoration: underline; }
.rp-num { text-align: right; width: 70px; }
.rp-path { color: #8a90a2; font-size: 12px; word-break: break-all; }
.rp-err td { color: #c0392b; }

/* 파일 제목 + 이미지 카드 */
.rp-file {
    margin: 26px 0 8px;
    font-size: 15px;
    font-weight: 700;
    color: #2e9e6b;
    scroll-margin-top: 12px;
}
.rp-file .rp-filepath {
    font-weight: 400;
    color: #8a90a2;
    font-size: 12px;
}
.rp-card {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border: 1px solid #e0e4ee;
    border-radius: 10px;
    padding: 12px 16px;
    margin: 8px 0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.rp-ctx {
    flex: 1;
    min-width: 110px;
    font-size: 15px;
    line-height: 1.6;
    word-break: break-all;
    color: #333;
}
.rp-before { text-align: right; }
.rp-after { text-align: left; }
.rp-none { color: #b8bccb; font-style: italic; }
.rp-img { flex: 0 0 auto; text-align: center; }
.rp-img img {
    max-width: 260px;
    max-height: 220px;
    border: 1px solid #d5d9e6;
    background: #fafbfe;
    border-radius: 4px;
}
.rp-meta { font-size: 11px; color: #9298a8; margin-top: 4px; }

@media (max-width: 640px) {
    .rp-card { flex-direction: column; }
    .rp-before, .rp-after { text-align: center; }
}

/* 출력(인쇄): 결과 본문만 남기고 나머지(제목·설정·버튼·홈/언어/푸터·위젯)는 숨긴다.
   display:none 방식이라 결과가 여러 장이어도 정상적으로 페이지가 넘어간다. */
@media print {
    /* 연보라 body 배경 등 색 배경이 인쇄되지 않도록 흰 배경 강제 */
    html, body { background: #fff !important; }
    body > *:not(.container) { display: none !important; }          /* 홈버튼·언어토글·푸터·토스트·후원 위젯 */
    .container > *:not(.result-area) { display: none !important; }  /* 제목·설명·폴더 분석 패널 */
    .result-area > .panel-header { display: none !important; }      /* 결과 제목 + 다운로드/출력 버튼 */
    .container, .result-area {
        margin: 0 !important;
        padding: 0 !important;
        max-width: none !important;
        border: none !important;
        box-shadow: none !important;
        background: #fff !important;
    }
    /* 결과 내부의 옅은 배경(요약 박스·표 헤더)도 흰색으로 중화 */
    .rp-summary, .rp-table th { background: #fff !important; }
    .rp-card { break-inside: avoid; page-break-inside: avoid; }     /* 카드가 페이지 경계에서 잘리지 않게 */
}
