/* ============================================
   Board Single — 단일 글 공통 카드 컴포넌트
   ============================================
   공지(ocs_notice)·패치(ocs_patch)·건의함(ocs-suggestions)이
   함께 쓰는 카드형 단일 페이지. 브레드크럼·제목·메타·박스를 담당한다.

   - 페이지 래퍼: board-head.css 의 .ocs-sug-page 공유
   - 본문 타이포: single.css 의 .article-content (+ article-deco.css) 재사용
   - 확인 명단: single.css 의 .ocs-reads-receipts 재사용
   ============================================ */

/* 브레드크럼 */
.board-single-bc {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 16px;
    font-size: 14px;
}
.board-single-bc__root { color: var(--brass); font-weight: 700; text-decoration: none; }
.board-single-bc__root:hover { text-decoration: underline; }
.board-single-bc__sep { color: var(--muted); }

/* 카드 박스 */
.board-single {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm, 4px);
    padding: 32px 36px;
    box-shadow: var(--shadow-card, 0 1px 2px rgba(0,0,0,.04));
}

/* 헤더 — 제목 + 메타 */
.board-single__head {
    padding-bottom: 18px;
    margin-bottom: 22px;
    border-bottom: 1px solid var(--line);
}
.board-single__title {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 10px;
    line-height: 1.4;
    letter-spacing: -0.01em;
    color: var(--ink);
    word-break: keep-all;
}

/* 메타 — 라벨(회색) + 값(진하게), 번호는 brass */
.board-single__meta {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px 14px;
    font-size: 13px;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}
.board-single__meta-item { display: inline-flex; align-items: baseline; gap: 6px; }
.board-single__meta-label { color: var(--muted); font-weight: 400; }
.board-single__meta-val { color: var(--ink-soft); font-weight: 600; }
.board-single__no { color: var(--brass); font-weight: 700; letter-spacing: 0.04em; }

/* 본문 — .article-content 재사용, 카드 안에서는 상단 여백 제거 */
.board-single .article-content { margin-top: 0; }

/* 카드 페이지의 푸터 내비는 카드 폭에 맞춤 (single.css 기본은 좁은 폭) */
.ocs-sug-page > .article-foot { max-width: none; margin: 40px 0 0; }

@media (max-width: 640px) {
    .board-single { padding: 22px 18px; }
    .board-single__title { font-size: 19px; }
}