/* Bổ sung của bản có CMS — KHÔNG đụng giao diện bản gốc (site.css giữ nguyên văn). */

/* Trang con do server dựng: ẩn tới khi app.js chạy hiệu ứng vào trang (.view-enter), như bản gốc dựng bằng JS. */
html.ssr-cho #app{opacity:0}

/* Nhãn "bản xem trước" khi mở từ màn quản trị */
.xem-truoc-nhan{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:9999;padding:8px 16px;border-radius:999px;
  background:var(--charcoal);color:#fff;font:600 .82rem/1.2 var(--f-body);box-shadow:var(--shadow);pointer-events:none}

/* Danh sách bài viết từ DB (trên khung Tri thức gốc): tiêu đề là link */
.article h4 a{color:inherit;text-decoration:none}
.article h4 a:hover{color:var(--brand)}

/* Thẻ bài viết: CẢ THẺ bấm được (link tiêu đề phủ thẻ), ảnh bìa thu nhỏ bên trái nếu có */
.bv-the{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start;
  margin:0 -14px;padding:18px 14px;border-radius:14px;transition:background-color .18s}
.bv-the--anh{grid-template-columns:150px minmax(0,1fr)}
.bv-the:hover{background:var(--sunk)}
.bv-the h4 a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.bv-the h4 a:focus-visible{outline:none}
.bv-the:has(h4 a:focus-visible){outline:2px solid var(--brand);outline-offset:2px}
.bv-the__anh{width:150px;height:100px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.bv-the__chu{min-width:0}
.bv-the__doc{display:inline-block;margin-top:6px;font-size:.85rem;font-weight:600;color:var(--brand);opacity:0;transform:translateX(-4px);transition:opacity .18s,transform .18s}
.bv-the:hover .bv-the__doc,.bv-the:has(h4 a:focus-visible) .bv-the__doc{opacity:1;transform:none}
.bv-the:hover h4 a{color:var(--brand)}
@media (max-width:640px){.bv-the--anh{grid-template-columns:96px minmax(0,1fr)}.bv-the__anh{width:96px;height:72px}}
@media (prefers-reduced-motion:reduce){.bv-the,.bv-the__doc{transition:none}}
