/* ================================================================
   LandDoc 공통 스타일
   대표 색상: 벽돌 다크레드 (#812B27)

   [섹션 목차]
   1. 리셋 / 기본
   2. 헤더 / 메인 컨테이너 / 카드
   3. 히어로 / 버튼
   4. STEP 진행 표시 / 숨김·표시
   5. 서비스 카드 그리드 (index.html)
   6. STEP 1: 주소 검색 (입력, V-World, 결과 목록, 동호수)
   7. STEP 2: 통합 서류 선택 + 발급 (툴바, 서류행, 드롭다운, 진행도)
   8. 모달 공통 / 비용 확인 모달
   9. PDF 열람 모달 (PDF.js 뷰어)
   10. 인라인 요약 패널 (등기사항요약)
   11. 반응형 (600px 이하 모바일)
   12. 등기사항요약 summary-row 스타일
   ================================================================ */

/* ── 리셋: PropVis reset.css 사용. landdoc 전용 *,body,.header 룰은 제거 (naviBar 충돌 방지) ── */

/* ── 사이드바(naviBar) 제거 대응 — 공적장부조회는 새 창 단독 페이지로 열림 ──
   style.css의 .main-box {margin-left:260px; margin-top:60px}(사이드바·헤더 전제)를
   상쇄하여 좌측 빈 공간 없이 전체 폭을 사용한다. (landdoc css가 가장 마지막 로드되어 오버라이드) */
.main-box { margin-left: 0; margin-top: 0; }

/* ── 메인 컨테이너 ── */
.container {
    max-width: 920px;
    margin: 40px auto;
    padding: 0 20px;
}

/* ── 카드 ── */
.card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    padding: 32px;
    margin-bottom: 24px;
}

.card-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #812B27;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e8c5c3;
}

/* ── 메인 페이지 히어로 ── */
.hero {
    text-align: center;
    padding: 60px 24px;
}

.hero h1 {
    font-size: 2rem;
    font-weight: 700;
    color: #1a202c;
    margin-bottom: 12px;
}

.hero p {
    font-size: 1rem;
    color: #718096;
    margin-bottom: 32px;
}

/* ── 버튼 ── */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    border: none;
    text-decoration: none;
    transition: background-color 0.2s, transform 0.1s;
    white-space: nowrap;
}

.btn:active { transform: scale(0.98); }

.btn-primary {
    background-color: #812B27;
    color: #fff;
}

