/* 글 추천·신고 (글 보기 아래 단추, 목록의 추천 수, 신고 화면). 색은 community.css 의 테마를 따릅니다. */

/* ---------- 글 보기: 추천 · 신고 ---------- */
.community-page .post-reactions {
  position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 14px;
  padding: 22px 30px 26px; border-top: 1px solid #3b5055;
}
.site-main .community-page .recommend-button {
  display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 10px 22px;
  border: 1px solid #6d999f; border-radius: 999px; background: #223a3f; color: #e6f3f2;
  font-size: 15px; font-weight: 700; cursor: pointer; box-shadow: inset 0 1px #ffffff12, 0 3px 0 #10191c;
}
.site-main .community-page .recommend-button svg { width: 20px; height: 20px; }
.site-main .community-page .recommend-button strong { min-width: 1.5ch; color: #ffd398; font-variant-numeric: tabular-nums; }
.site-main .community-page .recommend-button:hover:not(:disabled) { background: #2e5158; border-color: #9fd3d8; }
.site-main .community-page .recommend-button:focus-visible { outline: 2px solid #ffd398; outline-offset: 2px; }
.site-main .community-page .recommend-button[aria-pressed="true"] { background: linear-gradient(#ffd398, #ecaa60); border-color: #f5c790; color: #322517; box-shadow: inset 0 1px #ffead099, 0 3px 0 #80582e; }
.site-main .community-page .recommend-button[aria-pressed="true"] strong { color: #322517; }
.site-main .community-page .recommend-button:disabled { cursor: default; opacity: 1; border-style: dashed; color: #c3d3d5; }
.community-page .report-link {
  display: inline-flex; align-items: center; gap: 5px; min-height: 44px; padding: 0 12px;
  color: #b9cdd0; font-size: 13px; text-decoration: none; border-radius: 8px;
}
.community-page .report-link svg { width: 16px; height: 16px; }
.community-page .report-link:hover { color: #ffb4a8; background: #2a2f31; }
.site-main .community-page .recommend-message { flex-basis: 100%; min-height: 0; color: #ffd398; font-size: 12px; text-align: center; }
.site-main .community-page .recommend-message:empty { display: none; }

/* 목록: 제목 옆 추천 수 */
.community-page .board-recommends { flex: none; display: inline-flex; align-items: center; gap: 4px; color: #ffd398; font-size: 12px; }
.community-page .board-article-stats a[href="#post-reactions"] svg { width: 14px; height: 14px; }

/* ---------- 신고 화면 ---------- */
.community-page .report-target { display: grid; gap: 6px; padding: 14px 16px; border-left: 4px solid #88c4ca; border-radius: 0 8px 8px 0; background: #1a2427; }
.site-main .community-page .report-target p { color: #c8d8da; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.site-main .community-page .report-target .report-target-label { color: #eef4f3; font-size: 15px; font-weight: 700; }
.community-page .report-reasons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 8px 0 0; padding: 0; border: 0; min-width: 0; }
.site-main .community-page .report-reasons legend { margin-bottom: 10px; font-size: 14px; font-weight: 700; }
.community-page .report-reasons legend span { margin-left: 5px; color: #f6c185; font-size: 11px; }
.site-main .community-page .report-reason {
  display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 14px;
  border: 1px solid #3f565b; border-radius: 8px; background: #1d292d; font-size: 14px; font-weight: 400; cursor: pointer;
}
/* 글쓰기 칸 모양(.board-editor input: 높이 48px·안쪽 여백)이 라디오 단추에 섞이지 않게 */
.site-main .community-page .report-form .report-reason input[type="radio"] {
  flex: none; width: 18px; height: 18px; min-height: 0; margin: 0; padding: 0; border: 0; background: none;
  appearance: auto; accent-color: #f6b86e;
}
.community-page .report-reason:has(input:checked) { border-color: #f5c790; background: #3a3124; }
.community-page .report-reason:has(input:focus-visible) { outline: 2px solid #ffd398; outline-offset: 2px; }
.site-main .community-page .report-form textarea { min-height: 120px; }

@media (max-width: 620px) {
  .community-page .post-reactions { padding: 18px 20px 22px; }
  .community-page .report-reasons { grid-template-columns: 1fr; }
}

/* 묶음 탭은 게시판 화면에서 community.css 의 간격(grid gap)을 따릅니다 */
.site-main .community-page .section-tabs { margin: 0; }