/* ===== KHỐI ĐỀ MỤC [tiende] / [buoc] / [ket] / [thuong] — MẪU A, CHỐT 06/10/2026 (trang mẫu <quản trị>/thu-giao-dien/khoi-muc/).
   phanMucSyntax (.eleventy.js) dựng: <section class="kb kb-<loại>"><h2 class="bv-tieu-de kb-td" data-bv="<loại>">TÊN</h2> … </section>.
   Danh sách trong khu vẫn mang lớp bv-ds bv-ds-<loại> (để luật danh sách thường của bo-cuc.css không đụng tới) — file này
   ĐÈ toàn bộ kiểu mốc hình thoi cũ của style.css bằng bộ chọn mạnh hơn (section.kb … :nth-child(n)).
   - Tiền đề: nền #F1F7FE, tiêu đề #093C8C, chữ #041E49, TOÀN BỘ font "Google Sans Text", không icon.
   - Các bước: khung trắng viền; số trắng trong vòng XANH 22px, không nét nối.
   - Các kết cục: khung trắng viền, tiêu đề XANH LÁ; số trắng vòng xanh lá 16px, không nét nối.
   - Phần thưởng: giữ nền xanh nhạt, góc phải dưới mờ trong suốt, ẩn ảnh riêng; -- dùng dấu vuông
     của trình duyệt, lề/khoảng cách như danh sách chấm tròn; tiêu đề không icon.
   - Các khối cách nhau 7px; tiêu đề IN HOA. Khung xem trước Decap: data-bv-kb trong nthBvPreview (admin/index.html). */