.btn-primary:hover { background-color: #6B2320; }

/* 보조 버튼 — 따뜻한 회색 (개별발급, 열람, 뒤로가기 등) */
.btn-secondary {
    background-color: #e8dcd8;
    color: #4a3530;
}

.btn-secondary:hover { background-color: #d9cac5; }

.btn-lg {
    padding: 16px 48px;
    font-size: 1.1rem;
}

.btn-sm {
    padding: 5px 12px;
    font-size: 0.78rem;
    border-radius: 6px;
}

/* 무료열람 — 메인색 밝은 톤 (따뜻한 테라코타) */
.btn-success {
    background-color: #B85C52;
    color: #fff;
}

.btn-success:hover { background-color: #A04A40; }

/* 신규열람 — 따뜻한 경고 톤 (앰버 브라운) */
.btn-warning {
    background-color: #C47A3A;
    color: #fff;
}

.btn-warning:hover { background-color: #A8642E; }

/* 재시도/실패 — 어두운 레드 */
.btn-danger {
    background-color: #9B3030;
    color: #fff;
}

.btn-danger:hover { background-color: #7E2525; }

/* 요약 버튼 — 따뜻한 로즈브라운 */
.btn-summary {
    background-color: #8C5A5A;
    color: #fff;
}

.btn-summary:hover { background-color: #744949; }

.btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── STEP 진행 표시 ── */
.step-indicator {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 28px;
}

.step-badge {
    background-color: #812B27;
    color: #fff;
    border-radius: 20px;
    padding: 4px 14px;
    font-size: 0.8rem;
    font-weight: 600;
}

.step-label {
    font-size: 0.95rem;
    color: #4a5568;
}

/* ── 숨김/표시 ── */
.hidden { display: none !important; }

/* ── 서비스 카드 그리드 (index.html 제공 서비스) ── */
.property-type-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-top: 8px;
}

.property-card {
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    padding: 20px 16px;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s, background-color 0.15s, transform 0.1s;
    background: #fff;
    user-select: none;
}

.property-card:hover {
    border-color: #c4918b;
    background-color: #faf0ef;
}

.property-card.selected {
    border-color: #812B27;
    background-color: #faf0ef;
}

.property-card:active { transform: scale(0.97); }

.property-card .icon {
    font-size: 2rem;
    margin-bottom: 8px;
}

.property-card .name {
    font-size: 0.95rem;
    font-weight: 700;
    color: #2d3748;
    margin-bottom: 4px;
}

.property-card .desc {
    font-size: 0.78rem;
    color: #718096;
}

.property-card.selected .name {
    color: #812B27;
}

/* ================================================================
   STEP 1: 주소 검색
   ================================================================ */

/* ── 주소 검색 입력 ── */
.address-input-wrap {
    display: flex;
    gap: 10px;
}

.address-input-wrap input {
    flex: 1;
    padding: 12px 16px;
    border: 1.5px solid #cbd5e0;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #2d3748;
    background: #f7fafc;
    cursor: pointer;
}

.address-input-wrap input:focus {
    outline: none;
    border-color: #812B27;
}

.address-detail {
    margin-top: 10px;
    padding: 10px 14px;
    background: #f7fafc;
    border-radius: 8px;
    font-size: 0.88rem;
    color: #718096;
    min-height: 36px;
}

/* ── V-World 주소 검색 ── */
.address-search-wrap {
    margin-top: 12px;
}

.search-tabs {
    display: flex;
    gap: 0;
    margin-bottom: 12px;
}

.search-tab {
    flex: 1;
    padding: 10px 16px;
    border: 1.5px solid #cbd5e0;
    background: #f7fafc;
    color: #718096;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.search-tab:first-child {
    border-radius: 8px 0 0 8px;
    border-right: none;
}

.search-tab:last-child {
    border-radius: 0 8px 8px 0;
}

.search-tab.active {
    background: #812B27;
    color: #fff;
    border-color: #812B27;
}

.search-input-wrap {
    display: flex;
    gap: 8px;
}

.search-input-wrap input {
    flex: 1;
    padding: 12px 16px;
    border: 1.5px solid #cbd5e0;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #2d3748;
    background: #fff;
}

.search-input-wrap input:focus {
    outline: none;
    border-color: #812B27;
    box-shadow: 0 0 0 3px rgba(129, 43, 39, 0.1);
}

.search-btn {
    padding: 12px 20px;
    background: #812B27;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.search-btn:hover {
    background: #6b2320;
}

.search-guide {
    margin-top: 10px;
    padding: 12px 14px;
    background: #f7fafc;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #718096;
}

.guide-example {
    margin-top: 4px;
    color: #a0aec0;
    font-size: 0.8rem;
}

.search-results {
    margin-top: 8px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    max-height: 400px;
    overflow-y: auto;
}

/* ── 검색 결과 목록 (V-World 응답 렌더링) ── */
.results-header {
    padding: 8px 14px;
    background: #f7fafc;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.82rem;
    color: #718096;
}

.result-item {
    padding: 12px 16px;
    cursor: pointer;
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.15s;
}

.result-item:last-child { border-bottom: none; }
.result-item:hover { background: #f5ddd9; }

.result-road {
    font-weight: 600;
    color: #2d3748;
    font-size: 0.92rem;
}

.result-jibun {
    font-size: 0.8rem;
    color: #718096;
    margin-top: 2px;
}

.result-bldnm {
    font-size: 0.78rem;
    color: #812B27;
    margin-top: 2px;
}

.result-zipcode {
    font-size: 0.75rem;
    color: #a0aec0;
    margin-top: 2px;
}

.search-loading {
    margin-top: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    color: #718096;
    font-size: 0.85rem;
}

.search-empty {
    margin-top: 12px;
    padding: 20px 14px;
    text-align: center;
    color: #718096;
    font-size: 0.88rem;
}

.search-empty-tip {
    margin-top: 4px;
    font-size: 0.8rem;
    color: #a0aec0;
}

/* ── 동호수 선택 (STEP 1-C) ── */
.dong-ho-wrap {
    display: flex;
    gap: 16px;
    margin-top: 16px;
}

.form-group {
    flex: 1;
}

.form-group label {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: #4a5568;
    margin-bottom: 6px;
}

.form-group input {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid #cbd5e0;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #2d3748;
}

.form-group input:focus {
    outline: none;
    border-color: #812B27;
}

.form-group select {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid #cbd5e0;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #2d3748;
    background-color: #fff;
    appearance: auto;
    cursor: pointer;
}

.form-group select:focus {
    outline: none;
    border-color: #812B27;
}

/* ── 하단 액션 영역 ── */
.action-bar {
    display: flex;
    justify-content: flex-end;
    margin-top: 24px;
    gap: 10px;
}

/* ================================================================
   STEP 2: 통합 서류 선택 + 발급
   ================================================================ */

/* ── 상단 바 (전체선택 + 비용 + 발급 버튼) ── */
.issue-toolbar {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    background: #f7fafc;
    border-radius: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.issue-toolbar .select-all-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
}

.issue-toolbar .select-all-wrap input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #812B27;
    cursor: pointer;
}

.issue-toolbar .select-all-label {
    font-size: 0.9rem;
    font-weight: 600;
    color: #4a5568;
}

.issue-toolbar .cost-display {
    margin-left: auto;
    font-size: 0.9rem;
    color: #4a5568;
}

.issue-toolbar .cost-display .cost-amount {
    font-weight: 700;
    color: #812B27;
    font-size: 1rem;
}

/* 유료 경고 메시지 */
.paid-warning {
    width: 100%;
    padding: 8px 12px;
    background: #fef3c7;
    color: #92400e;
    border-radius: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    margin-top: 4px;
    display: none;
}

.paid-warning.show { display: block; }

/* ── 서류 카테고리 그룹 ── */
.doc-category {
    margin-bottom: 20px;
}

.doc-category-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 2px solid #e8c5c3;
    margin-bottom: 12px;
}

.doc-category-icon {
    font-size: 1.2rem;
}

.doc-category-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: #812B27;
}

/* ================================================================
   서류 행 레이아웃 (PC)
   상단: [체크][이름+가격]                    [무료열람][개별발급]
   중단: 열람기록(왼) ··········· [현재유효▼] ☑공동담보 ☑매매 ☑요약(오)
   ================================================================ */
.doc-row {
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    margin-bottom: 10px;
    background: #fff;
    transition: border-color 0.15s, background 0.15s;
    position: relative;
    /* 2026-04-17: overflow:hidden 제거 — 커스텀 드롭다운(.dd-menu)이
       카드 경계 밖으로 펼쳐지도록. 내부 배경색/모서리 초과 자식 없어 시각 영향 없음 */
}

/* 드롭다운이 열린 행은 아래 행 위로 겹쳐 보여야 함 (z-index 상승) */
.doc-row:has(.custom-dropdown.open) {
    z-index: 10;
}

.doc-row:hover {
    border-color: #c4918b;
}

.doc-row.checked {
    border-color: #812B27;
    background: #faf0ef;
}

.doc-row.disabled {
    opacity: 0.5;
    pointer-events: none;
    background: #f9fafb;
}

/* 메인 행 — 이름+가격 왼쪽, 버튼 오른쪽 (수직 중앙정렬) */
.doc-row-main {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px 8px;
}

/* 체크박스 — 수직 중앙정렬 */
.doc-row-checkbox {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.doc-row-checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #812B27;
    cursor: pointer;
    margin: 0;
}

/* 서류 이름 + 가격 뱃지 — 수직 중앙정렬 */
.doc-row-label {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    line-height: 1;
}

.doc-row-name {
    font-size: 0.9rem;
    font-weight: 700;
    color: #2d3748;
}

.price-badge {
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 10px;
    white-space: nowrap;
}

.price-badge.paid {
    background: #fef3c7;
    color: #92400e;
}

.price-badge.free {
    background: #e8dcd8;
    color: #5a3a36;
}

.coming-soon-badge {
    background: #e2e8f0;
    color: #718096;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
}

/* 스페이서 — 이름과 버튼 사이 공간 */
.doc-row-spacer {
    flex: 1;
}

/* 액션 버튼 영역 — 오른쪽 끝 */
.doc-row-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* 서브옵션 행 — 열람기록(왼) + 세부사항(오) 양쪽 끝 배치 */
.doc-sub-options-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 0 14px 8px;
    margin-top: 2px;
}

/* 열람기록 없으면 세부사항만 오른쪽 끝으로 */
.doc-sub-options-row.no-reopen {
    justify-content: flex-end;
}

.doc-sub-options {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 0.78rem;
    color: #4a5568;
}

.doc-sub-options label {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.doc-sub-options input[type="checkbox"] {
    width: 13px;
    height: 13px;
    accent-color: #812B27;
}

/* ── 커스텀 드롭다운 (시안 8: 화이트 + 쉐도우) ── */
.custom-dropdown {
    position: relative;
    display: inline-block;
}

.dd-trigger {
    padding: 4px 10px;
    border: none;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,0.1);
    font-size: 0.78rem;
    font-weight: 600;
    color: #2d3748;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: box-shadow 0.2s;
    white-space: nowrap;
}

.dd-trigger:hover { box-shadow: 0 2px 8px rgba(0,0,0,0.15); }

.dd-trigger .arrow {
    font-size: 0.55rem;
    color: #812B27;
    transition: transform 0.2s;
}

.custom-dropdown.open .dd-trigger {
    box-shadow: 0 4px 16px rgba(129,43,39,0.18);
}

.custom-dropdown.open .dd-trigger .arrow {
    transform: rotate(180deg);
}

.dd-menu {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    min-width: 150px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    z-index: 100; /* 서류행(.doc-row) 위로 드롭다운 표시 — doc-row:has(.open) z-index:10과 조합 */
    overflow: hidden;
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
    transition: opacity 0.2s, transform 0.2s;
}

.custom-dropdown.open .dd-menu {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.dd-menu .dd-item {
    padding: 8px 12px;
    font-size: 0.78rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: background 0.15s;
    color: #2d3748;
}

.dd-menu .dd-item:hover { background: #fff5f5; }

.dd-menu .dd-item.selected {
    color: #812B27;
    font-weight: 600;
}

.dd-menu .dd-item .check-icon {
    width: 14px;
    text-align: center;
    font-size: 0.72rem;
}

/* ── 하단 보조 정보 (재열람 날짜, 진행도, 실패) ── */
.doc-row-sub {
    padding: 0 14px 10px 44px;
}

/* 재열람 날짜 (작게) */
.doc-reopen-date {
    font-size: 0.75rem;
    color: #718096;
}

.doc-reopen-date .date-val {
    font-weight: 600;
    color: #812B27;
}

/* ── 발급 진행 상태 ── */
.doc-progress {
    width: 100%;
    margin-top: 4px;
    display: none;
}

.doc-progress.active { display: block; }

.progress-bar-wrap {
    height: 5px;
    background: #e2e8f0;
    border-radius: 3px;
    overflow: hidden;
}

.progress-bar {
    height: 100%;
    background: linear-gradient(90deg, #812B27, #a8504a);
    border-radius: 3px;
    width: 0%;
    transition: width 0.3s ease;
}

.progress-text {
    font-size: 0.75rem;
    color: #812B27;
    font-weight: 600;
    margin-top: 3px;
}

/* 스피너 (인라인, 작은 사이즈) */
.spinner-sm {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid #e2e8f0;
    border-top-color: #812B27;
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

/* 실패 메시지 */
.doc-fail-msg {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    font-size: 0.78rem;
}

/* ================================================================
   모달 공통
   ================================================================ */
.modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 9999; /* 모든 콘텐츠 위에 모달 표시 (로딩 오버레이와 동일) */
    justify-content: center;
    align-items: center;
    padding: 20px;
}

.modal-overlay.active { display: flex; }

.modal-box {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 8px 40px rgba(0,0,0,0.2);
    max-width: 500px;
    width: 100%;
    max-height: 80vh;
    overflow-y: auto;
    padding: 28px;
}

.modal-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #2d3748;
    margin-bottom: 16px;
}

.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 24px;
}

.modal-cost-list {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
}

.modal-cost-item {
    display: flex;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 0.88rem;
}

.modal-cost-item:last-child { border-bottom: none; }

.modal-cost-item.total {
    background: #f7fafc;
    font-weight: 700;
    font-size: 0.95rem;
}

.modal-cost-item .cost-val {
    color: #812B27;
    font-weight: 700;
}

.modal-cost-item .cost-val.free { color: #5a3a36; }

.modal-subtitle {
    font-size: 0.88rem;
    color: #718096;
    margin-bottom: 12px;
}

.modal-notice {
    margin-top: 12px;
    padding: 10px 12px;
    background: #faf0ef;
    border-radius: 6px;
    font-size: 0.82rem;
    color: #6B2320;
}

/* ================================================================
   PDF 열람 모달
   ================================================================ */
.pdf-modal-box {
    max-width: 90vw;
    width: 100%;
    max-height: 98vh; /* PDF 열람 공간 최대 확보 */
    padding: 0;
    display: flex;
    flex-direction: column;
}

.pdf-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
}

.pdf-modal-header .title {
    font-size: 1rem;
    font-weight: 700;
    color: #2d3748;
}

.pdf-modal-body {
    flex: 1;
    padding: 0;
    overflow: auto;
    background: #525659; /* PDF 배경 — 어두운 회색 */
    min-height: 85vh; /* PDF 본문 영역 최대 확보 */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

/* PDF 모달 좌우 페이지 넘기기 버튼 (PC 전용) */
.pdf-modal-box {
    position: relative; /* 좌우 버튼 absolute 기준점 */
}

.pdf-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.3);
    color: #fff;
    border: none;
    font-size: 48px;
    padding: 20px 10px;
    cursor: pointer;
    z-index: 10;
    border-radius: 4px;
    transition: background 0.2s;
    line-height: 1;
}

.pdf-nav-btn:hover {
    background: rgba(0,0,0,0.6);
}

.pdf-nav-prev { left: 8px; }
.pdf-nav-next { right: 8px; }

/* PDF.js 캔버스 래퍼 */
#pdfCanvasWrap {
    flex: 1;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start; /* flex-start + auto margin — 확대 시 위쪽 잘림 방지 */
    padding: 12px 0;
    overflow: auto;
}

/* 드래그 이동 커서 (줌 > 100% 시) */
#pdfCanvasWrap.draggable { cursor: grab; }
#pdfCanvasWrap.dragging  { cursor: grabbing; }

/* PDF.js 캔버스 */
#pdfCanvas {
    display: block;
    box-shadow: 0 2px 12px rgba(0,0,0,0.3);
    background: #fff;
    margin: auto; /* 컨테이너보다 작을 때 중앙 정렬, 클 때 top-left에서 스크롤 */
}

