/* =========================================================
 * BKMOS Blog Typography v1.2.0
 * Chỉ chuẩn hóa chữ; không đổi template, permalink hay schema.
 * Dùng Arial/system font để chữ tiếng Việt ổn định trên mọi weight.
 * ======================================================= */

body.bkmos-blog-typography-active {
  --bkmos-type-font: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --bkmos-type-ink: #172b3a;
  --bkmos-type-text: #324856;
  --bkmos-type-muted: #657783;
  --bkmos-type-link: #0b5f9e;
  --bkmos-type-border: #e1e9ef;
}

/* Font family thống nhất cho vùng nội dung Newspaper/TagDiv. */
body.bkmos-blog-typography-active .td-main-content-wrap,
body.bkmos-blog-typography-active .td-main-content-wrap input,
body.bkmos-blog-typography-active .td-main-content-wrap button,
body.bkmos-blog-typography-active .td-main-content-wrap textarea,
body.bkmos-blog-typography-active .td-main-content-wrap select,
body.bkmos-blog-typography-active .tdc-content-wrap,
body.bkmos-blog-typography-active .tdc-content-wrap input,
body.bkmos-blog-typography-active .tdc-content-wrap button {
  font-family: var(--bkmos-type-font) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
}

body.bkmos-blog-typography-active .td-main-content-wrap h1,
body.bkmos-blog-typography-active .td-main-content-wrap h2,
body.bkmos-blog-typography-active .td-main-content-wrap h3,
body.bkmos-blog-typography-active .td-main-content-wrap h4,
body.bkmos-blog-typography-active .td-main-content-wrap h5,
body.bkmos-blog-typography-active .td-main-content-wrap h6,
body.bkmos-blog-typography-active .tdc-content-wrap h1,
body.bkmos-blog-typography-active .tdc-content-wrap h2,
body.bkmos-blog-typography-active .tdc-content-wrap h3,
body.bkmos-blog-typography-active .tdc-content-wrap h4,
body.bkmos-blog-typography-active .tdc-content-wrap h5,
body.bkmos-blog-typography-active .tdc-content-wrap h6 {
  font-family: var(--bkmos-type-font) !important;
  font-style: normal;
  color: var(--bkmos-type-ink);
  text-rendering: optimizeLegibility;
}

/* ---------- Bài viết / hub dạng singular ---------- */
body.bkmos-blog-typography-active.single-post .tdb-single-title .tdb-title-text,
body.bkmos-blog-typography-active.single .tdb-single-title .tdb-title-text,
body.bkmos-blog-typography-active.page .tdb-single-title .tdb-title-text {
  font-family: var(--bkmos-type-font) !important;
  font-size: clamp(32px, 3.25vw, 42px) !important;
  line-height: 1.18 !important;
  font-weight: 700 !important;
  letter-spacing: -0.024em !important;
  color: var(--bkmos-type-ink) !important;
}

/* Nội dung bài: ưu tiên các wrapper TagDiv phổ biến, không ép layout. */
body.bkmos-blog-typography-active.single-post .tdb_single_content,
body.bkmos-blog-typography-active.single-post .td-post-content,
body.bkmos-blog-typography-active.single-post .tdb-block-inner.td-fix-index,
body.bkmos-blog-typography-active.single .tdb_single_content,
body.bkmos-blog-typography-active.page .tdb_single_content {
  color: var(--bkmos-type-text);
}

body.bkmos-blog-typography-active.single-post .tdb_single_content p,
body.bkmos-blog-typography-active.single-post .td-post-content p,
body.bkmos-blog-typography-active.single-post .tdb_single_content li,
body.bkmos-blog-typography-active.single-post .td-post-content li,
body.bkmos-blog-typography-active.single .tdb_single_content p,
body.bkmos-blog-typography-active.single .tdb_single_content li,
body.bkmos-blog-typography-active.page .tdb_single_content p,
body.bkmos-blog-typography-active.page .tdb_single_content li {
  font-family: var(--bkmos-type-font) !important;
  font-size: 17px !important;
  line-height: 1.72 !important;
  font-weight: 400 !important;
  color: var(--bkmos-type-text) !important;
}

