/*
 * CSS cho page, bài tin và danh sách tin (luồng B2): nội dung CKEditor của bài, 3 bài liên quan, phân trang .pager.
 */

/* 3 bài liên quan dưới bài tin: 3 cột ở màn rộng, 1 cột ở điện thoại */
.news--3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3,24px)}
@media (max-width:900px){.news--3{grid-template-columns:minmax(0,1fr)}}

/* nội dung bài tin do CKEditor sinh: ảnh, danh sách, trích dẫn, bảng không tràn khung 760px */
.article__body.ck-content{overflow-wrap:anywhere}
.article__body.ck-content img{max-width:100%;height:auto;border-radius:8px}
.article__body.ck-content h3,.article__body.ck-content h4{font-weight:700;margin:32px 0 10px}
.article__body.ck-content ul,.article__body.ck-content ol{margin:20px 0 20px 1.25em;color:#dbe3f2;font-size:17px;line-height:1.8}
.article__body.ck-content ul{list-style:disc}
.article__body.ck-content ol{list-style:decimal}
.article__body.ck-content blockquote{margin:24px 0;padding:4px 0 4px 18px;border-left:3px solid var(--blue,#0070f4);color:#e6ecf8}
.article__body.ck-content a{text-decoration:underline;text-underline-offset:3px}
.article__body.ck-content figure{margin:24px 0}
.article__body.ck-content table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}
.article__body.ck-content th,.article__body.ck-content td{padding:10px 12px;border:1px solid var(--line)}

/* phân trang (partials/pagination.blade.php) */
.pager{margin-top:var(--s4,40px)}
.pager ul{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.pager a,.pager span{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:0 12px;border:1px solid var(--line);border-radius:8px;color:#fff;font-size:14.5px;text-decoration:none}
.pager a:hover{border-color:#fff}
.pager [aria-current=page]{background:var(--blue,#0070f4);border-color:var(--blue,#0070f4);font-weight:700}
.pager [aria-disabled=true]{opacity:.45}
/* Light (BUG-7 phiếu #17): chữ và viền theo biến của style.css, không để trắng cứng trên nền sáng; trang hiện tại giữ chữ trắng trên nền xanh */
[data-theme=light] .pager a,[data-theme=light] .pager span{color:var(--fg-strong)}
[data-theme=light] .pager a:hover{border-color:var(--fg-strong)}
[data-theme=light] .pager [aria-current=page]{color:#fff}
[data-theme=light] .article__body.ck-content blockquote{color:var(--text-body)}