/* ==================================================================
   소통 게시판 (/info/talk) — 보기 방식, 피드 카드, 추천 버튼
   ------------------------------------------------------------------
   모양은 여수 집 버튼(con_com.css [class^=btn-style])과 상자(.cont)에 맞춘다.
   모서리 없음, 회색 테두리, 본문 글자는 흐리게 두지 않는다(gray-800 이상).
   ================================================================== */

/* ---- 보기 방식 (목록 / 피드) ---- */
.talk-view-bar { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; margin-bottom: .75rem; }

/* ---- 추천 버튼 ---- */
.talk-rcmd { display: inline-flex; align-items: center; gap: .3rem; height: 2rem; padding: 0 .9rem;
  border: 1px solid var(--color-gray-300); background: var(--color-white); color: var(--color-gray-800);
  font-size: .8rem; cursor: pointer; }
.talk-rcmd i { font-size: .95rem; }
.talk-rcmd:hover { border-color: var(--color-primary); }
.talk-rcmd.on { border-color: var(--color-primary); background: var(--md-tint, var(--legacy-gray-55));
  color: var(--color-primary); font-weight: 700; }
.talk-rcmd[aria-busy=true] { opacity: .6; cursor: progress; }
.talk-rcmd.is-static { cursor: default; }
.talk-rcmd.is-static:hover { border-color: var(--color-gray-300); }
.talk-rcmd:focus-visible, .talk-card-title button:focus-visible, .talk-card-stat:focus-visible,
.talk-card-more:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }

/* 상세 화면: 본문 아래 가운데 */
.talk-view-rcmd { display: flex; justify-content: center; margin-top: 1.5rem; }

/* ---- 피드 ---- */
.talk-feed-count { margin-bottom: .5rem; font-size: .8rem; color: var(--color-gray-800); }
.talk-feed-empty { padding: 2.5rem 0; text-align: center; font-size: .8rem; color: var(--color-gray-800);
  border-top: 1px solid var(--color-gray-300); border-bottom: 1px solid var(--color-gray-300); }
.talk-feed-more { margin-top: 1rem; text-align: center; }

.talk-card { padding: 1rem 1.1rem; border: 1px solid var(--color-gray-300); background: var(--color-white); }
.talk-card + .talk-card { margin-top: .6rem; }

.talk-card-head { display: flex; align-items: baseline; gap: .6rem; font-size: .8rem; }
.talk-card-writer { color: var(--color-gray-900, var(--color-gray-850)); }
.talk-card-date { color: var(--color-gray-700); }

.talk-card-title { margin: .45rem 0 .4rem; font-size: .95rem; font-weight: 700; }
.talk-card-title button { padding: 0; border: 0; background: none; color: var(--color-gray-900, var(--color-gray-850));
  font: inherit; text-align: left; cursor: pointer; }
.talk-card-title button:hover { color: var(--color-primary); text-decoration: underline; }

/* 본문은 다섯 줄까지 보이고 넘치면 잘린다. 잘렸을 때만 [본문 더 보기]가 붙는다(TalkFeed) */
.talk-card-body { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;
  white-space: pre-wrap; word-break: break-word; font-size: .85rem; line-height: 1.6; color: var(--color-gray-800); }
.talk-card-more { margin-top: .25rem; padding: 0; border: 0; background: none; font-size: .8rem;
  color: var(--color-primary); cursor: pointer; }

.talk-card-latest { margin-top: .7rem; padding: .5rem .7rem; background: var(--color-gray-100);
  font-size: .8rem; color: var(--color-gray-800); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.talk-card-latest-tit { margin-right: .5rem; color: var(--color-gray-700); }

.talk-card-foot { display: flex; align-items: center; gap: .9rem; margin-top: .8rem; padding-top: .7rem;
  border-top: 1px solid var(--color-gray-150, var(--color-gray-150)); }
.talk-card-stat { display: inline-flex; align-items: center; gap: .3rem; padding: 0; border: 0; background: none;
  font-size: .8rem; color: var(--color-gray-800); cursor: pointer; }
.talk-card-stat.is-static { cursor: default; }
.talk-card-stat:not(.is-static):hover { color: var(--color-primary); }