/**
 * 파일명: modules/policy/assets/css/policy.css
 * 대상:   /privacy · /terms 열람 화면 (modules/policy/pages/view.php · B103 U1 STEP 5)
 *         + 바닥글 약관 팝업 (modules/policy/assets/js/policy-modal.js · include/footer.php 가 모든 페이지에 로드)
 * 기준:   /news 카드 모양 · 공용 테마 변수(--surface · --hd-drawer-border · --muted · --blade · --line-strong) 재사용
 * 수정 이력:
 *   2026-10-26 최초 작성
 */

/* [약관·처리방침] 카드 */
.policy-page { max-width: 760px; margin: 0 auto; padding: 15px 7px; }
.policy-card { background: var(--surface); border: 1px solid var(--hd-drawer-border); border-radius: 14px; padding: 18px 16px; }
.policy-h1 { font-size: 19px; font-weight: 700; margin: 0 0 6px; }
.policy-meta { font-size: 12px; color: var(--muted, #888); margin: 0 0 14px; }

/* [테스트 띠] 조회 DB = 테스트 + 판 target_env = test */
.policy-band {
	margin: 0 0 14px; padding: 8px 12px; border-radius: 8px;
	background: rgba(232,160,32,.14); border: 1px solid rgba(232,160,32,.55);
	color: var(--accent-prep, #e8a020); font-size: 13px; font-weight: 700; text-align: center;
}

/* [안내] 이전 판 · 개정판 적용 준비 중 */
.policy-notice {
	margin: 0 0 16px; padding: 10px 12px; border-radius: 8px;
	background: rgba(46,167,255,.08); border: 1px solid var(--line-strong, #cbd5e1);
	font-size: 13px; line-height: 1.6;
}
.policy-notice a { color: var(--blade, #2ea7ff); font-weight: 600; margin-left: 4px; }

/* [판 원문] 허용 태그 = h2 h3 h4 p ol ul li strong em table thead tbody tr th td a br (계약 R1-3) */
.policy-body { font-size: 14px; line-height: 1.75; word-break: keep-all; overflow-wrap: anywhere; }
.policy-body h2 { font-size: 16px; font-weight: 700; margin: 26px 0 8px; }
.policy-body h3 { font-size: 15px; font-weight: 700; margin: 20px 0 6px; }
.policy-body h4 { font-size: 14px; font-weight: 700; margin: 16px 0 4px; }
.policy-body p { margin: 0 0 10px; }
.policy-body ol, .policy-body ul { margin: 0 0 10px; padding-left: 22px; }
.policy-body li { margin: 2px 0; }
.policy-body a { color: var(--blade, #2ea7ff); text-decoration: underline; }
.policy-body table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; margin: 8px 0 14px; font-size: 13px; }
.policy-body th, .policy-body td { border: 1px solid var(--line-strong, #cbd5e1); padding: 6px 8px; vertical-align: top; text-align: left; }
.policy-body th { font-weight: 700; background: rgba(46,167,255,.06); }

/* [판 목록] ?v=N */
.policy-versions { margin-top: 24px; padding-top: 14px; border-top: 1px solid var(--line-strong, #cbd5e1); }
.policy-versions-h { font-size: 14px; font-weight: 700; margin: 0 0 8px; }
.policy-versions ul { list-style: none; margin: 0; padding: 0; font-size: 13px; }
.policy-versions li { padding: 4px 0; }
.policy-versions a { color: var(--blade, #2ea7ff); }
.policy-current { margin-left: 6px; color: var(--muted, #888); font-size: 12px; }

/* [준비 중·없음·오류] 안내 문구 */
.policy-empty { padding: 18px 4px 6px; text-align: center; color: var(--muted, #888); font-size: 14px; line-height: 1.7; }
.policy-empty a { color: var(--blade, #2ea7ff); font-weight: 600; }

/* [팝업] 바닥글 약관 링크 → 모달 (policy-modal.js)
   딤·블러·겹침 순서 = common.css .adm-modal-bg · 상자 색·테두리·그림자·다크 = .adm-modal 재사용 → 여기서는 크기·배치만 */
.policy-modal {
	width: min(760px, calc(100vw - 32px)); max-width: none; max-height: 85vh;
	padding: 0; display: flex; flex-direction: column; overflow: hidden;
}
.policy-modal-head { display: flex; justify-content: flex-end; padding: 8px 8px 0; flex-shrink: 0; }
.policy-modal-close {
	width: 36px; height: 36px; border: none; border-radius: 8px; background: transparent;
	color: var(--muted, #888); font-size: 18px; line-height: 1; cursor: pointer;
}
.policy-modal-close:hover, .policy-modal-close:focus-visible { background: var(--line); color: var(--text); }
.policy-modal-body { overflow-y: auto; overscroll-behavior: contain; padding: 0 20px 20px; outline: none; }
.policy-modal-body .policy-card { background: none; border: none; border-radius: 0; padding: 0; }
.policy-modal-msg { padding: 24px 4px 0; text-align: center; color: var(--muted, #888); font-size: 14px; line-height: 1.7; }
.policy-modal-msg a { color: var(--blade, #2ea7ff); font-weight: 600; }
/* 모바일 = 화면 전체 (사이트 기존 경계 619.98px) */
@media (max-width: 619.98px) {
	.policy-modal { width: 100%; height: 100vh; height: 100dvh; max-height: none; border: none; border-radius: 0; }
	.policy-modal-body { padding: 0 16px 24px; }
}