/* PDF.js 툴바 — 페이지 이동 + 확대/축소 */
.pdf-toolbar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 8px 16px;
    background: #3a3a3a;
    border-bottom: 1px solid #555;
    flex-shrink: 0;
}

.pdf-toolbar-group {
    display: flex;
    align-items: center;
    gap: 6px;
}

.pdf-toolbar-btn {
    background: #555;
    color: #fff;
    border: 1px solid #666;
    border-radius: 4px;
    padding: 4px 12px;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.15s;
    line-height: 1.4;
}

.pdf-toolbar-btn:hover {
    background: #777;
}

.pdf-toolbar-btn:active {
    background: #888;
}

.pdf-page-info, .pdf-zoom-level {
    color: #e0e0e0;
    font-size: 13px;
    min-width: 60px;
    text-align: center;
    user-select: none;
}

.dummy-pdf {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    width: 100%;
    max-width: 500px;
    padding: 40px 30px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.dummy-pdf h3 {
    text-align: center;
    color: #812B27;
    margin-bottom: 20px;
    font-size: 1rem;
}

.dummy-pdf .line {
    height: 10px;
    background: #e2e8f0;
    border-radius: 4px;
    margin-bottom: 10px;
}

.dummy-pdf .line.short { width: 60%; }
.dummy-pdf .line.medium { width: 80%; }
.dummy-pdf .line.long { width: 100%; }

.dummy-pdf .section-title {
    height: 14px;
    width: 40%;
    background: #cbd5e0;
    border-radius: 4px;
    margin: 20px 0 10px;
}

/* ── 인라인 요약 패널 (아코디언) ── */
/* 등기부등본 발급 완료 후 [요약] 버튼 클릭 시 doc-row 하단에 펼쳐지는 요약 정보 */
/* max-height는 JS에서 scrollHeight 기반으로 동적 설정 → CSS transition으로 애니메이션 */
.inline-summary {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease, padding 0.35s ease, opacity 0.25s ease;
    opacity: 0;
    background: #faf8f7;
    border-top: 1px dashed #e8dcd8;
    border-radius: 0 0 8px 8px;
    margin: 0 4px;
}

/* max-height는 JS에서 동적으로 설정 (콘텐츠 높이에 맞게 조정) */
.inline-summary.open {
    opacity: 1;
    padding: 16px 18px;
}

.inline-summary-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.inline-summary-title {
    font-size: 0.92rem;
    font-weight: 700;
    color: #812B27;
}

.btn-copy {
    padding: 4px 10px;
    border-radius: 6px;
    background: #e8dcd8;
    border: none;
    font-size: 0.72rem;
    font-weight: 600;
    color: #4a3530;
    cursor: pointer;
    transition: background 0.15s;
    position: relative;
}

.btn-copy:hover { background: #d9cac5; }

.btn-copy .copy-feedback {
    position: absolute;
    top: -28px;
    left: 50%;
    transform: translateX(-50%);
    background: #812B27;
    color: #fff;
    font-size: 0.68rem;
    padding: 3px 8px;
    border-radius: 4px;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 0.2s;
    pointer-events: none;
}

.btn-copy .copy-feedback.show { opacity: 1; }

.summary-text {
    padding: 14px 16px;
    background: #fff;
    border-radius: 8px;
    font-size: 0.82rem;
    line-height: 1.8;
    color: #2d3748;
    white-space: pre-wrap;
    word-break: keep-all;
    font-family: 'Noto Sans KR', sans-serif;
}

/* ================================================================
   반응형 — 600px 이하 (모바일)
   브레이크포인트 600px: 스마트폰 세로 모드 기준
   PDF 열람은 모바일에서 새 탭으로 열리므로 (pdf-viewer.js 판별)
   PDF 관련 UI는 최소화
   ================================================================ */
@media (max-width: 600px) {
    .container { margin: 20px auto; }
    .card { padding: 20px 16px; }
    .hero h1 { font-size: 1.4rem; }

    /* ── 상단 헤더: 모바일 축소 — 한 줄 유지 ── */
    .header {
        padding: 10px 12px;        /* 여백 축소 */
        gap: 6px;                  /* 요소 간격 축소 */
        flex-wrap: nowrap;         /* 줄바꿈 방지 */
    }
    .header .logo {
        font-size: 1.05rem;       /* 로고 글자 축소 */
        flex-shrink: 0;
    }
    .header .subtitle {
        font-size: 0.65rem;       /* 부제목 글자 축소 */
        white-space: nowrap;       /* 부제목 줄바꿈 방지 */
        overflow: hidden;
        text-overflow: ellipsis;   /* 넘치면 말줄임 */
        min-width: 0;
        flex-shrink: 1;            /* 공간 부족 시 줄어들도록 */
    }
    .header nav {
        gap: 8px !important;       /* 네비 간격 축소 (inline style override) */
        flex-shrink: 0;
    }
    .header nav a {
        font-size: 0.75rem !important; /* 관리자/로그아웃 글자 축소 */
        white-space: nowrap;
    }

    /* ── 상단 툴바: 한 줄에 수평 배치 ── */
    .issue-toolbar {
        padding: 10px 12px;
        gap: 8px;
        flex-wrap: nowrap;
        align-items: center;
    }
    .issue-toolbar .select-all-wrap {
        gap: 4px;
        flex-shrink: 0;
    }
    .issue-toolbar .select-all-wrap input[type="checkbox"] {
        width: 15px;
        height: 15px;
    }
    .issue-toolbar .select-all-label {
        font-size: 0.75rem;
    }
    .issue-toolbar .cost-display {
        margin-left: auto;
        font-size: 0.75rem;
        flex-shrink: 0;
    }
    .issue-toolbar .cost-display .cost-amount {
        font-size: 0.82rem;
    }
    .issue-toolbar .btn {
        padding: 6px 12px;
        font-size: 0.72rem;
        flex-shrink: 0;
    }

    /* ── 서류 행: 이름+가격+버튼 같은 줄 ── */
    .doc-row-main {
        flex-wrap: nowrap;
        gap: 6px;
    }
    .doc-row-label {
        gap: 4px;
        flex-shrink: 1;
        min-width: 0;
    }
    .doc-row-label .doc-row-name {
        font-size: 0.82rem;
    }
    .doc-row-label .price-badge {
        font-size: 0.65rem;
        padding: 1px 5px;
    }
    .doc-row-actions {
        width: auto;
        margin-top: 0;
        flex-shrink: 0;
        gap: 4px;
    }
    .doc-row-actions .btn-sm {
        padding: 3px 8px;
        font-size: 0.68rem;
    }

    /* ── 발급 완료 결과 버튼: 모바일에서 아랫줄로 ── */
    .doc-row-main:has(.result-mode) {
        flex-wrap: wrap;
    }
    .doc-row-actions.result-mode {
        width: 100%;
        justify-content: flex-end;
        margin-top: 2px;
    }

    /* ── 세부사항/열람기록: 세부사항 먼저(오른쪽 정렬), 열람기록 아래 ── */
    .doc-sub-options-row {
        flex-direction: column;
        align-items: flex-end;
        padding-left: 14px;
        gap: 6px;
    }
    .doc-sub-options-row .doc-reopen-date {
        order: 2;
        font-size: 0.72rem;
    }
    .doc-sub-options-row .doc-sub-options {
        order: 1;
    }
    .doc-sub-options-row.no-reopen {
        align-items: flex-end;
    }

    .property-type-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .dong-ho-wrap { flex-direction: column; gap: 12px; }
    .modal-box { padding: 20px; }
    .pdf-modal-body { min-height: 300px; padding: 0; }
    /* 모바일에서는 좌우 페이지 넘기기 버튼 숨김 (새 탭으로 열리므로 불필요) */
    .pdf-nav-btn { display: none !important; }
}

/* ================================================================
   등기사항요약 스타일 (Round 2 #2: summary-row 기반으로 변경)
   ================================================================ */
.summary-row {
    padding: 8px 0;
    border-bottom: 1px solid #edf2f7;
    font-size: 0.9rem;
    line-height: 1.6;
}
.summary-row:last-of-type { border-bottom: none; }
.summary-label {
    font-weight: 600;
    color: #4a5568;
    display: block;
    margin-bottom: 2px;
}
.summary-value {
    color: #2d3748;
    white-space: pre-wrap;
    word-break: break-all;
}