/* knowledge news detail layout */
body.know-page { background: var(--gray-100); }
.know-detail { max-width:1200px; margin:0 auto; padding:32px 24px 60px; display:grid; grid-template-columns:1fr 320px; gap:34px; align-items:start; }
.know-article { background:#fff; border-radius:14px; box-shadow:0 2px 16px rgba(0,0,0,.08); padding:34px 40px 36px; overflow:hidden; }
.know-cover { width:100%; border-radius:10px; overflow:hidden; margin-bottom:26px; display:block; }

.know-prose { font-size:var(--font-bmd); line-height:2; color:var(--gray-700); }
.know-prose > *:first-child { margin-top:0; }
.know-prose p { margin:0 0 18px; }
.know-prose img { max-width:100%; height:auto; border-radius:8px; margin:8px 0; }
.know-prose h1, .know-prose h2, .know-prose h3, .know-prose h4 { color:var(--gray-800); font-weight:800; line-height:1.5; margin:28px 0 12px; padding-left:12px; border-left:4px solid var(--green); }
.know-prose h2 { font-size:var(--font-lg); } .know-prose h3 { font-size:var(--font-bmd); }
.know-prose a { color:var(--green); text-decoration:underline; }
.know-prose ul, .know-prose ol { margin:0 0 18px; padding-left:24px; }
.know-prose li { margin-bottom:6px; }
.know-prose table { width:100%; border-collapse:collapse; margin:16px 0; }
.know-prose th, .know-prose td { border:1px solid var(--gray-200); padding:8px 12px; font-size:var(--font-md); }
.know-prose th { background:var(--gray-50); }

.know-share { display:flex; justify-content:space-between; align-items:center; margin-top:30px; padding-top:20px; border-top:1px dashed var(--gray-200); }
.know-share .func__right { display:flex; gap:10px; }
.know-share .func__right a { display:inline-block; width:36px; height:36px; background-size:contain; background-repeat:no-repeat; transition: opacity .2s; }
.know-share .func__right a:hover { opacity:0.8; }
.know-share .ggBtn { background-image:url('/images/btn_gplus.png'); }
.know-share .fbBtn { background-image:url('/images/btn_fb.png'); }
.know-share .lineBtn { background-image:url('/images/btn_line.png'); }

.know-art-nav { display:flex; justify-content:space-between; gap:14px; margin-top:26px; }
.know-art-nav a { flex:1; background:var(--gray-50); border:1px solid var(--gray-200); border-radius:10px; padding:14px 18px; transition:all .2s; min-width:0; }
.know-art-nav a:hover { border-color:var(--green); background:#fff; box-shadow:0 2px 16px rgba(0,0,0,.08); text-decoration:none; }
.know-art-nav .lbl { font-size:var(--font-xs); color:var(--gray-500); margin-bottom:5px; }
.know-art-nav .t { font-size:var(--font-md); font-weight:600; color:var(--gray-800); display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
.know-art-nav .next { text-align:right; }

.know-side { position:sticky; top:24px; display:flex; flex-direction:column; gap:20px; }
.side-card { background:#fff; border-radius:14px; box-shadow:0 2px 16px rgba(0,0,0,.08); overflow:hidden; }
.side-card .sc-head { background:var(--green); color:#fff; padding:13px 18px; font-size:var(--font-md); font-weight:700; display:flex; align-items:center; gap:8px; }

.news-list { display:flex; flex-direction:column; max-height: 400px; overflow-y:scroll;}
.news-item { display:flex; gap:12px; padding:16px; border-bottom:1px solid var(--gray-100); transition:background .2s; }
.news-item:hover { background:var(--gray-50); text-decoration:none; }
.news-item:last-child { border-bottom:none; }
.news-pic { width:90px; height:64px; border-radius:6px; background:var(--gray-200) center/cover no-repeat; flex-shrink:0; }
.news-txt { display:flex; flex-direction:column; justify-content:space-between; }
.news-t { font-size:var(--font-sm); font-weight:700; color:var(--gray-800); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; line-height:1.4; }
.news-item:hover .news-t { color:var(--green); }
.news-d { font-size:var(--font-xs); color:var(--gray-500); display:flex; align-items:center; gap:4px; }

.back-card { padding:15px 18px; }
.back-card a { display:flex; align-items:center; justify-content:center; gap:8px; color:var(--green); font-weight:700; font-size:var(--font-md); }
.back-card a:hover { text-decoration:none; }

@media (max-width:900px) {
  .know-detail { grid-template-columns:1fr; }
  .know-side { position:static; }
  .know-article { padding:24px 20px; }
}

/* [20261028] 分享列 knows-con-sns：原定義在 layout_km.css 且 scoped 於 .knows-content/.aside-list（news.aspx 用）；
   housenews_detail / knowledge_class_news 的分享列在 .know-article 內、未載 layout_km → 於此補上相同樣式。 */
.know-article .knows-con-sns { display: flex;justify-content:flex-end; padding: .5em 0; }
.know-article .knows-con-sns .sns-bg1 { background: #dcecec; }
.know-article .knows-con-sns .sns-bg2 { background: #cfe2ff; }
.know-article .knows-con-sns a { margin-right: .5em; width: 36px; height: 36px; border-radius: 8px; background: #eee; text-align: center; }
.know-article .knows-con-sns a img { vertical-align: middle; margin: 8px auto; padding: 0; top: -5px; }

/* [20261028] 粉專連結卡（housenews_detail）：圖片＋名稱＋FB 讚鈕，取代 fb-page 大封面 */
.fanPage__plugin .fb-card-link { display: block; text-decoration: none; color: inherit; }
.fanPage__plugin .fb-card-img { width: 160px; max-width: 80%; height: auto; border-radius: 12px; display: block; margin: 0 auto 10px; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.fanPage__plugin .fb-card-name { font-size: var(--font-md); font-weight: 700; color: var(--gray-800); margin-bottom: 12px; }
.fanPage__plugin .fb-card-link:hover .fb-card-name { color: var(--green); }
/* [20261028] 自製「追蹤粉絲團」連結鈕（取代 fb-like 外掛，不依賴 FB SDK） */
.fanPage__plugin .fb-follow-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; max-width: 200px; margin: 0 auto; padding: 9px 16px; background: #1877f2; color: #fff; border-radius: 8px; font-size: var(--font-md); font-weight: 700; text-decoration: none; transition: background .2s; }
.fanPage__plugin .fb-follow-btn:hover { background: #166fe5; color: #fff; }
.fanPage__plugin .fb-follow-btn i { font-size: var(--font-bmd); }