body.bkmos-blog-typography-active.single-post .tdb_single_content h2,
body.bkmos-blog-typography-active.single-post .td-post-content h2,
body.bkmos-blog-typography-active.single .tdb_single_content h2,
body.bkmos-blog-typography-active.page .tdb_single_content h2 {
  margin-top: 36px !important;
  margin-bottom: 14px !important;
  font-size: clamp(26px, 2.2vw, 30px) !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
}

body.bkmos-blog-typography-active.single-post .tdb_single_content h3,
body.bkmos-blog-typography-active.single-post .td-post-content h3,
body.bkmos-blog-typography-active.single .tdb_single_content h3,
body.bkmos-blog-typography-active.page .tdb_single_content h3 {
  margin-top: 28px !important;
  margin-bottom: 10px !important;
  font-size: clamp(21px, 1.75vw, 24px) !important;
  line-height: 1.36 !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

body.bkmos-blog-typography-active.single-post .tdb_single_content h4,
body.bkmos-blog-typography-active.single-post .td-post-content h4,
body.bkmos-blog-typography-active.single .tdb_single_content h4,
body.bkmos-blog-typography-active.page .tdb_single_content h4 {
  margin-top: 24px !important;
  margin-bottom: 8px !important;
  font-size: 20px !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
}

body.bkmos-blog-typography-active.single-post .tdb_single_content a,
body.bkmos-blog-typography-active.single-post .td-post-content a,
body.bkmos-blog-typography-active.single .tdb_single_content a,
body.bkmos-blog-typography-active.page .tdb_single_content a {
  color: var(--bkmos-type-link);
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

/* Danh sách/table không bị chữ quá nhỏ trong các bài thuật ngữ, pháp lý. */
body.bkmos-blog-typography-active.single-post .tdb_single_content table,
body.bkmos-blog-typography-active.single-post .td-post-content table,
body.bkmos-blog-typography-active.single .tdb_single_content table,
body.bkmos-blog-typography-active.page .tdb_single_content table {
  font-family: var(--bkmos-type-font) !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
}

body.bkmos-blog-typography-active.single-post .tdb_single_content th,
body.bkmos-blog-typography-active.single-post .td-post-content th,
body.bkmos-blog-typography-active.single .tdb_single_content th,
body.bkmos-blog-typography-active.page .tdb_single_content th {
  font-weight: 700 !important;
}

/* Breadcrumb + metadata nhẹ hơn H1, cùng font. */
body.bkmos-blog-typography-active .rank-math-breadcrumb,
body.bkmos-blog-typography-active .rank-math-breadcrumb p,
body.bkmos-blog-typography-active .rank-math-breadcrumb a,
body.bkmos-blog-typography-active .tdb-post-meta,
body.bkmos-blog-typography-active .tdb-post-meta a,
body.bkmos-blog-typography-active .tdb-post-meta time {
  font-family: var(--bkmos-type-font) !important;
}

body.bkmos-blog-typography-active .rank-math-breadcrumb,
body.bkmos-blog-typography-active .rank-math-breadcrumb p {
  font-size: 12.5px !important;
  line-height: 1.55 !important;
  color: var(--bkmos-type-muted) !important;
}

body.bkmos-blog-typography-active .rank-math-breadcrumb a {
  color: #456679 !important;
}

body.bkmos-blog-typography-active .tdb-post-meta,
body.bkmos-blog-typography-active .tdb-post-meta a,
body.bkmos-blog-typography-active .tdb-post-meta time {
  font-size: 12px !important;
  line-height: 1.45 !important;
}

/* ---------- Category / archive / search ---------- */
body.bkmos-blog-typography-active.category .tdb-title-text,
body.bkmos-blog-typography-active.archive .tdb-title-text,
body.bkmos-blog-typography-active.search .tdb-title-text,
body.bkmos-blog-typography-active.category .td-page-title,
body.bkmos-blog-typography-active.archive .td-page-title,
body.bkmos-blog-typography-active.search .td-page-title {
  font-family: var(--bkmos-type-font) !important;
  font-size: clamp(30px, 2.7vw, 38px) !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--bkmos-type-ink) !important;
}

body.bkmos-blog-typography-active.category .entry-title,
body.bkmos-blog-typography-active.archive .entry-title,
body.bkmos-blog-typography-active.search .entry-title,
body.bkmos-blog-typography-active.category .td-module-title,
body.bkmos-blog-typography-active.archive .td-module-title,
body.bkmos-blog-typography-active.search .td-module-title {
  font-family: var(--bkmos-type-font) !important;
  font-weight: 700 !important;
  letter-spacing: -0.008em !important;
}

body.bkmos-blog-typography-active.category .td-excerpt,
body.bkmos-blog-typography-active.archive .td-excerpt,
body.bkmos-blog-typography-active.search .td-excerpt {
  font-family: var(--bkmos-type-font) !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: var(--bkmos-type-muted) !important;
}

/* ---------- Responsive ---------- */
@media (max-width: 767px) {
  body.bkmos-blog-typography-active.single-post .tdb-single-title .tdb-title-text,
  body.bkmos-blog-typography-active.single .tdb-single-title .tdb-title-text,
  body.bkmos-blog-typography-active.page .tdb-single-title .tdb-title-text {
    font-size: 30px !important;
    line-height: 1.22 !important;
    letter-spacing: -0.018em !important;
  }

  body.bkmos-blog-typography-active.single-post .tdb_single_content p,
  body.bkmos-blog-typography-active.single-post .td-post-content p,
  body.bkmos-blog-typography-active.single-post .tdb_single_content li,
  body.bkmos-blog-typography-active.single-post .td-post-content li,
  body.bkmos-blog-typography-active.single .tdb_single_content p,
  body.bkmos-blog-typography-active.single .tdb_single_content li,
  body.bkmos-blog-typography-active.page .tdb_single_content p,
  body.bkmos-blog-typography-active.page .tdb_single_content li {
    font-size: 16.5px !important;
    line-height: 1.7 !important;
  }
}


/* =========================================================
 * v1.1.1: khóa typography trực tiếp vào TagDiv single content.
 * Mục tiêu: tránh rule legacy/inline của Newspaper làm H2/H3 quá lớn.
 * ======================================================= */
body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > p,
body.bkmos-blog-typography-active.single-post .tdb_single_content.td-post-content .tdb-block-inner > p,
body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type p,
body.bkmos-blog-typography-active.single-post .tagdiv-type p {
  font-family: var(--bkmos-type-font) !important;
  font-size: 17px !important;
  line-height: 1.72 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  color: var(--bkmos-type-text) !important;
}

body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > h2,
body.bkmos-blog-typography-active.single-post .tdb_single_content.td-post-content .tdb-block-inner > h2,
body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type h2,
body.bkmos-blog-typography-active.single-post .tagdiv-type h2 {
  margin: 34px 0 13px !important;
  padding: 0 !important;
  font-family: var(--bkmos-type-font) !important;
  font-size: 29px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  letter-spacing: -0.012em !important;
  text-transform: none !important;
  color: var(--bkmos-type-ink) !important;
}

body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > h3,
body.bkmos-blog-typography-active.single-post .tdb_single_content.td-post-content .tdb-block-inner > h3,
body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type h3,
body.bkmos-blog-typography-active.single-post .tagdiv-type h3 {
  margin: 25px 0 9px !important;
  padding: 0 !important;
  font-family: var(--bkmos-type-font) !important;
  font-size: 22px !important;
  line-height: 1.38 !important;
  font-weight: 700 !important;
  letter-spacing: -0.006em !important;
  text-transform: none !important;
  color: var(--bkmos-type-ink) !important;
}

body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > h4,
body.bkmos-blog-typography-active.single-post .tdb_single_content.td-post-content .tdb-block-inner > h4,
body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type h4,
body.bkmos-blog-typography-active.single-post .tagdiv-type h4 {
  margin: 22px 0 8px !important;
  font-size: 19px !important;
  line-height: 1.42 !important;
  font-weight: 700 !important;
}

/* Giữ list đồng cỡ body nhưng không làm metadata/TOC phình theo. */
body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > ul > li,
body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > ol > li,
body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type > ul > li,
body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type > ol > li {
  font-family: var(--bkmos-type-font) !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
  color: var(--bkmos-type-text) !important;
}

@media (max-width: 767px) {
  body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > p,
  body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type p,
  body.bkmos-blog-typography-active.single-post .tagdiv-type p {
    font-size: 16.5px !important;
    line-height: 1.7 !important;
  }

  body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > h2,
  body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type h2,
  body.bkmos-blog-typography-active.single-post .tagdiv-type h2 {
    margin-top: 29px !important;
    font-size: 25px !important;
    line-height: 1.32 !important;
  }

  body.bkmos-blog-typography-active.single-post .tdb_single_content.tagdiv-type .tdb-block-inner > h3,
  body.bkmos-blog-typography-active.single-post .td-post-content.tagdiv-type h3,
  body.bkmos-blog-typography-active.single-post .tagdiv-type h3 {
    margin-top: 23px !important;
    font-size: 21px !important;
    line-height: 1.38 !important;
  }
}


/* =========================================================
   BKMOS Blog Design 2.0.1 — Newspaper single post integration
   ========================================================= */
.bkmos-newspaper-breadcrumb {
    width: 100%;
    margin: 0 0 30px !important;
    padding: 0 !important;
    box-sizing: border-box;
}
.bkmos-newspaper-breadcrumb .rank-math-breadcrumb,
.bkmos-newspaper-breadcrumb .rank-math-breadcrumb p {
    margin: 0 !important;
    padding: 0 !important;
    font-family: var(--bkmos-type-font) !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    color: #667784 !important;
}
.bkmos-newspaper-breadcrumb .rank-math-breadcrumb a {
    color: #29a6df !important;
    text-decoration: none !important;
    font-weight: 400 !important;
}
.bkmos-newspaper-breadcrumb .rank-math-breadcrumb a:hover {
    color: #0878b2 !important;
    text-decoration: underline !important;
}
.bkmos-newspaper-breadcrumb .rank-math-breadcrumb .separator {
    color: #7f929f !important;
    margin: 0 3px !important;
}

/* Featured Image do theme render o dau single post.
   Anh trong .tdb_single_content/.td-post-content/.entry-content duoc GIU NGUYEN. */
body.bkmos-hide-single-featured.single-post .tdb_single_featured_image,
body.bkmos-hide-single-featured.single-post .tdb_single_bg_featured_image,
body.bkmos-hide-single-featured.single-post .td-post-featured-image,
body.bkmos-hide-single-featured.single-post .single-featured-image,
body.bkmos-hide-single-featured.single-post .article-inner > .entry-image,
body.bkmos-hide-single-featured.single-post .article-inner > .entry-header .entry-image,
body.bkmos-hide-single-featured.single-post .article-inner > .entry-header .post-thumbnail,
body.bkmos-hide-single-featured.single-post .article-inner > .post-thumbnail {
    display: none !important;
}

/* Newspaper/TagDiv: neu block truoc content chua mot anh trung Featured Image,
   JS fallback se gan attribute nay. */
body.single-post [data-bkmos-hidden-featured="1"] {
    display: none !important;
}

@media (max-width: 767px) {
    .bkmos-newspaper-breadcrumb {
        margin-bottom: 22px !important;
    }
    .bkmos-newspaper-breadcrumb .rank-math-breadcrumb,
    .bkmos-newspaper-breadcrumb .rank-math-breadcrumb p {
        font-size: 11.5px !important;
        line-height: 1.55 !important;
    }
}


/* =========================================================
 * v1.2.0 — FINAL VIETNAMESE TYPE RESET
 * Khóa font 400/700 cho nội dung, heading, bảng và taxonomy.
 * ======================================================= */
body.bkmos-blog-typography-active .td-main-content-wrap,
body.bkmos-blog-typography-active .tdc-content-wrap,
body.bkmos-blog-typography-active .td-main-content-wrap p,
body.bkmos-blog-typography-active .td-main-content-wrap li,
body.bkmos-blog-typography-active .td-main-content-wrap table,
body.bkmos-blog-typography-active .td-main-content-wrap th,
body.bkmos-blog-typography-active .td-main-content-wrap td,
body.bkmos-blog-typography-active .td-main-content-wrap a,
body.bkmos-blog-typography-active .tdc-content-wrap p,
body.bkmos-blog-typography-active .tdc-content-wrap li,
body.bkmos-blog-typography-active .tdc-content-wrap table,
body.bkmos-blog-typography-active .tdc-content-wrap th,
body.bkmos-blog-typography-active .tdc-content-wrap td,
body.bkmos-blog-typography-active .tdc-content-wrap a {
  font-family: var(--bkmos-type-font) !important;
  font-synthesis: none !important;
}

body.bkmos-blog-typography-active .td-main-content-wrap p,
body.bkmos-blog-typography-active .td-main-content-wrap li,
body.bkmos-blog-typography-active .td-main-content-wrap td,
body.bkmos-blog-typography-active .tdc-content-wrap p,
body.bkmos-blog-typography-active .tdc-content-wrap li,
body.bkmos-blog-typography-active .tdc-content-wrap td {
  font-weight: 400 !important;
}

body.bkmos-blog-typography-active .td-main-content-wrap h1,
body.bkmos-blog-typography-active .td-main-content-wrap h2,
body.bkmos-blog-typography-active .td-main-content-wrap h3,
body.bkmos-blog-typography-active .td-main-content-wrap h4,
body.bkmos-blog-typography-active .td-main-content-wrap h5,
body.bkmos-blog-typography-active .td-main-content-wrap h6,
body.bkmos-blog-typography-active .td-main-content-wrap th,
body.bkmos-blog-typography-active .td-main-content-wrap strong,
body.bkmos-blog-typography-active .td-main-content-wrap b,
body.bkmos-blog-typography-active .tdc-content-wrap h1,
body.bkmos-blog-typography-active .tdc-content-wrap h2,
body.bkmos-blog-typography-active .tdc-content-wrap h3,
body.bkmos-blog-typography-active .tdc-content-wrap h4,
body.bkmos-blog-typography-active .tdc-content-wrap h5,
body.bkmos-blog-typography-active .tdc-content-wrap h6,
body.bkmos-blog-typography-active .tdc-content-wrap th,
body.bkmos-blog-typography-active .tdc-content-wrap strong,
body.bkmos-blog-typography-active .tdc-content-wrap b {
  font-family: var(--bkmos-type-font) !important;
  font-weight: 700 !important;
  font-synthesis: none !important;
}

/* Newspaper có thể uppercase TH; với tiếng Việt nhìn nặng và dễ lệch nét. */
body.bkmos-blog-typography-active .td-main-content-wrap th,
body.bkmos-blog-typography-active .tdc-content-wrap th,
body.bkmos-blog-typography-active .tdb_single_content th,
body.bkmos-blog-typography-active .td-post-content th {
  text-transform: none !important;
  letter-spacing: 0 !important;
  line-height: 1.4 !important;
}

/* Loại bỏ tracking âm mạnh của theme ở heading để dấu tiếng Việt cân hơn. */
body.bkmos-blog-typography-active .td-main-content-wrap h1,
body.bkmos-blog-typography-active .td-main-content-wrap h2,
body.bkmos-blog-typography-active .td-main-content-wrap h3,
body.bkmos-blog-typography-active .td-main-content-wrap h4,
body.bkmos-blog-typography-active .tdc-content-wrap h1,
body.bkmos-blog-typography-active .tdc-content-wrap h2,
body.bkmos-blog-typography-active .tdc-content-wrap h3,
body.bkmos-blog-typography-active .tdc-content-wrap h4 {
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Breadcrumb v2.2.1: block hợp lệ, thay cho đoạn CSS literal \\n của v2.2.0. */
body.single-post .bkmos-newspaper-breadcrumb {
  display: block !important;
  width: 100%;
  margin: 0 0 34px 0 !important;
  padding: 0 !important;
  clear: both;
}
body.single-post .bkmos-newspaper-breadcrumb .rank-math-breadcrumb,
body.single-post .bkmos-newspaper-breadcrumb .bkmos-visual-breadcrumb {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.single-post .bkmos-newspaper-breadcrumb p {
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--bkmos-type-font) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  color: #3aa9e8 !important;
}
body.single-post .bkmos-newspaper-breadcrumb a,
body.single-post .bkmos-newspaper-breadcrumb span:not(.separator) {
  color: #3aa9e8 !important;
  text-decoration: none !important;
  font-weight: 400 !important;
}
body.single-post .bkmos-newspaper-breadcrumb a:hover {
  color: #126aa5 !important;
  text-decoration: underline !important;
}
body.single-post .bkmos-newspaper-breadcrumb .separator {
  display: inline !important;
  margin: 0 4px !important;
  color: #555 !important;
}
@media (max-width: 767px) {
  body.single-post .bkmos-newspaper-breadcrumb { margin-bottom: 24px !important; }
  body.single-post .bkmos-newspaper-breadcrumb p { font-size: 13px !important; line-height: 1.6 !important; }
}


/* =========================================================
 * v2.2.2 — RELATED POSTS KIỂU NEWSPAPER
 * 4 bài / 1 hàng desktop, ưu tiên bài có tag chung.
 * Đồng thời ẩn điều hướng Bài trước / Bài sau của theme.
 * ======================================================= */
body.single-post .bkmos-related-posts {
  width: 100%;
  margin: 42px 0 10px !important;
  padding: 24px 0 0 !important;
  border-top: 1px solid var(--bkmos-type-border, #e1e9ef);
  clear: both;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
}

body.single-post .bkmos-related-heading {
  display: flex;
  align-items: center;
  margin: 0 0 18px !important;
}

body.single-post .bkmos-related-heading h2 {
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
  font-size: 22px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--bkmos-type-ink, #172b3a) !important;
}

body.single-post .bkmos-related-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  width: 100%;
}

body.single-post .bkmos-related-card {
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff;
}

body.single-post .bkmos-related-media {
  display: block;
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: 4px;
  background: #eef3f6;
  text-decoration: none !important;
}

body.single-post .bkmos-related-media img,
body.single-post .bkmos-related-media .bkmos-image-placeholder {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  margin: 0 !important;
  border-radius: 0 !important;
  transition: transform .22s ease;
}

body.single-post .bkmos-related-card:hover .bkmos-related-media img {
  transform: scale(1.025);
}

body.single-post .bkmos-related-body {
  padding: 10px 1px 0 !important;
}

body.single-post .bkmos-related-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  margin: 0 0 6px !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  color: #778894 !important;
}

body.single-post .bkmos-related-meta span:first-child {
  color: #1987bd !important;
  font-weight: 700 !important;
}

body.single-post .bkmos-related-card h3 {
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
  font-size: 16px !important;
  line-height: 1.38 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.single-post .bkmos-related-card h3 a {
  color: var(--bkmos-type-ink, #172b3a) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
}

body.single-post .bkmos-related-card h3 a:hover {
  color: #0b74ad !important;
}

/* Bỏ Bài trước / Bài sau và related mặc định để chỉ còn khối BKMOS. */
body.single-post .td-post-next-prev,
body.single-post .tdb_single_next_prev,
body.single-post .tdb-single-next-prev,
body.single-post .tdb_single_next_prev_wrap,
body.single-post .td-post-prev-post,
body.single-post .td-post-next-post,
body.single-post nav.navigation.post-navigation,
body.single-post .post-navigation,
body.single-post .navigation-post,
body.single-post .single-post-navigation,
body.single-post .entry-navigation,
body.single-post .next-prev-nav,
body.single-post [data-bkmos-adjacent-nav-hidden="1"],
body.single-post .td_block_related_posts,
body.single-post .tdb_single_related,
body.single-post .tdb-single-related {
  display: none !important;
}

@media (max-width: 1024px) {
  body.single-post .bkmos-related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 16px;
  }
}

@media (max-width: 600px) {
  body.single-post .bkmos-related-posts {
    margin-top: 34px !important;
    padding-top: 20px !important;
  }
  body.single-post .bkmos-related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 12px;
  }
  body.single-post .bkmos-related-heading h2 {
    font-size: 20px !important;
  }
  body.single-post .bkmos-related-card h3 {
    font-size: 14px !important;
    line-height: 1.35 !important;
  }
  body.single-post .bkmos-related-meta {
    font-size: 10.5px !important;
  }
}

/* =========================================================
 * v2.2.6 — SINGLE SIDEBAR NEWSPAPER: CTA + TOC H2 FLOAT THEO NỘI DUNG
 * Ẩn widget mặc định; CTA tĩnh, TOC bám theo cột nội dung và không có scrollbar riêng.
 * ======================================================= */
body.single-post [data-bkmos-single-sidebar="1"] > [data-bkmos-sidebar-original="1"],
body.single-post [data-bkmos-single-sidebar="1"] [data-bkmos-sidebar-original="1"] {
  display: none !important;
}

body.single-post .bkmos-single-sidebar-shell {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  min-height: var(--bkmos-sidebar-track-height, auto) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
}

body.single-post .bkmos-single-sidebar-cta {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  margin: 0 0 24px !important;
  padding: 34px 34px 36px !important;
  background: #202020 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.single-post .bkmos-sidebar-cta-kicker {
  margin: 0 0 12px !important;
  padding: 0 !important;
  color: #ffc400 !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
}

body.single-post .bkmos-sidebar-cta-title {
  margin: 0 0 24px !important;
  padding: 0 !important;
  color: #fff !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
  font-size: 25px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.single-post .bkmos-sidebar-cta-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 24px !important;
  border-radius: 9px !important;
  background: #1479b8 !important;
  color: #fff !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background-color .15s ease, transform .15s ease;
}

body.single-post .bkmos-sidebar-cta-button:hover {
  background: #0c669e !important;
  color: #fff !important;
  transform: translateY(-1px);
}

body.single-post .bkmos-single-toc {
  display: block !important;
  position: -webkit-sticky !important;
  position: sticky !important;
  top: var(--bkmos-toc-sticky-top, 86px) !important;
  z-index: 6 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-height: none !important;
  overflow: visible !important;
  margin: 0 !important;
  padding: 18px 18px 14px !important;
  border: 1px solid #dfe8ee !important;
  border-radius: 5px !important;
  background: #fff !important;
  box-shadow: 0 4px 18px rgba(20, 50, 70, .045) !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
}

body.single-post .bkmos-single-toc-title {
  margin: 0 0 10px !important;
  padding: 0 0 10px !important;
  border-bottom: 2px solid #1e1e1e !important;
  color: var(--bkmos-type-ink, #172b3a) !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
  font-size: 18px !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.single-post .bkmos-single-toc-list {
  list-style: none !important;
  counter-reset: bkmos-toc;
  margin: 0 !important;
  padding: 0 !important;
}

body.single-post .bkmos-single-toc-list li {
  list-style: none !important;
  counter-increment: bkmos-toc;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  border-bottom: 1px solid #edf1f4 !important;
}

body.single-post .bkmos-single-toc-list li:last-child {
  border-bottom: 0 !important;
}

body.single-post .bkmos-single-toc-list a {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  gap: 7px !important;
  align-items: start !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 9px 3px !important;
  background: transparent !important;
  color: #50636f !important;
  font-family: var(--bkmos-type-font, Arial, sans-serif) !important;
  font-size: 13.5px !important;
  line-height: 1.42 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
}

body.single-post .bkmos-single-toc-list a::before {
  content: counter(bkmos-toc, decimal-leading-zero) !important;
  color: #9aabb5 !important;
  font-size: 11px !important;
  line-height: 1.75 !important;
  font-weight: 700 !important;
}

body.single-post .bkmos-single-toc-list a:hover,
body.single-post .bkmos-single-toc-list a.is-active {
  color: #087bb5 !important;
}

body.single-post .bkmos-single-toc-list a.is-active {
  font-weight: 700 !important;
}

body.single-post .bkmos-single-toc-list a.is-active::before {
  color: #087bb5 !important;
}

/* Newspaper đôi khi thêm margin/padding vào wrapper sidebar. */
body.single-post .td-main-sidebar [data-bkmos-single-sidebar="1"],
body.single-post .td-ss-main-sidebar[data-bkmos-single-sidebar="1"] {
  overflow: visible !important;
}

/* Các ancestor Newspaper không được cắt sticky/floating TOC. */
body.single-post .td-main-sidebar,
body.single-post .td-ss-main-sidebar,
body.single-post .td-pb-row,
body.single-post .td-main-content-wrap {
  overflow: visible !important;
}

@media (max-width: 1018px) {
  body.single-post .bkmos-single-sidebar-cta {
    padding: 26px 24px 28px !important;
  }
  body.single-post .bkmos-sidebar-cta-title {
    font-size: 22px !important;
  }
}

@media (max-width: 767px) {
  body.single-post .bkmos-single-sidebar-shell {
    min-height: 0 !important;
  }
  body.single-post .bkmos-single-toc {
    position: static !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
    margin-bottom: 24px !important;
  }
}