.article-body{--kb-xanh:#1A73E8; --kb-nen:#EEF4FC; --kb-vien:#DCE5F0; --kb-td:#123A73;}
html[data-theme="dark"] .article-body{--kb-nen:rgba(90,130,190,.13); --kb-vien:#34465F; --kb-td:#CFE0F5;}

.article-body section.kb{--kb-pad-inline:18px; margin:0 0 7px; padding:14px var(--kb-pad-inline); border:1px solid transparent; border-radius:12px; }
.article-body section.kb + section.kb{margin-top:0;}
/* Vách [ngan] nằm GIỮA hai khối bị ẩn — các khối đã tự tách bằng khung, giữ khoảng 7px cho liền mạch. */
.article-body section.kb + .muc-divider:has(+ section.kb){display:none;}
.article-body section.kb:has(+ .muc-divider + section.kb){margin-bottom:7px;}
.article-body section.kb:has(+ :not(section.kb)), .article-body section.kb:last-child{margin-bottom:14px;}
.article-body section.kb > :last-child{margin-bottom:0;}
.article-body section.kb h2.kb-td{display:flex; align-items:center; gap:6px; margin:0 0 10px; padding:0; border:0; background:none;
  font:800 17px/1.3 Inter, system-ui, sans-serif; color:var(--kb-td); letter-spacing:.01em; text-transform:uppercase;}
.article-body section.kb h2.kb-td::before, .article-body section.kb h2.kb-td::after{content:none; display:none;}
.article-body section.kb > p{margin:0 0 6px;}

/* Các khối không tự đánh số. Dấu số/chấm lấy từ tiền tố tác giả gõ. */
.article-body section.kb :is(ul, ol).bv-ds{list-style:none; margin:0;}
.article-body :is(ul,ol).bv-ds > li:nth-child(n){position:relative; list-style:none; min-height:0;
  margin:0 0 10px; padding:0 0 0 var(--bc-l1); background:none; font-size:14.5px; line-height:1.55;}
.article-body :is(ul,ol).bv-ds > li:nth-child(n)::before{content:""; position:absolute; left:calc(var(--bc-d1) + 1px);
  top:calc(.725em - 3.5px); width:7px; height:7px; transform:none; border:0; border-radius:50%; box-shadow:none;
  background:currentColor;}
.article-body :is(ul,ol).bv-ds > li:nth-child(n)::after{content:none;}
.article-body :is(ul,ol).bv-ds > li > p{margin:0; line-height:inherit;}
.article-body :is(ul,ol).bv-ds > li > :first-child{margin-top:0;}

/* ---- Ghi chú TRONG khối (06/10/2026): [n] [r] [rep] [box] nằm trong một khối đề mục mà không thuộc mục danh sách nào
   vẫn là CẤP CON — lề trái thẳng hàng chữ của các mục (--kb-chu-x); "++" ngay trước thì thụt thêm một cấp (24px).
   Ghi chú đặt ngay dưới một mục (list-notes kéo vào <li>) tự nằm trong vùng chữ của mục đó. ---- */
.article-body section.kb > :is(.note-block, .reply-block, .main-box){margin-left:var(--kb-chu-x, 34px);}
.article-body section.kb > :is(.note-block, .reply-block, .main-box).thut-khoi{margin-left:calc(var(--kb-chu-x, 34px) + 24px);}
.article-body section.kb li > :is(.note-block, .main-box, .reply-block){margin:6px 0 2px;}

/* ---- Dòng "=>" (p.mui-ten) TRONG khối: mũi tên ở cột số của khối, chữ thẳng hàng chữ các mục (--kb-chu-x), cách mục trên
   bằng đúng khoảng giữa các mục (10px) — trước đây dùng lề của danh sách ngoài khối nên lệch và sát. ---- */
.article-body section.kb > p.mui-ten{margin:10px 0 0; padding-left:var(--kb-chu-x, 34px); font-size:14.5px; line-height:1.55;}
.article-body section.kb > p.mui-ten::before{left:0; width:var(--kb-so, 22px); top:0;}
.article-body section.kb > p.mui-ten + p.mui-ten{margin-top:6px;}

/* ---- Các bước ---- */
.article-body section.kb-buoc{border:1px solid var(--kb-vien); --kb-so:22px; --kb-so-top:0px; --kb-chu-x:34px;}
.article-body section.kb-buoc :is(ul, ol).bv-ds > li:has(> p:first-child){--kb-so-top:1.5px;}

/* ---- Các kết cục ---- */
.article-body section.kb-ket{border:1px solid var(--kb-vien); --kb-so:16px; --kb-so-top:2.5px; --kb-chu-x:28px; --kb-so-co:10px;
  --kb-so-nen:#34A853; --kb-noi:#8FCB99;}
.article-body section.kb-ket h2.kb-td{color:#1E6B2E;}
html[data-theme="dark"] .article-body section.kb-ket{--kb-so-nen:#57BB6A; --kb-noi:#3F7A48;}
html[data-theme="dark"] .article-body section.kb-ket h2.kb-td{color:#A9DDB0;}
.article-body section.kb-ket :is(ul, ol).bv-ds > li:has(> p:first-child){--kb-so-top:4.5px;}


/* ---- Tiền đề: kiểu thông báo Gmail, font Google Sans Text, số đen ---- */
.article-body section.kb-tiende{background:#F1F7FE; color:#041E49; --kb-so:16px; --kb-so-top:2.5px; --kb-chu-x:28px; --kb-so-co:10px;
  --kb-so-nen:#1A73E8; --kb-noi:#7FA6E0;}
.article-body section.kb-tiende, .article-body section.kb-tiende *:not(svg):not(use){font-family:'Google Sans Text', Inter, sans-serif !important;}
.article-body section.kb-tiende h2.kb-td{color:#093C8C;}
.article-body section.kb-tiende strong{color:inherit;}
html[data-theme="dark"] .article-body section.kb-tiende{background:#22344F; color:#D3E3FD; --kb-so-nen:#4C8DF6; --kb-noi:#5A6F92;}
html[data-theme="dark"] .article-body section.kb-tiende h2.kb-td{color:#D3E3FD;}

/* ---- Phần thưởng: chỉ nền màu mờ ở góc phải dưới để lộ cảnh của thân bài.
   Vẽ gradient trên background, không mask/opacity cả khối vì sẽ làm mờ cả chữ. ---- */
.article-body section.kb-thuong{position:relative; isolation:isolate; overflow:visible;
  background:radial-gradient(ellipse 60% 100% at right bottom, transparent 8%, var(--kb-nen) 82%);}
.article-body section.kb-thuong::before{content:none;}
.article-body section.kb-thuong :is(ul, ol).bv-ds > li::after, .article-body section.kb-thuong p.bv-dong::after{content:none !important;}

@media (max-width:640px){
  .article-body section.kb{--kb-pad-inline:14px; padding:12px var(--kb-pad-inline);}
  .article-body section.kb h2.kb-td{font-size:15.5px;}
}

/* .nth-number lặp để ưu tiên hơn luật khối cũ, không dùng !important cho kích thước/màu.
   Quy tắc 06/10/2026: chỉ 1. / 1- tạo số. Lấy lề chữ làm chuẩn: mép phải cả hai vòng cách chữ 14px, không ép đồng tâm.
   Vòng số đặt tại đầu vùng chữ của dòng đầu (top:4px), không tại đỉnh hộp dòng; không nét nối. */
.article-body{--num-left:var(--ds-thut-1, 0px); --num-gap:14px;
  --num-text:calc(var(--num-left) + 36px); --num-text-big:var(--num-text); --num-text-small:var(--num-text);
  --num-blue:#1A73E8; --num-green:#34A853;}
html[data-theme="dark"] .article-body{--num-blue:#4C8DF6; --num-green:#57BB6A;}
.article-body :is(li,span).nth-number.nth-number[data-number]:nth-child(n){--num-size:22px; --num-pad:var(--num-text-big); --num-bg:var(--num-blue);
  display:block; position:relative; margin:0 0 10px; padding:0 0 0 var(--num-pad); min-height:22px; background:none; list-style:none; counter-increment:none;}
.article-body :is(li,span).nth-number-small.nth-number[data-number]:nth-child(n){--num-size:16px; --num-pad:var(--num-text-small); --num-bg:var(--num-green);}
.article-body :is(li,span).nth-number.nth-number[data-number]:nth-child(n)::before{content:attr(data-number) !important;
  position:absolute; left:calc(var(--num-text) - var(--num-gap) - var(--num-size)); top:4px;
  width:var(--num-size); height:var(--num-size); display:grid; place-items:center; background:var(--num-bg);
  color:#fff; border:0; border-radius:50%; box-shadow:none; transform:none; font:500 13px/1 Inter, Arial, sans-serif;}
.article-body :is(li,span).nth-number.nth-number[data-number]:nth-child(n)::after{content:none;}
.article-body :is(li,span).nth-number-small.nth-number[data-number]:nth-child(n)::before{font-size:10px;}
.article-body :is(li,span).nth-number.nth-number[data-number]:nth-child(n){font-size:14.5px; line-height:1.55;}
.article-body :is(li,span).nth-number.nth-number[data-number]:nth-child(n) > p{margin:0; line-height:inherit;}
.article-body .thut-cap.thut-cap-small{padding-left:var(--num-text-small);}
.article-body .thut-cap.thut-cap-big{padding-left:var(--num-text-big);}
.article-body .thut-khoi.thut-khoi-small{margin-left:var(--num-text-small);}
.article-body .thut-khoi.thut-khoi-big{margin-left:var(--num-text-big);}
.article-body .bv-ds > li:nth-child(n), .article-body p.bv-dong:nth-child(n){background:none !important;}
.article-body .bv-ds > li:nth-child(n)::after, .article-body p.bv-dong:nth-child(n)::after,
.article-body .step-block:not(:last-child)::after{content:none;}

/* Ghi chú vẫn nhỏ và sát dòng, kể cả khi chứa danh sách/chấm. Giữ màu và cỡ chữ tác giả tô riêng. */
.article-body .z-note :is(li,span).nth-number.nth-number[data-number]:nth-child(n),
.article-body .z-note :is(.dot-line,.nth-text-list-line){font-size:inherit; line-height:inherit;}

/* Dấu chấm và -- (vuông): trình duyệt đặt ::marker, cùng lề và giãn dòng tự nhiên.
   Vòng số và // vẫn dùng quy tắc riêng. list-star giữ tên lớp cũ để tương thích nội dung. */
.article-body{--bullet-tone:#5F6368;}
html[data-theme="dark"] .article-body{--bullet-tone:#BDC1C6;}
.article-body.article-body ul{padding-inline-start:2em; list-style:disc outside;}
.article-body.article-body ul:has(> li:is(.nth-number,.list-vong)){padding:0; list-style:none;}
.article-body.article-body ul > li.nth-list-item:is(.list-bullet,.list-star):nth-child(n){
  display:list-item; list-style:disc outside; padding:0; margin:0 0 .25em; background:none; font:inherit;}
.article-body.article-body ul > li.nth-list-item.list-star:nth-child(n){list-style-type:square;}
.article-body.article-body ul:has(> li:is(.nth-number,.list-vong)) > li.nth-list-item:is(.list-bullet,.list-star):nth-child(n){margin-inline-start:2em;}
.article-body.article-body .dot-line.dot-line, .article-body.article-body .nth-text-list-line.list-bullet{
  display:list-item; list-style:disc outside; padding:0; margin:0 0 .25em 2em; font:inherit; background:none;}
.article-body.article-body .nth-text-list-line.list-star{
  display:list-item; list-style:square outside; padding:0; margin:0 0 .25em 2em; font:inherit; background:none;}
.article-body.article-body ul > li.nth-list-item:is(.list-bullet,.list-star):nth-child(n)::before,
.article-body.article-body .dot-line.dot-line::before,
.article-body.article-body .nth-text-list-line:is(.list-bullet,.list-star)::before{content:none !important; display:none;}
.article-body li.list-bullet::marker, .article-body .nth-text-list-line.list-bullet::marker{color:var(--bullet-tone);}
.article-body .dot-line::marker{color:var(--dot-color, currentColor);}
.article-body li.list-star::marker, .article-body .nth-text-list-line.list-star::marker{color:var(--num-blue,#1A73E8);}

/* Nền thưởng không cộng thêm đệm ngang lên danh sách. Chỉ tiêu đề giữ đệm
   của khung; dấu/chữ dùng chính lề 2em như khi danh sách nằm ngoài khung. */
.article-body.article-body section.kb-thuong{padding-inline:0;border-inline-width:0;}
.article-body.article-body section.kb-thuong > h2.kb-td{padding-inline:calc(var(--kb-pad-inline) + 1px);}


/* Khung thoại ôm nội dung: lề tường minh cũng tính vào chiều rộng còn lại. */
.article-body .arrow-note.thut-khoi-small{--r-indent:var(--num-text-small);}
.article-body .arrow-note.thut-khoi-big{--r-indent:var(--num-text-big);}
