/*
 * FAQ 답변 본문(관리자 HTML) 표시 보정 — CH-U-CO-02-01-01.
 *
 * 목업 CSS(page/community.css 531행)는 **더미 한 줄 답변**을 기준으로 작성됐다.
 *   .page-community.faq .faq-answer .answer-text > p { display:flex; height:32px; align-items:center }
 * 실제 답변(`NTT_CN`)은 `<br>` 로 여러 줄이거나 목록·표·이미지를 담아 32px 상자를 넘치고,
 * 넘친 글자가 다음 아코디언 항목 위로 겹쳐 보인다.
 *
 * 여기서는 **높이 제약만 푼다** — 고정 높이를 다른 고정 높이로 덮지 않는다. 그 밖에는 목업이
 * 정의하지 않은 요소(끊기지 않는 긴 URL·불릿 목록·표·이미지)의 넘침만 막는다.
 * sanitizer(boardHtml.ts)의 허용 목록은 손대지 않는다 — 여기 있는 것은 표시 규칙뿐이다.
 */

/* 1) 답변 문단 — 한 줄 리듬(32px)은 최소 높이로 남기고 내용만큼 늘어나게 한다 */
.page-community.faq .faq-answer .answer-text > p {
  height: auto;
  min-height: 32px;
}

/* 2) 끊기지 않는 긴 문자열(URL·영문)이 가로로 삐져나오지 않게 한다 */
.page-community.faq .faq-answer .answer-text {
  overflow-wrap: anywhere;
}

/* 3) 불릿 목록 — 목업은 `ol`(decimal)만 정의한다. 공용 reset(Meyer)이 list-style 을 지워
      `ul` 은 표식과 들여쓰기가 사라진다. 목업의 `ol` 규격에 맞춘다. */
.page-community.faq .faq-answer .answer-text ul {
  margin-top: 8px;
  padding-left: 18px;
  list-style: disc;
  list-style-position: outside;
}

/* 4) 표 — 열이 많아도 답변 폭을 넘지 않게 고정 레이아웃으로 접는다 */
.page-community.faq .faq-answer .answer-text table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

.page-community.faq .faq-answer .answer-text th,
.page-community.faq .faq-answer .answer-text td {
  padding: 6px 8px;
  border: 1px solid var(--color-line);
  overflow-wrap: anywhere;
  vertical-align: top;
}

/* 5) 이미지 — reset 의 `img { width: 100% }` 때문에 작은 이미지도 늘어난다.
      본문 이미지는 원본 크기를 유지하고 폭만 컨테이너로 제한한다. */
.page-community.faq .faq-answer .answer-text img {
  width: auto;
  max-width: 100%;
  height: auto;
}
