/* mt.css — TỆP GHÉP SINH TỰ ĐỘNG từ css/src/*.css bằng tools/e2e/theme-sync-assets.mjs. KHÔNG sửa tay: sửa tệp trong css/src/ rồi chạy lại.
   Thành phần: 00-tokens.css, 10-base.css, 20-layout.css, 30-header.css, 35-megamenu.css, 40-footer.css, 50-components.css, 55-content.css, 60-blocks.css, 70-compat.css, 75-integration.css, 80-print.css */

/* ===== 00-tokens.css ===== */
/* 00-tokens.css — SINH TỰ ĐỘNG từ assets/brand/palette.json bằng tools/e2e/theme-sync-assets.mjs. KHÔNG sửa tay.
   Nguồn màu: assets/brand/logo-original.jpg (SHA-256 F56B406C76368DB0B659C2773FF28199DEB1E31A16951101C66BCBFB2EE5695F); dữ liệu sinh ngày 2026-10-03. Tên biến giữ đúng như palette.json. */
:root {
  /* Màu thô từ biểu trưng (tâm cụm k-means) — chỉ dùng cho trang trí/minh họa */
  --mt-paper: #F6FBFA;
  --mt-navy: #082D7F;
  --mt-cobalt: #0D46A6;
  --mt-amber: #F8B320;
  --mt-gold: #FAD233;
  --mt-sky-pale: #C0E6F6;
  --mt-azure: #1374D7;
  --mt-gold-light: #F6E279;
  --mt-orange: #E2881C;
  --mt-cream: #F3E9BA;
  --mt-sky: #40BBEF;
  --mt-ink: #1E2C58;
  --mt-slate: #667E9E;
  --mt-bronze: #AC6634;
  --mt-green: #68B730;
  --mt-flame: #F86515;
  /* Bề mặt/nền */
  --mt-bg-page: #F6FBFA;
  --mt-bg-card: #FFFFFF;
  --mt-bg-tint: #E0F3FB;
  --mt-bg-notice: #F9F4DD;
  --mt-bg-chip: #C0E6F6;
  --mt-bg-dark: #082D7F;
  /* Chữ */
  --mt-text: #1E2C58;
  --mt-text-muted: #576F8F;
  --mt-text-on-dark: #FFFFFF;
  --mt-text-on-dark-muted: #C0E6F6;
  /* Hành động (nút, liên kết, nhấn) */
  --mt-primary: #0D46A6;
  --mt-primary-strong: #082D7F;
  --mt-on-primary: #FFFFFF;
  --mt-link: #0D46A6;
  --mt-link-hover: #082D7F;
  --mt-link-on-dark: #C0E6F6;
  --mt-accent: #FAD233;
  --mt-accent-hover: #F8B320;
  --mt-on-accent: #1E2C58;
  --mt-accent-text: #986200;
  /* Trạng thái */
  --mt-success: #68B730;
  --mt-on-success: #1E2C58;
  --mt-success-text: #297E00;
  --mt-warning: #E2881C;
  --mt-on-warning: #1E2C58;
  --mt-warning-text: #A85800;
  --mt-info: #1374D7;
  --mt-on-info: #FFFFFF;
  --mt-info-text: #006DCE;
  --mt-alert-text: #C73C00;
  /* Viền và focus */
  --mt-border: #C9D2DD;
  --mt-border-strong: #667E9E;
  --mt-focus: #082D7F;
  --mt-focus-on-dark: #FAD233;
}

/* ===== 10-base.css ===== */
/* 10-base.css — token bổ sung (khoảng cách, cỡ chữ, bo góc, bóng), đặt lại kiểu, chữ, focus, tiện ích.
   Mọi giá trị màu lấy từ token --mt-* ở 00-tokens.css (sinh từ assets/brand/palette.json). */

:root {
  /* Phông: chữ hệ thống (không tải phông ngoài). Hỗ trợ tốt dấu tiếng Việt. */
  --mt-font: "Segoe UI", system-ui, -apple-system, "Roboto", "Noto Sans", "Helvetica Neue", Arial, sans-serif;

  /* Bo góc: mềm vừa phải */
  --mt-radius-xs: 4px;
  --mt-radius-sm: 8px;
  --mt-radius: 14px;
  --mt-radius-lg: 22px;
  --mt-radius-pill: 999px;

  /* Khoảng cách (thang 4 px) */
  --mt-space-1: .25rem;
  --mt-space-2: .5rem;
  --mt-space-3: .75rem;
  --mt-space-4: 1rem;
  --mt-space-5: 1.5rem;
  --mt-space-6: 2rem;
  --mt-space-7: 3rem;
  --mt-space-8: 4.5rem;

  /* Cỡ chữ (co giãn theo khung nhìn) */
  --mt-fs-xs: .8125rem;
  --mt-fs-sm: .9375rem;
  --mt-fs-base: 1rem;
  --mt-fs-lg: 1.125rem;
  --mt-fs-xl: clamp(1.25rem, 1.12rem + .5vw, 1.5rem);
  --mt-fs-2xl: clamp(1.5rem, 1.25rem + 1vw, 2rem);
  --mt-fs-3xl: clamp(1.75rem, 1.3rem + 1.8vw, 2.625rem);
  --mt-lh: 1.65;
  --mt-lh-tight: 1.28;

  /* Bóng đổ ánh xanh navy, nhẹ */
  --mt-shadow-1: 0 1px 2px rgba(8, 45, 127, .08), 0 1px 1px rgba(8, 45, 127, .05);
  --mt-shadow-2: 0 10px 26px -10px rgba(8, 45, 127, .30), 0 2px 6px rgba(8, 45, 127, .08);
  --mt-shadow-3: 0 22px 48px -16px rgba(8, 45, 127, .38), 0 4px 12px rgba(8, 45, 127, .10);

  /* Khung */
  --mt-container: 1200px;
  --mt-gutter: clamp(16px, 3.5vw, 32px);
  --mt-flow: clamp(2rem, 1.4rem + 2.4vw, 3.25rem);
  --mt-ease: cubic-bezier(.2, .7, .2, 1);
  --mt-nav-bp: 60rem; /* 960 px: từ đây menu ngang, dưới đây là ngăn kéo */
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  /* 100% (16 px mặc định của trình duyệt): Bootstrap 3 của lõi (chế độ tương thích) đặt html { font-size: 10px }, làm mọi đơn vị rem nhỏ đi 37,5% */
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 1rem;
}

@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

body.mt-body {
  margin: 0;
  background: var(--mt-bg-page);
  color: var(--mt-text);
  font-family: var(--mt-font);
  font-size: var(--mt-fs-base);
  font-weight: 400;
  line-height: var(--mt-lh);
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:where(.mt-body) img,
:where(.mt-body) video,
:where(.mt-body) svg,
:where(.mt-body) canvas,
:where(.mt-body) iframe,
:where(.mt-body) embed,
:where(.mt-body) object {
  max-width: 100%;
}

:where(.mt-body) img {
  height: auto;
  border: 0;
  vertical-align: middle;
}

:where(.mt-body) iframe {
  border: 0;
}

/* Chữ ------------------------------------------------------------------ */

:where(.mt-body) h1,
:where(.mt-body) h2,
:where(.mt-body) h3,
:where(.mt-body) h4,
:where(.mt-body) h5,
:where(.mt-body) h6 {
  margin: 0 0 .55em;
  color: var(--mt-primary-strong);
  font-family: var(--mt-font);
  font-weight: 700;
  line-height: var(--mt-lh-tight);
  letter-spacing: -.005em;
}

:where(.mt-body) h1 { font-size: var(--mt-fs-3xl); }
:where(.mt-body) h2 { font-size: var(--mt-fs-2xl); }
:where(.mt-body) h3 { font-size: var(--mt-fs-xl); }
:where(.mt-body) h4 { font-size: var(--mt-fs-lg); }
:where(.mt-body) h5,
:where(.mt-body) h6 { font-size: var(--mt-fs-base); }

:where(.mt-body) p {
  margin: 0 0 1em;
}

:where(.mt-body) :where(ul, ol) {
  margin: 0 0 1em;
  padding-left: 1.4em;
}

:where(.mt-body) a {
  color: var(--mt-link);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}

:where(.mt-body) a:where(:hover) {
  color: var(--mt-link-hover);
  text-decoration-thickness: 2px;
}

:where(.mt-body) hr {
  height: 0;
  margin: 1.75rem 0;
  border: 0;
  border-top: 1px solid var(--mt-border);
}

:where(.mt-body) strong,
:where(.mt-body) b {
  font-weight: 700;
}

:where(.mt-body) small {
  font-size: .875em;
}

:where(.mt-body) blockquote {
  margin: 0 0 1.25em;
  padding: .85rem 1.25rem;
  border-left: 4px solid var(--mt-gold);
  border-radius: 0 var(--mt-radius-sm) var(--mt-radius-sm) 0;
  background: var(--mt-bg-notice);
  color: var(--mt-text);
}

:where(.mt-body) blockquote > :last-child {
  margin-bottom: 0;
}

:where(.mt-body) code,
:where(.mt-body) kbd,
:where(.mt-body) pre {
  font-family: ui-monospace, "Cascadia Mono", Consolas, "Liberation Mono", monospace;
  font-size: .9em;
}

:where(.mt-body) pre {
  max-width: 100%;
  overflow: auto;
  padding: 1rem;
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-tint);
}

::selection {
  background: var(--mt-gold);
  color: var(--mt-on-accent);
}

/* Biểu tượng nội tuyến (sprite images/mt-icons.svg) ------------------------- */

.mt-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.mt-icon {
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: -.22em;
}

/* Focus rõ ràng (≥ 3:1) -------------------------------------------------------- */

.mt-body :focus {
  outline-offset: 2px;
}

.mt-body :focus-visible {
  outline: 3px solid var(--mt-focus);
  outline-offset: 2px;
  border-radius: var(--mt-radius-xs);
}

.mt-on-dark :focus-visible,
.mt-footer :focus-visible {
  outline-color: var(--mt-focus-on-dark);
}

.mt-body :focus:not(:focus-visible) {
  outline: 0;
}

.mt-main:focus {
  outline: 0;
}

/* Tiện ích ---------------------------------------------------------------------- */

.mt-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.mt-skip-link {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 1000;
  padding: .7rem 1.1rem;
  border-radius: var(--mt-radius-sm);
  background: var(--mt-accent);
  color: var(--mt-on-accent);
  font-weight: 700;
  text-decoration: none;
  box-shadow: var(--mt-shadow-3);
  transform: translateY(-250%);
}

.mt-skip-link:focus {
  transform: none;
}

.mt-skip-link:hover,
.mt-skip-link:focus {
  color: var(--mt-on-accent);
}

[hidden] {
  display: none !important;
}

.mt-text-muted {
  color: var(--mt-text-muted);
}

.mt-nowrap {
  white-space: nowrap;
}

/* Giảm chuyển động theo tùy chọn của người dùng ---------------------------------- */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    transition-delay: 0s !important;
    scroll-behavior: auto !important;
  }
}

/* ===== 20-layout.css ===== */
/* 20-layout.css — khung: container, lưới, stack, cluster, section, bố cục trang (main/full/home). */

.mt-container {
  width: 100%;
  max-width: calc(var(--mt-container) + 2 * var(--mt-gutter));
  margin-inline: auto;
  padding-inline: var(--mt-gutter);
}

/* Lưới: luôn dùng minmax(0, 1fr) để nội dung dài không làm tràn ngang (kể cả 320 px) */
.mt-grid {
  display: grid;
  gap: var(--mt-gap, 1.25rem);
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 40em) {
  .mt-grid--2,
  .mt-grid--3,
  .mt-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 60em) {
  .mt-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mt-grid--4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.mt-stack > * + * {
  margin-top: var(--mt-stack, 1rem);
}

.mt-cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--mt-cluster-gap, .5rem .75rem);
}

/* Section: khối nội dung có tiêu đề -------------------------------------------- */

.mt-section {
  margin: 0;
}

.mt-section__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .25rem 1rem;
  margin: 0 0 1.25rem;
  border-bottom: 2px solid var(--mt-border);
}

.mt-section__title {
  position: relative;
  margin: 0;
  padding: 0 0 .7rem;
  font-size: var(--mt-fs-xl);
}

.mt-section__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 4rem;
  height: 4px;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(90deg, var(--mt-gold) 0 75%, var(--mt-orange) 75% 100%);
}

.mt-section__more {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding-bottom: .6rem;
  font-size: var(--mt-fs-sm);
  font-weight: 600;
  text-decoration: none;
}

/* TRANG CHỦ — dải tiêu đề khối (yêu cầu chủ dự án 2026-10-07): cùng ngôn ngữ với thanh menu ngang (nền --mt-primary, viền dưới vàng 4px — 30-header.css .mt-nav),
   thêm dải chéo nhẹ và vạch vàng đầu dòng để nhận ra từ xa. Chữ trắng trên nền từ #082D7F đến #155BC4: tương phản ≥ 6,3:1 (WCAG AA cho mọi cỡ chữ). */
.mt-is-home .mt-section__head {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .25rem 1rem;
  margin: 0 0 1.25rem;
  padding: .7rem 1rem .7rem 1.15rem;
  overflow: hidden;
  color: var(--mt-on-primary);
  border-bottom: 4px solid var(--mt-gold);
  border-radius: var(--mt-radius, 10px) var(--mt-radius, 10px) 0 0;
  background:
    linear-gradient(115deg, transparent 0 62%, rgba(255, 255, 255, .07) 62% 74%, transparent 74% 100%),
    linear-gradient(90deg, var(--mt-primary-strong) 0%, var(--mt-primary) 70%, #155BC4 100%);
  box-shadow: 0 6px 16px -10px rgba(8, 45, 127, .55);
}

.mt-is-home .mt-section__title {
  position: relative;
  margin: 0;
  padding: 0 0 0 .9rem;
  color: var(--mt-on-primary);
  font-size: var(--mt-fs-xl);
  line-height: 1.25;
  letter-spacing: .01em;
}

/* vạch vàng đầu tiêu đề (thay gạch chân vàng-cam cũ trên trang chủ) */
.mt-is-home .mt-section__title::after { content: none; }
.mt-is-home .mt-section__title::before {
  content: "";
  position: absolute;
  left: 0;
  top: .15em;
  bottom: .15em;
  width: 5px;
  border-radius: 3px;
  background: linear-gradient(180deg, var(--mt-gold) 0 70%, var(--mt-orange) 70% 100%);
}

.mt-is-home .mt-section__title a {
  color: inherit;
  text-decoration: none;
}

.mt-is-home .mt-section__title a:hover,
.mt-is-home .mt-section__title a:focus {
  color: var(--mt-gold);
}

.mt-is-home .mt-section__head .mt-section__more {
  color: var(--mt-on-primary);
}

.mt-is-home .mt-section__head .mt-section__more:hover,
.mt-is-home .mt-section__head .mt-section__more:focus {
  color: var(--mt-gold);
}

.mt-is-home .mt-section__head :focus-visible {
  outline: 3px solid var(--mt-gold);
  outline-offset: 2px;
}

@media (forced-colors: active) {
  .mt-is-home .mt-section__head { border: 1px solid CanvasText; }
  .mt-is-home .mt-section__title::before { background: CanvasText; }
}

/* Liên kết dạng thành phần (tiêu đề thẻ, dòng danh sách, "xem tất cả") không gạch chân; rê chuột/focus đổi màu (OWN-22). Liên kết TRONG THÂN BÀI vẫn gạch chân (10-base.css, 55-content.css). */
.mt-section__more:hover,
.mt-section__more:focus {
  color: var(--mt-link-hover);
  text-decoration: none;
}

/* Khung nội dung chính của trang con -------------------------------------------- */

.mt-page {
  padding-block: 1.75rem 0;
}

.mt-page__grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

.mt-main {
  min-width: 0;
}

@media (min-width: 64em) {
  .mt-page__grid--aside {
    grid-template-columns: minmax(0, 1fr) 20.5rem;
    gap: 2.5rem;
  }
}

.mt-page-title {
  position: relative;
  margin: 0 0 1.5rem;
  padding-bottom: .85rem;
  font-size: var(--mt-fs-3xl);
}

.mt-page-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 4.5rem;
  height: 5px;
  border-radius: 5px;
  background: linear-gradient(90deg, var(--mt-gold) 0 75%, var(--mt-orange) 75% 100%);
}

.mt-module {
  min-width: 0;
}

.mt-slot > * + * {
  margin-top: var(--mt-flow);
}

.mt-aside > * + * {
  margin-top: 1.5rem;
}

.mt-errorinfo {
  margin-bottom: 1rem;
}

.mt-simple {
  padding: 1rem;
}

/* Trang chủ ------------------------------------------------------------------------ */

.mt-main--home {
  padding-bottom: 0;
}

/* Trang chủ liền mạch (yêu cầu chủ dự án 2026-10-07, OWN-25): mọi khối cách nhau MỘT khoảng hẹp duy nhất --mt-flow-home
   (~16–20 px) thay cho --mt-flow (~32–52 px); dải tiêu đề có nền đã đủ tách các khối nên không cần khoảng trắng lớn.
   Đặt lại --mt-flow trong phạm vi trang chủ để .mt-flow/.mt-slot/.mt-pair (dùng chung biến) cùng hẹp lại. */
.mt-main--home {
  --mt-flow-home: clamp(1rem, .85rem + .6vw, 1.25rem);
  --mt-flow: var(--mt-flow-home);
}

.mt-main--home > * + * {
  margin-top: var(--mt-flow-home);
}

.mt-main--home > :first-child {
  margin-top: 0;
}

/* dải nền "Tin theo điểm trường": nền chạy sát khối trên/dưới (không lề ngoài); đệm trong = đúng khoảng chung,
   nên khoảng nhìn thấy giữa nội dung các khối vẫn chỉ là --mt-flow-home. Bộ chọn mạnh hơn .mt-band (khai báo sau trong tệp này). */
.mt-main.mt-main--home > .mt-band {
  margin-block: 0;
  padding-block: var(--mt-flow-home);
}

.mt-main.mt-main--home > .mt-band + * {
  margin-top: 0;
}

/* khung nội dung tab (tin theo điểm trường) có lề dưới riêng: trong dải nền trang chủ bỏ đi để đệm dải là khoảng duy nhất */
.mt-main--home > .mt-band .mt-tabs__panel {
  margin-bottom: 0;
}

/* chân trang nối ngay sau khối cuối của trang chủ */
.mt-is-home .mt-footer {
  margin-top: var(--mt-flow-home);
}

.mt-home-lead {
  position: relative;
  padding-block: 1.75rem 0;
}

.mt-home-lead__grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

.mt-home-lead__grid > :only-child {
  grid-column: 1 / -1;
}

@media (min-width: 64em) {
  .mt-home-lead__grid {
    grid-template-columns: minmax(0, 1fr) 22rem;
    gap: 2rem;
  }

  .mt-home-lead__grid > :only-child {
    grid-column: 1 / -1;
  }
}

.mt-flow > * + * {
  margin-top: var(--mt-flow);
}

.mt-pair {
  display: grid;
  gap: var(--mt-flow) 2rem;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

@media (min-width: 60em) {
  .mt-pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mt-pair > :only-child {
    grid-column: 1 / -1;
  }
}

/* Dải nền: tin theo điểm trường… (nền nhạt toàn chiều rộng) */
.mt-band {
  position: relative;
  padding-block: clamp(2rem, 1.5rem + 2vw, 3.25rem);
  background: var(--mt-bg-tint);
  border-block: 1px solid #cfe7f2;
}

.mt-band::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: linear-gradient(var(--mt-gold) 0 60%, var(--mt-orange) 60% 100%);
}

.mt-slot--hero,
.mt-slot--notice {
  min-width: 0;
}

/* ===== 30-header.css ===== */
/* 30-header.css — đầu trang: thanh liên hệ + truy cập nhanh, khối nhận diện, tìm kiếm, menu chính (ngang ≥ 960 px, ngăn kéo dưới đó), breadcrumb. */

.mt-header {
  position: relative;
  z-index: 40;
}

/* Thanh trên cùng: liên hệ công khai + truy cập nhanh ------------------------------ */

.mt-topbar {
  background: var(--mt-primary-strong);
  color: var(--mt-text-on-dark);
  font-size: var(--mt-fs-xs);
}

.mt-topbar__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .15rem 1.5rem;
  min-height: 2.5rem;
  padding-block: .25rem;
}

.mt-topbar__contact {
  display: flex;
  flex-wrap: wrap;
  gap: .1rem 1.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-topbar a,
.mt-topbar a:hover,
.mt-topbar a:focus {
  color: var(--mt-text-on-dark);
}

.mt-topbar__contact a {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding-block: .25rem;
  text-decoration: none;
}

/* Điều hướng của khung trang KHÔNG gạch chân (OWN-22): rê chuột/focus đổi sang vàng; focus bàn phím có viền vàng (10-base.css) */
.mt-topbar__contact a:hover,
.mt-topbar__contact a:focus {
  color: var(--mt-gold);
  text-decoration: none;
}

.mt-topbar__contact .mt-icon {
  color: var(--mt-gold);
}

.mt-topbar__quick {
  min-width: 0;
  max-width: 100%;
}

/* Truy cập nhanh (block mt_quick_links, kiểu "bar") */
.mt-quick--bar {
  display: flex;
  flex-wrap: wrap;
  gap: .1rem .25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-quick--bar .mt-quick__link {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .3rem .7rem;
  border-radius: var(--mt-radius-pill);
  color: var(--mt-text-on-dark);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.mt-quick--bar .mt-quick__link:hover,
.mt-quick--bar .mt-quick__link:focus {
  background: rgba(255, 255, 255, .16);
  color: var(--mt-text-on-dark);
}

.mt-quick--bar .mt-icon {
  color: var(--mt-gold);
}

@media (max-width: 39.99em) {
  .mt-topbar__quick {
    width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
  }

  .mt-quick--bar {
    flex-wrap: nowrap;
  }
}

/* Khối nhận diện ------------------------------------------------------------------- */

.mt-masthead {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--mt-border);
  background: #fff;
}

/* Họa tiết: hai vành đồng tâm gợi huy hiệu của biểu trưng (rất nhạt, chỉ trang trí) */
.mt-masthead::before,
.mt-masthead::after {
  content: "";
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
}

.mt-masthead::before {
  top: -9rem;
  right: -5rem;
  width: 21rem;
  height: 21rem;
  border: 2.25rem solid var(--mt-bg-tint);
}

.mt-masthead::after {
  top: -4.5rem;
  right: .5rem;
  width: 10.5rem;
  height: 10.5rem;
  border: 1.1rem solid var(--mt-bg-notice);
}

.mt-masthead__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem 2rem;
  padding-block: .85rem;
}

.mt-brand,
.mt-brand:hover,
.mt-brand:focus {
  display: flex;
  align-items: center;
  gap: .9rem;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

.mt-brand__logo {
  width: 56px;
  height: 56px;
  flex: none;
}

.mt-brand__text {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: .1rem;
}

.mt-brand__org {
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  line-height: 1.3;
}

/* Tên trường VIẾT HOA (OWN-19) bằng CSS: văn bản nguồn giữ kiểu chữ chuẩn (SEO, trình đọc màn hình); text-wrap: balance chia hai dòng cân
   (TRƯỜNG TIỂU HỌC / MƯỜNG THANH) khi màn hình hẹp thay vì rớt một từ lẻ. */
.mt-brand__name {
  margin: 0;
  color: var(--mt-primary-strong);
  font-size: clamp(.875rem, .5rem + 1.72vw, 1.75rem);
  font-weight: 800;
  letter-spacing: .018em;
  line-height: 1.18;
  text-transform: uppercase;
  text-wrap: balance;
}

.mt-brand__place {
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
  line-height: 1.3;
}

@media (min-width: 40em) {
  .mt-brand__place {
    font-size: var(--mt-fs-sm);
  }
}

.mt-masthead__tools {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-left: auto;
}

/* Nút công cụ (menu, tìm kiếm) */
.mt-toolbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: 0 .85rem;
  border: 2px solid var(--mt-primary);
  border-radius: var(--mt-radius-pill);
  background: #fff;
  color: var(--mt-primary);
  font: 700 var(--mt-fs-sm) / 1 var(--mt-font);
  cursor: pointer;
}

.mt-toolbtn:hover,
.mt-toolbtn:focus,
.mt-toolbtn[aria-expanded="true"] {
  background: var(--mt-primary);
  color: var(--mt-on-primary);
}

/* Tìm kiếm */
.mt-search {
  position: relative;
  display: none;
  align-items: stretch;
  flex: 1 0 100%;
  order: 5;
}

.mt-search.is-open {
  display: flex;
}

.mt-search__input {
  flex: 1 1 auto;
  min-width: 0;
  height: 2.875rem;
  padding: 0 1.1rem;
  border: 2px solid var(--mt-border-strong);
  border-right: 0;
  border-radius: var(--mt-radius-pill) 0 0 var(--mt-radius-pill);
  background: #fff;
  color: var(--mt-text);
  font: 400 var(--mt-fs-base) / 1.2 var(--mt-font);
  -webkit-appearance: none;
  appearance: none;
}

.mt-search__input::placeholder {
  color: var(--mt-text-muted);
  opacity: 1;
}

.mt-search__input:focus {
  border-color: var(--mt-primary);
}

.mt-search__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  border: 2px solid var(--mt-primary);
  border-radius: 0 var(--mt-radius-pill) var(--mt-radius-pill) 0;
  background: var(--mt-primary);
  color: var(--mt-on-primary);
  cursor: pointer;
}

.mt-search__btn:hover,
.mt-search__btn:focus {
  border-color: var(--mt-primary-strong);
  background: var(--mt-primary-strong);
  color: var(--mt-on-primary);
}

.mt-search__hint {
  position: absolute;
  top: 100%;
  left: .5rem;
  right: .5rem;
  z-index: 5;
  margin: .4rem 0 0;
  padding: .45rem .85rem;
  border-left: 4px solid var(--mt-orange);
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-notice);
  color: var(--mt-text);
  font-size: var(--mt-fs-xs);
  box-shadow: var(--mt-shadow-2);
}

/* Mobile: các nút công cụ cùng hàng với biểu trưng, ô tìm kiếm mở thành hàng riêng */
@media (max-width: 59.99em) {
  .mt-masthead__tools {
    display: contents;
  }

  .mt-nav-toggle,
  .mt-search-toggle {
    order: 2;
  }

  .mt-search-toggle {
    margin-left: auto;
  }

  .mt-brand {
    flex: 1 1 0;
  }

  .mt-masthead__inner {
    gap: .6rem .5rem;
    flex-wrap: wrap;
  }

  .mt-search-toggle + .mt-nav-toggle {
    margin-left: 0;
  }

  .mt-brand__org {
    display: none;
  }
}

/* Điện thoại hẹp: nút menu/tìm kiếm chỉ còn biểu tượng (nhãn chữ vẫn có cho trình đọc màn hình) để tên trường có chỗ hiển thị */
@media (max-width: 29.99em) {
  .mt-toolbtn {
    padding: 0;
  }

  .mt-brand,
  .mt-brand:hover,
  .mt-brand:focus {
    gap: .6rem;
  }

  .mt-brand__logo {
    width: 48px;
    height: 48px;
  }

  .mt-masthead .mt-toolbtn {
    min-width: 2.5rem;
    min-height: 2.5rem;
  }

  .mt-toolbtn__label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }
}

@media (min-width: 40em) {
  .mt-brand__logo {
    width: 76px;
    height: 76px;
  }
}

@media (min-width: 60em) {
  .mt-brand__logo {
    width: 88px;
    height: 88px;
  }

  .mt-masthead__inner {
    flex-wrap: nowrap;
    padding-block: 1rem;
  }

  .mt-masthead__tools {
    flex: 0 0 auto;
  }

  .mt-search {
    display: flex;
    flex: 0 1 22rem;
    order: 0;
    width: 22rem;
  }

  .mt-search-toggle,
  .mt-nav-toggle {
    display: none;
  }
}

/* Menu chính ---------------------------------------------------------------------- */

html.mt-nav-open {
  overflow: hidden;
}

/* Mặc định (di động): ngăn kéo bên phải */
.mt-nav {
  position: fixed;
  inset: 0;
  z-index: 200;
  visibility: hidden;
  pointer-events: none;
  transition: visibility 0s linear .28s;
}

.mt-nav.is-open {
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

.mt-nav__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(6, 22, 66, .6);
  opacity: 0;
  transition: opacity .28s var(--mt-ease);
}

.mt-nav.is-open .mt-nav__backdrop {
  opacity: 1;
}

.mt-nav__panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(88vw, 23.5rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--mt-primary-strong);
  color: var(--mt-text-on-dark);
  box-shadow: var(--mt-shadow-3);
  transform: translateX(105%);
  transition: transform .28s var(--mt-ease);
}

.mt-nav.is-open .mt-nav__panel {
  transform: none;
}

.mt-nav__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 1rem;
  border-bottom: 4px solid var(--mt-gold);
}

.mt-nav__title {
  font-size: var(--mt-fs-lg);
  font-weight: 700;
}

.mt-nav .mt-toolbtn {
  border-color: rgba(255, 255, 255, .7);
  background: transparent;
  color: var(--mt-text-on-dark);
}

.mt-nav .mt-toolbtn:hover,
.mt-nav .mt-toolbtn:focus {
  border-color: var(--mt-gold);
  background: var(--mt-gold);
  color: var(--mt-on-accent);
}

.mt-nav__inner {
  padding-inline: 0;
}

.mt-menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-menu > li {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  border-bottom: 1px solid rgba(255, 255, 255, .14);
}

.mt-menu__link {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  gap: .5rem;
  min-width: 0;
  padding: .95rem 1rem;
  color: var(--mt-text-on-dark);
  font-size: var(--mt-fs-base);
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
}

.mt-menu__link:hover,
.mt-menu__link:focus {
  background: rgba(255, 255, 255, .1);
  color: var(--mt-text-on-dark);
  text-decoration: none;
}

.mt-menu > li.active > .mt-menu__link {
  box-shadow: inset 5px 0 0 var(--mt-gold);
  background: rgba(255, 255, 255, .08);
}

.mt-menu__icon {
  flex: none;
  width: 18px;
  height: 18px;
  border-radius: 3px;
}

.mt-menu__toggle {
  display: inline-flex;
  flex: 0 0 3.25rem;
  align-items: center;
  justify-content: center;
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, .14);
  background: transparent;
  color: var(--mt-text-on-dark);
  cursor: pointer;
}

.mt-menu__toggle .mt-icon {
  transition: transform .2s var(--mt-ease);
}

.mt-menu__toggle[aria-expanded="true"] .mt-icon {
  transform: rotate(180deg);
}

.mt-menu__toggle:hover,
.mt-menu__toggle:focus {
  background: rgba(255, 255, 255, .14);
  color: var(--mt-text-on-dark);
}

.mt-menu__sub {
  display: none;
  flex: 0 0 100%;
  margin: 0;
  padding: .25rem 0 .5rem;
  list-style: none;
  background: rgba(0, 0, 0, .2);
}

.mt-menu > li.is-open > .mt-menu__sub {
  display: block;
}

.mt-menu__sublink {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .65rem 1rem .65rem 1.75rem;
  color: var(--mt-text-on-dark);
  font-size: var(--mt-fs-sm);
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
}

.mt-menu__sublink:hover,
.mt-menu__sublink:focus {
  background: rgba(255, 255, 255, .08);
  color: var(--mt-gold);
  text-decoration: none;
}

.mt-menu__sub .mt-menu__sub {
  display: block;
  padding: 0;
  background: transparent;
}

.mt-menu__sub .mt-menu__sub .mt-menu__sublink {
  padding-left: 2.75rem;
  color: var(--mt-text-on-dark-muted);
  font-size: var(--mt-fs-xs);
}

/* Từ 960 px: thanh menu ngang cố định dưới khối nhận diện */
@media (min-width: 60em) {
  .mt-nav {
    position: static;
    z-index: 45;
    visibility: visible;
    pointer-events: auto;
    border-bottom: 4px solid var(--mt-gold);
    background: var(--mt-primary);
    transition: none;
  }

  .mt-nav__backdrop,
  .mt-nav__head {
    display: none;
  }

  .mt-nav__panel {
    position: static;
    display: block;
    width: auto;
    overflow: visible;
    background: transparent;
    box-shadow: none;
    transform: none;
    transition: none;
  }

  .mt-nav__inner {
    padding-inline: var(--mt-gutter);
  }

  .mt-menu {
    display: flex;
    flex-wrap: wrap;
  }

  .mt-menu > li {
    position: relative;
    flex-wrap: nowrap;
    border-bottom: 0;
  }

  .mt-menu > li:hover,
  .mt-menu > li.is-open {
    background: rgba(255, 255, 255, .12);
  }

  .mt-menu > li.active {
    background: var(--mt-primary-strong);
    box-shadow: inset 0 4px 0 var(--mt-gold);
  }

  .mt-menu__link {
    flex: 0 1 auto;
    padding: 1.05rem 1.1rem;
  }

  .mt-menu > li.active > .mt-menu__link {
    box-shadow: none;
    background: transparent;
  }

  .mt-menu > li.dropdown > .mt-menu__link {
    padding-right: .15rem;
  }

  .mt-menu__toggle {
    flex: 0 0 2.1rem;
    border-left: 0;
  }

  .mt-menu__toggle:hover,
  .mt-menu__toggle:focus {
    background: transparent;
  }

  .mt-menu__sub {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 60;
    min-width: 16.5rem;
    max-width: 24rem;
    padding: .5rem;
    border-top: 4px solid var(--mt-gold);
    border-radius: 0 0 var(--mt-radius) var(--mt-radius);
    background: #fff;
    box-shadow: var(--mt-shadow-3);
  }

  .mt-menu > li:nth-last-child(-n + 2) > .mt-menu__sub {
    right: 0;
    left: auto;
  }

  .mt-menu > li.dropdown:hover > .mt-menu__sub {
    display: block;
  }

  .mt-menu > li.dropdown:hover > .mt-menu__toggle .mt-icon,
  .mt-menu > li.is-open > .mt-menu__toggle .mt-icon {
    transform: rotate(180deg);
  }

  .mt-menu__sublink {
    padding: .6rem .85rem;
    border-radius: var(--mt-radius-sm);
    color: var(--mt-text);
  }

  .mt-menu__sublink:hover,
  .mt-menu__sublink:focus {
    background: var(--mt-bg-tint);
    color: var(--mt-primary-strong);
    text-decoration: none;
  }

  .mt-menu__sub .mt-menu__sub {
    padding: 0 0 0 .5rem;
  }

  .mt-menu__sub .mt-menu__sub .mt-menu__sublink {
    padding: .45rem .85rem;
    color: var(--mt-text-muted);
  }
}

/* Breadcrumb / chỉ báo vị trí ------------------------------------------------------ */

.mt-pagehead {
  border-bottom: 1px solid #cfe7f2;
  background: var(--mt-bg-tint);
}

.mt-breadcrumb {
  padding-block: .65rem;
  font-size: var(--mt-fs-sm);
}

.mt-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .15rem .55rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-breadcrumb__item {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: .55rem;
  color: var(--mt-text);
  overflow-wrap: anywhere;
}

.mt-breadcrumb__item + .mt-breadcrumb__item::before {
  content: "";
  flex: none;
  width: .42rem;
  height: .42rem;
  border-top: 2px solid var(--mt-text-muted);
  border-right: 2px solid var(--mt-text-muted);
  transform: rotate(45deg);
}

.mt-breadcrumb a {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: var(--mt-link);
  text-decoration: none;
}

.mt-breadcrumb a:hover,
.mt-breadcrumb a:focus {
  color: var(--mt-link-hover);
  text-decoration: none;
}

.mt-breadcrumb [aria-current="page"] {
  color: var(--mt-text);
  font-weight: 700;
}

/* Khi tắt JavaScript (html không có lớp .mt-js): menu và ô tìm kiếm hiện sẵn, không cần ngăn kéo/nút mở */
@media (max-width: 59.99em) {
  html:not(.mt-js) .mt-nav {
    position: static;
    visibility: visible;
    pointer-events: auto;
    transition: none;
  }

  html:not(.mt-js) .mt-nav__backdrop,
  html:not(.mt-js) .mt-nav__head,
  html:not(.mt-js) .mt-nav-toggle,
  html:not(.mt-js) .mt-search-toggle,
  html:not(.mt-js) .mt-menu__toggle {
    display: none;
  }

  html:not(.mt-js) .mt-nav__panel {
    position: static;
    width: auto;
    transform: none;
    transition: none;
    box-shadow: none;
  }

  html:not(.mt-js) .mt-menu__sub {
    display: block;
  }

  html:not(.mt-js) .mt-search {
    display: flex;
  }
}

/* ===== 35-megamenu.css ===== */
/* 35 — Mega menu và bảng "Danh mục" theo đối tượng (docs/theme/navigation.md)
   Nền: ngăn kéo di động (accordion). Từ 60em: bảng thả rộng bằng container. */

.mt-dir {
  border-bottom: 1px solid rgba(255, 255, 255, .14);
}

.mt-dir__btn {
  display: flex;
  align-items: center;
  gap: .6rem;
  width: 100%;
  min-height: 3rem;
  padding: .85rem 1rem;
  border: 0;
  background: rgba(255, 255, 255, .1);
  color: var(--mt-text-on-dark);
  font: inherit;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.mt-dir__btn > .mt-icon:first-child {
  color: var(--mt-gold);
}

.mt-dir__caret {
  margin-left: auto;
  transition: transform .16s ease;
}

.mt-dir.is-open .mt-dir__caret {
  transform: rotate(180deg);
}

.mt-dir__btn:hover,
.mt-dir__btn:focus {
  background: rgba(255, 255, 255, .18);
  color: var(--mt-gold);
}

.mt-dir__btn:focus-visible,
.mt-dir__link:focus-visible {
  outline: 3px solid var(--mt-gold);
  outline-offset: -3px;
}

.mt-dir__panel {
  display: none;
  padding: .25rem 0 .75rem;
  background: rgba(0, 0, 0, .2);
}

.mt-dir.is-open .mt-dir__panel,
html:not(.mt-js) .mt-dir__panel {
  display: block;
}

html:not(.mt-js) .mt-dir__caret {
  display: none;
}

.mt-dir__title,
.mt-mega__head {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin: 0;
  padding: .8rem 1rem .35rem;
  color: var(--mt-gold);
  font-size: var(--mt-fs-xs);
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.3;
  text-transform: uppercase;
}

.mt-mega__head {
  padding-left: 1.75rem;
  list-style: none;
}

.mt-dir__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-dir__link {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .6rem 1rem .6rem 1.75rem;
  color: var(--mt-text-on-dark);
  font-size: var(--mt-fs-sm);
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
}

.mt-dir__link:hover,
.mt-dir__link:focus {
  background: rgba(255, 255, 255, .08);
  color: var(--mt-gold);
  text-decoration: none;
}

.mt-dir__link .mt-icon,
.mt-mega__icon {
  flex: 0 0 auto;
  width: 1.125rem;
  height: 1.125rem;
  opacity: .9;
}

.mt-nav .mt-menu__sublink[aria-current],
.mt-nav .mt-dir__link[aria-current] {
  box-shadow: inset 3px 0 0 var(--mt-gold);
  font-weight: 700;
}

@media (min-width: 60em) {
  .mt-nav .mt-nav__inner {
    position: relative;
    display: flex;
    align-items: stretch;
  }

  .mt-nav .mt-menu {
    flex: 1 1 auto;
    min-width: 0;
  }

  .mt-nav .mt-menu > li {
    position: static;
  }

  .mt-dir {
    display: flex;
    flex: 0 0 auto;
    border-bottom: 0;
  }

  .mt-dir__btn {
    width: auto;
    min-height: 0;
    padding: 0 1rem;
    background: var(--mt-primary-strong);
    white-space: nowrap;
  }

  .mt-dir__caret {
    margin-left: 0;
  }

  .mt-dir:hover .mt-dir__caret {
    transform: rotate(180deg);
  }

  /* Bảng thả: rộng bằng phần nội dung của container, nằm ngay dưới thanh menu */
  .mt-nav .mt-menu > li > .mt-menu__sub,
  .mt-nav .mt-dir__panel {
    position: absolute;
    top: 100%;
    right: var(--mt-gutter);
    left: var(--mt-gutter);
    z-index: 60;
    display: grid;
    grid-template-columns: repeat(var(--mt-mega-cols, 3), minmax(0, 1fr));
    grid-auto-flow: row dense;
    gap: 0 1.25rem;
    align-items: start;
    min-width: 0;
    max-width: none;
    max-height: calc(100vh - 6rem);
    margin: 0;
    padding: 1.1rem 1.25rem 1.25rem;
    overflow-y: auto;
    border-top: 4px solid var(--mt-gold);
    border-radius: 0 0 var(--mt-radius) var(--mt-radius);
    background: #fff;
    box-shadow: var(--mt-shadow-3);
    visibility: hidden;
    opacity: 0;
    transform: translateY(.4rem);
    pointer-events: none;
    transition: opacity .16s ease, transform .16s ease, visibility 0s linear .2s;
  }

  .mt-nav .mt-dir__panel {
    gap: 0 1.5rem;
  }

  /* Rê chuột: mở sau một nhịp ngắn để không bật nhầm khi lướt ngang thanh menu */
  .mt-nav .mt-menu > li.dropdown:hover > .mt-menu__sub,
  .mt-nav .mt-dir:hover > .mt-dir__panel,
  html:not(.mt-js) .mt-nav .mt-dir:focus-within > .mt-dir__panel {
    z-index: 61;
    display: grid;
    visibility: visible;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    transition: opacity .16s ease .12s, transform .16s ease .12s, visibility 0s linear .12s;
  }

  /* Bàn phím / bấm nút: mở ngay để đưa được focus vào bảng */
  .mt-nav .mt-menu > li.is-open > .mt-menu__sub,
  .mt-nav .mt-dir.is-open > .mt-dir__panel {
    z-index: 62;
    display: grid;
    visibility: visible;
    opacity: 1;
    transform: none;
    pointer-events: auto;
    transition: opacity .16s ease, transform .16s ease, visibility 0s;
  }

  .mt-nav .mt-menu__sub > .mt-menu__has-sub {
    grid-column: 1 / -1;
  }

  .mt-nav .mt-mega--grouped > .mt-menu__has-sub {
    grid-row: span 6;
  }

  /* Cấp 3: danh sách thường nằm trong cột của nhóm */
  .mt-nav .mt-menu__sub .mt-menu__sub {
    position: static;
    display: block;
    min-width: 0;
    max-width: none;
    max-height: none;
    padding: 0 0 0 .75rem;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    visibility: inherit;
    opacity: 1;
    transform: none;
    pointer-events: inherit;
    transition: none;
  }

  .mt-nav .mt-menu__sublink,
  .mt-nav .mt-dir__link {
    gap: .6rem;
    padding: .55rem .7rem;
    border-radius: var(--mt-radius-sm);
    color: var(--mt-text);
    font-size: var(--mt-fs-sm);
    font-weight: 600;
  }

  .mt-nav .mt-menu__sub .mt-menu__sub .mt-menu__sublink {
    padding: .5rem .7rem;
    color: var(--mt-text);
    font-size: var(--mt-fs-sm);
    font-weight: 500;
  }

  .mt-nav .mt-menu__sublink:hover,
  .mt-nav .mt-menu__sublink:focus,
  .mt-nav .mt-dir__link:hover,
  .mt-nav .mt-dir__link:focus {
    background: var(--mt-bg-tint);
    color: var(--mt-primary-strong);
    text-decoration: none;
  }

  .mt-nav .mt-menu__sublink:focus-visible,
  .mt-nav .mt-dir__link:focus-visible {
    outline: 3px solid var(--mt-primary-strong);
    outline-offset: -3px;
  }

  .mt-nav .mt-dir__link .mt-icon,
  .mt-nav .mt-mega__icon {
    color: var(--mt-primary);
  }

  .mt-nav .mt-dir__title,
  .mt-nav .mt-mega__head {
    margin-bottom: .4rem;
    padding: .15rem .7rem .5rem;
    border-bottom: 2px solid var(--mt-bg-tint);
    color: var(--mt-primary-strong);
  }

  .mt-nav .mt-dir__title .mt-icon {
    color: var(--mt-primary);
  }
}

/* 960–1199 px: thanh menu chật — nút Danh mục chỉ còn biểu tượng (nhãn vẫn đọc được bằng trình đọc màn hình) */
@media (min-width: 60em) and (max-width: 74.99em) {
  .mt-dir__label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }

  .mt-dir__btn {
    padding: 0 .7rem;
  }

  .mt-nav .mt-menu {
    flex-wrap: nowrap;
  }

  .mt-nav .mt-menu__link {
    padding-right: .55rem;
    padding-left: .55rem;
    font-size: .9375rem;
    white-space: nowrap;
  }

  .mt-nav .mt-menu__toggle {
    flex-basis: 1.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mt-nav .mt-menu__sub,
  .mt-nav .mt-dir__panel,
  .mt-dir__caret {
    transform: none !important;
    transition: none !important;
  }
}

/* ===== 40-footer.css ===== */
/* 40-footer.css — chân trang, về đầu trang, thông báo cookie, nhắc phiên đăng nhập.
   Chân trang (OWN-22, 2026-10-05): nền chuyển sắc navy → cobalt, mép trên lượn sóng có dải vàng (gợi dải băng của biểu trưng), vành đồng tâm (gợi huy hiệu);
   khối nhận diện (biểu trưng + tên trường VIẾT HOA + khẩu hiệu), liên hệ có biểu tượng trong vòng tròn, thẻ điểm trường nổi lên khi rê chuột, liên kết có mũi tên.
   KHÔNG gạch chân liên kết: trạng thái rê chuột/focus dùng màu vàng + chuyển động nhẹ + nền sáng lên; focus bàn phím luôn có viền vàng 3 px (≥ 3:1).
   Mọi chuyển động nằm trong (prefers-reduced-motion: no-preference); 10-base.css còn tắt transition/animation khi người dùng chọn giảm chuyển động. */

.mt-footer {
  position: relative;
  isolation: isolate;
  margin-top: var(--mt-flow);
  overflow: hidden;
  background: linear-gradient(155deg, #051b52 0%, var(--mt-primary-strong) 42%, var(--mt-primary) 100%);
  color: var(--mt-text-on-dark);
  --mt-footer-wave: clamp(1.5rem, 4.2vw, 3.75rem);
}

/* Mép trên lượn sóng: phần trên đường cong mang màu nền trang, dải vàng chạy theo đường cong (SVG trang trí trong layout/footer.tpl) */
.mt-footer__wave {
  position: absolute;
  top: -1px;
  left: 0;
  z-index: 0;
  display: block;
  width: 100%;
  max-width: none;
  height: var(--mt-footer-wave);
  pointer-events: none;
}

.mt-footer__wave-page {
  fill: var(--mt-bg-page);
}

.mt-footer__wave-gold {
  stroke: var(--mt-gold);
  stroke-width: 4;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}

.mt-footer__wave-soft {
  stroke: rgba(192, 230, 246, .3);
  stroke-width: 2;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}

/* Vành đồng tâm (trang trí, gợi huy hiệu của biểu trưng): một cụm lớn ở góc phải dưới, một cụm mờ ở góc trái */
.mt-footer__rings,
.mt-footer__rings::before {
  position: absolute;
  z-index: 0;
  border-radius: 50%;
  pointer-events: none;
}

.mt-footer__rings {
  right: -9rem;
  bottom: -13rem;
  width: 34rem;
  height: 34rem;
  background:
    radial-gradient(circle, transparent 0 21%, rgba(250, 210, 51, .1) 21% 23.5%, transparent 23.5% 33%, rgba(255, 255, 255, .055) 33% 41%, transparent 41% 52%, rgba(250, 210, 51, .07) 52% 53.5%, transparent 53.5% 62%, rgba(255, 255, 255, .04) 62% 70%, transparent 70%);
}

.mt-footer__rings::before {
  content: "";
  right: calc(100vw - 16rem);
  bottom: 15rem;
  width: 22rem;
  height: 22rem;
  background:
    radial-gradient(circle, transparent 0 38%, rgba(255, 255, 255, .04) 38% 47%, transparent 47% 60%, rgba(192, 230, 246, .05) 60% 62%, transparent 62%);
}

/* Liên kết trong chân trang: KHÔNG gạch chân (kể cả khi rê chuột); đổi sang vàng */
.mt-footer a,
.mt-footer a:hover,
.mt-footer a:focus {
  color: var(--mt-text-on-dark);
  text-decoration: none;
}

.mt-footer a:hover,
.mt-footer a:focus {
  color: var(--mt-gold);
}

/* Khối nhận diện: biểu trưng + tên trường VIẾT HOA + khẩu hiệu ---------------------------------- */

.mt-footer__brandbar {
  position: relative;
  z-index: 1;
  padding-top: calc(var(--mt-footer-wave) + 1.35rem);
}

.mt-footer__brand-inner {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem 2rem;
  padding-bottom: 1.6rem;
}

.mt-footer__brand-inner::after {
  content: "";
  position: absolute;
  right: var(--mt-gutter);
  bottom: 0;
  left: var(--mt-gutter);
  height: 1px;
  background: linear-gradient(90deg, rgba(250, 210, 51, .75) 0, rgba(255, 255, 255, .22) 28%, rgba(255, 255, 255, .06) 100%);
}

.mt-footer__brand,
.mt-footer__brand:hover,
.mt-footer__brand:focus {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 1.1rem;
  color: var(--mt-text-on-dark);
}

.mt-footer__logo {
  display: grid;
  flex: none;
  width: 5.5rem;
  height: 5.5rem;
  place-items: center;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 5px rgba(255, 255, 255, .12), 0 0 0 11px rgba(250, 210, 51, .12), 0 16px 30px -14px rgba(0, 0, 0, .6);
  transition: box-shadow .35s var(--mt-ease), transform .35s var(--mt-ease);
}

.mt-footer__logo img {
  display: block;
  width: 5.25rem;
  height: 5.25rem;
}

.mt-footer__brand:hover .mt-footer__logo,
.mt-footer__brand:focus .mt-footer__logo {
  box-shadow: 0 0 0 5px rgba(255, 255, 255, .2), 0 0 0 12px rgba(250, 210, 51, .28), 0 18px 34px -14px rgba(0, 0, 0, .65);
  transform: scale(1.03);
}

.mt-footer__brand-text {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: .35rem;
}

/* Tên trường viết HOA bằng CSS (văn bản nguồn giữ nguyên kiểu chữ chuẩn cho trình đọc màn hình/SEO) */
.mt-footer__brand-name {
  color: var(--mt-text-on-dark);
  font-size: clamp(1.125rem, .86rem + 1.25vw, 1.625rem);
  font-weight: 800;
  letter-spacing: .035em;
  line-height: 1.22;
  text-transform: uppercase;
  text-wrap: balance;
  transition: color .25s var(--mt-ease);
}

.mt-footer__brand:hover .mt-footer__brand-name,
.mt-footer__brand:focus .mt-footer__brand-name {
  color: var(--mt-gold);
}

.mt-footer__brand-slogan {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  color: var(--mt-gold);
  font-size: var(--mt-fs-base);
  font-style: italic;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.3;
}

.mt-footer__brand-slogan::after {
  content: "";
  width: 2.5rem;
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--mt-gold), rgba(250, 210, 51, 0));
}

.mt-footer__ident {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: .9rem;
}

/* Dòng cơ quan chủ quản · địa danh dưới khối nhận diện (như tiêu đề thư) */
.mt-footer__brand-org {
  display: flex;
  flex-wrap: wrap;
  gap: .1rem .6rem;
  margin: 0;
  color: var(--mt-text-on-dark-muted);
  font-size: var(--mt-fs-sm);
  line-height: 1.5;
}

.mt-footer__brand-place::before {
  content: "·";
  margin-right: .6rem;
  color: var(--mt-gold);
  font-weight: 700;
}

@media (max-width: 39.99em) {
  .mt-footer__brand-org {
    flex-direction: column;
  }

  .mt-footer__brand-place::before {
    content: none;
  }
}

.mt-footer .mt-footer__cta,
.mt-footer .mt-footer__cta:hover,
.mt-footer .mt-footer__cta:focus {
  display: inline-flex;
  min-height: 2.875rem;
  align-items: center;
  gap: .55rem;
  padding: .5rem 1.25rem;
  border-radius: var(--mt-radius-pill);
  background: linear-gradient(180deg, var(--mt-gold) 0%, var(--mt-amber) 100%);
  color: var(--mt-on-accent);
  font-weight: 700;
  line-height: 1.2;
  box-shadow: 0 12px 24px -14px rgba(248, 179, 32, .95), inset 0 1px 0 rgba(255, 255, 255, .5);
  transition: transform .25s var(--mt-ease), box-shadow .25s var(--mt-ease);
}

.mt-footer .mt-footer__cta:hover,
.mt-footer .mt-footer__cta:focus {
  box-shadow: 0 18px 30px -14px rgba(248, 179, 32, 1), inset 0 1px 0 rgba(255, 255, 255, .6);
  transform: translateY(-2px);
}

.mt-footer__cta-arrow {
  transition: transform .25s var(--mt-ease);
}

.mt-footer__cta:hover .mt-footer__cta-arrow,
.mt-footer__cta:focus .mt-footer__cta-arrow {
  transform: translateX(4px);
}

@media (max-width: 29.99em) {
  .mt-footer__logo {
    width: 4.25rem;
    height: 4.25rem;
  }

  .mt-footer__logo img {
    width: 4rem;
    height: 4rem;
  }

  .mt-footer__brand {
    gap: .85rem;
  }

  .mt-footer__brand-slogan::after {
    width: 1.5rem;
  }
}

/* Ba cột: liên hệ / điểm trường / liên kết ------------------------------------------------------ */

.mt-footer__main {
  position: relative;
  z-index: 1;
}

.mt-footer__grid {
  display: grid;
  gap: 2rem 2.75rem;
  grid-template-columns: minmax(0, 1fr);
  padding-block: 2rem 2.25rem;
}

/* Máy tính bảng: liên hệ | điểm trường cạnh nhau, liên kết trải một hàng 3 cột bên dưới */
@media (min-width: 40em) and (max-width: 55.99em) {
  .mt-footer__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
  }

  .mt-footer__col--nav {
    grid-column: 1 / -1;
  }

  .mt-footer__grid .mt-footnav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 56em) {
  .mt-footer__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.22fr) minmax(0, .78fr);
  }

  .mt-footer__grid > :only-child {
    grid-column: 1 / -1;
  }
}

.mt-footer__col > * + * {
  margin-top: 1.5rem;
}

.mt-footer__block {
  min-width: 0;
}

/* Tiêu đề cột: chấm vàng + chữ hoa giãn + vạch mờ kéo hết cột */
.mt-footer__title {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin: 0 0 1.1rem;
  color: var(--mt-text-on-dark);
  font-size: var(--mt-fs-sm);
  font-weight: 800;
  letter-spacing: .09em;
  line-height: 1.3;
  text-transform: uppercase;
}

.mt-footer__title::before {
  content: "";
  flex: none;
  width: .6rem;
  height: .6rem;
  border-radius: 50%;
  background: var(--mt-gold);
  box-shadow: 0 0 0 4px rgba(250, 210, 51, .22);
}

.mt-footer__title::after {
  content: "";
  flex: 1 1 2rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
}

.mt-footer__body {
  color: var(--mt-text-on-dark-muted);
  font-size: var(--mt-fs-sm);
}

/* Dải dưới cùng: bản quyền + ghi công NukeViet (giữ nguyên nội dung) -------------------------------- */

.mt-footer__bottom {
  position: relative;
  z-index: 1;
  border-top: 1px solid rgba(255, 255, 255, .12);
  background: rgba(3, 14, 45, .4);
  color: var(--mt-text-on-dark-muted);
  font-size: var(--mt-fs-xs);
}

.mt-footer__bottom-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .25rem 1.5rem;
  padding-block: .95rem;
}

.mt-footer__bottom p {
  margin: 0;
}

.mt-footer__copy-name {
  display: inline-block;
  color: var(--mt-text-on-dark);
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
}

/* Liên kết ghi công: không gạch chân; phân biệt với chữ thường bằng ĐỘ ĐẬM + màu trắng (không chỉ dựa vào màu), rê chuột/focus chuyển vàng */
.mt-footer__credit a,
.mt-footer__credit a:hover,
.mt-footer__credit a:focus {
  font-weight: 700;
}

/* Khối thông tin liên hệ (mt_school_info kiểu info): biểu tượng trong vòng tròn + nhãn + giá trị --------- */

.mt-contactlist {
  display: grid;
  gap: .6rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-contactlist li {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  margin: 0;
}

.mt-contactlist .mt-icon {
  margin-top: .2rem;
  color: var(--mt-gold);
}

.mt-contactlist--rich {
  gap: .9rem;
}

.mt-contactlist--rich li {
  align-items: center;
  gap: .9rem;
}

.mt-contactlist--rich .mt-icon {
  margin-top: 0;
  color: inherit;
}

.mt-contactlist__icon {
  display: grid;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  place-items: center;
  border: 1px solid var(--mt-border);
  border-radius: 50%;
  background: var(--mt-bg-tint);
  color: var(--mt-primary);
  transition: background-color .25s var(--mt-ease), border-color .25s var(--mt-ease), color .25s var(--mt-ease), transform .25s var(--mt-ease);
}

.mt-contactlist__text {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: .1rem;
  line-height: 1.4;
}

.mt-contactlist__label {
  color: var(--mt-text-muted);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.mt-contactlist__value {
  color: var(--mt-text);
  font-size: var(--mt-fs-base);
  font-weight: 600;
  overflow-wrap: anywhere;
  text-decoration: none;
}

.mt-footer .mt-contactlist__icon {
  border-color: rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .08);
  color: var(--mt-gold);
}

.mt-footer .mt-contactlist__label {
  color: var(--mt-text-on-dark-muted);
}

.mt-footer .mt-contactlist__value {
  color: var(--mt-text-on-dark);
}

.mt-footer a.mt-contactlist__value:hover,
.mt-footer a.mt-contactlist__value:focus {
  color: var(--mt-gold);
}

.mt-footer .mt-contactlist--rich li:hover .mt-contactlist__icon,
.mt-footer .mt-contactlist--rich li:focus-within .mt-contactlist__icon {
  border-color: var(--mt-gold);
  background: var(--mt-gold);
  color: var(--mt-on-accent);
  transform: scale(1.06);
}

/* Thẻ điểm trường (mt_school_info kiểu campuses): biểu tượng, tên, địa chỉ; nổi lên khi rê chuột/focus ------- */

.mt-campuslist {
  display: grid;
  gap: .7rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-campuslist__item {
  position: relative;
  display: flex;
  align-items: center;
  gap: .9rem;
  margin: 0;
  padding: .75rem 1rem;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-card);
  transition: transform .25s var(--mt-ease), background-color .25s var(--mt-ease), border-color .25s var(--mt-ease), box-shadow .25s var(--mt-ease);
}

.mt-campuslist__icon {
  display: grid;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(140deg, var(--mt-gold) 0%, var(--mt-amber) 100%);
  color: var(--mt-on-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55);
  transition: transform .25s var(--mt-ease);
}

.mt-campuslist__text {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: .1rem;
  line-height: 1.4;
}

.mt-campuslist__name {
  display: block;
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-base);
  font-weight: 700;
  line-height: 1.35;
}

.mt-campuslist__name a,
.mt-campuslist__name a:hover,
.mt-campuslist__name a:focus {
  color: inherit;
  text-decoration: none;
}

/* cả thẻ bấm được */
.mt-campuslist__name a::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
}

.mt-campuslist__addr {
  display: block;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
}

.mt-campuslist__arrow {
  flex: none;
  color: var(--mt-text-muted);
  transition: transform .25s var(--mt-ease), color .25s var(--mt-ease);
}

.mt-campuslist__item:hover,
.mt-campuslist__item:focus-within {
  border-color: var(--mt-primary);
  box-shadow: var(--mt-shadow-2);
  transform: translateY(-3px);
}

.mt-campuslist__item:hover .mt-campuslist__arrow,
.mt-campuslist__item:focus-within .mt-campuslist__arrow {
  color: var(--mt-primary);
  transform: translateX(4px);
}

.mt-campuslist__item:hover .mt-campuslist__icon,
.mt-campuslist__item:focus-within .mt-campuslist__icon {
  transform: rotate(-6deg) scale(1.05);
}

.mt-footer .mt-campuslist__item {
  border-color: rgba(255, 255, 255, .15);
  background: rgba(255, 255, 255, .065);
}

.mt-footer .mt-campuslist__name,
.mt-footer .mt-campuslist__name a,
.mt-footer .mt-campuslist__name a:hover,
.mt-footer .mt-campuslist__name a:focus {
  color: var(--mt-text-on-dark);
}

.mt-footer .mt-campuslist__addr {
  color: var(--mt-text-on-dark-muted);
}

.mt-footer .mt-campuslist__arrow {
  color: rgba(255, 255, 255, .6);
}

.mt-footer .mt-campuslist__item:hover,
.mt-footer .mt-campuslist__item:focus-within {
  border-color: rgba(250, 210, 51, .7);
  background: rgba(255, 255, 255, .13);
  box-shadow: 0 16px 30px -18px rgba(0, 0, 0, .65);
}

.mt-footer .mt-campuslist__item:hover .mt-campuslist__name a,
.mt-footer .mt-campuslist__item:focus-within .mt-campuslist__name a,
.mt-footer .mt-campuslist__item:hover .mt-campuslist__arrow,
.mt-footer .mt-campuslist__item:focus-within .mt-campuslist__arrow {
  color: var(--mt-gold);
}

/* Liên kết chân trang (mt_footer_nav): mũi tên dịch nhẹ, nền sáng lên; không gạch chân ---------------------- */

.mt-footnav {
  display: grid;
  gap: .15rem 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 30em) {
  .mt-footnav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 56em) {
  .mt-footnav {
    grid-template-columns: minmax(0, 1fr);
  }
}

.mt-footnav a,
.mt-footnav a:hover,
.mt-footnav a:focus {
  display: flex;
  min-height: 2.5rem;
  align-items: center;
  gap: .5rem;
  margin-left: -.6rem;
  padding: .35rem .6rem;
  border-radius: 10px;
  font-size: var(--mt-fs-base);
  font-weight: 600;
  line-height: 1.3;
  text-decoration: none;
  transition: background-color .2s var(--mt-ease), color .2s var(--mt-ease);
}

.mt-footnav__arrow {
  flex: none;
  color: var(--mt-accent-text);
  transition: transform .2s var(--mt-ease);
}

.mt-footer .mt-footnav__arrow {
  color: var(--mt-gold);
}

.mt-footnav a:hover,
.mt-footnav a:focus {
  background: var(--mt-bg-tint);
}

.mt-footer .mt-footnav a:hover,
.mt-footer .mt-footnav a:focus {
  background: rgba(255, 255, 255, .1);
}

.mt-footnav a:hover .mt-footnav__arrow,
.mt-footnav a:focus .mt-footnav__arrow {
  transform: translateX(4px);
}

/* Hiệu ứng xuất hiện khi cuộn tới (js/mt.js gắn .is-revealed bằng IntersectionObserver). Chỉ khi có JS (html.mt-js) VÀ người dùng không chọn
   giảm chuyển động; không JS/giảm chuyển động ⇒ nội dung hiện sẵn, không có trạng thái ẩn. ------------------------------------------------ */

@media (prefers-reduced-motion: no-preference) {
  .mt-js [data-mt-reveal] {
    opacity: 0;
    transform: translateY(1.1rem);
    transition: opacity .7s var(--mt-ease), transform .7s var(--mt-ease);
  }

  .mt-js [data-mt-reveal].is-revealed {
    opacity: 1;
    transform: none;
  }

  .mt-js .mt-footer__col--campus[data-mt-reveal] {
    transition-delay: .12s;
  }

  .mt-js .mt-footer__col--nav[data-mt-reveal] {
    transition-delay: .24s;
  }
}

/* Về đầu trang -------------------------------------------------------------------- */

.mt-totop,
.mt-totop:hover,
.mt-totop:focus {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 90;
  display: grid;
  width: 3rem;
  height: 3rem;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: linear-gradient(180deg, var(--mt-gold) 0%, var(--mt-amber) 100%);
  color: var(--mt-on-accent);
  box-shadow: 0 12px 26px -10px rgba(8, 45, 127, .65), 0 0 0 4px rgba(250, 210, 51, .25);
  text-decoration: none;
  transition: transform .25s var(--mt-ease), box-shadow .25s var(--mt-ease);
}

.mt-totop:hover,
.mt-totop:focus {
  box-shadow: 0 18px 30px -10px rgba(8, 45, 127, .7), 0 0 0 7px rgba(250, 210, 51, .3);
  transform: translateY(-3px);
}

.mt-totop .mt-icon {
  transition: transform .25s var(--mt-ease);
}

.mt-totop:hover .mt-icon,
.mt-totop:focus .mt-icon {
  transform: translateY(-2px);
}

@media (prefers-reduced-motion: no-preference) {
  .mt-totop:not([hidden]) {
    animation: mt-totop-in .35s var(--mt-ease) both;
  }
}

@keyframes mt-totop-in {
  from {
    opacity: 0;
    transform: translateY(.75rem) scale(.9);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

/* Thông báo cookie (chỉ khi cấu hình hệ thống bật) -------------------------------------- */

.mt-cookie {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 300;
  border-top: 4px solid var(--mt-gold);
  background: #fff;
  color: var(--mt-text);
  box-shadow: 0 -10px 30px -12px rgba(8, 45, 127, .35);
}

.mt-cookie__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem 1.5rem;
  padding-block: .9rem;
}

.mt-cookie__text {
  flex: 1 1 24rem;
  margin: 0;
  font-size: var(--mt-fs-sm);
}

/* Nhắc phiên đăng nhập sắp hết (lõi bật/tắt bằng JS) */
.mt-timeout {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 400;
  display: none;
  padding: .6rem 1rem;
  background: var(--mt-accent);
  color: var(--mt-on-accent);
  text-align: center;
  font-weight: 600;
}

.mt-timeout a {
  color: var(--mt-on-accent);
}

/* Bảng điều khiển nhanh cho quản trị viên đang đăng nhập ------------------------------------- */

.mt-admintool {
  position: fixed;
  top: 12rem;
  left: 0;
  z-index: 250;
  border-radius: 0 var(--mt-radius-sm) var(--mt-radius-sm) 0;
  background: var(--mt-primary-strong);
  box-shadow: var(--mt-shadow-2);
  opacity: .55;
}

.mt-admintool:hover,
.mt-admintool:focus-within {
  opacity: 1;
}

.mt-admintool ul {
  margin: 0;
  padding: .25rem 0;
  list-style: none;
}

.mt-admintool a,
.mt-admintool button {
  display: flex;
  align-items: center;
  gap: .6rem;
  width: 100%;
  min-height: 2.5rem;
  padding: 0 .75rem;
  border: 0;
  background: transparent;
  color: var(--mt-text-on-dark);
  font: 600 var(--mt-fs-xs) / 1.2 var(--mt-font);
  text-decoration: none;
  cursor: pointer;
}

.mt-admintool a:hover,
.mt-admintool a:focus,
.mt-admintool button:hover,
.mt-admintool button:focus {
  background: rgba(255, 255, 255, .14);
  color: var(--mt-text-on-dark);
}

/* Nhãn chữ luôn có trong cây truy cập (chỉ ẩn bằng cắt), hiện ra khi rê chuột/focus */
.mt-admintool span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.mt-admintool:hover span,
.mt-admintool:focus-within span {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
}

@media (max-width: 59.99em) {
  .mt-admintool {
    top: auto;
    bottom: 5rem;
  }
}

/* ===== 50-components.css ===== */
/* 50-components.css — TOÀN BỘ thành phần mt-* của hệ thiết kế (docs/architecture.md mục 8.3; ví dụ HTML: docs/theme/contract.md).
   Quy ước: BEM (khối__phần--biến thể). Liên kết dạng thành phần luôn khai báo cả :hover/:focus để không bị CSS của module/Bootstrap (chế độ tương thích) đè. */

:root {
  --mt-bg-success: #e8f4e0;
  --mt-bg-error: #feece3;
  --mt-line: #cfe7f2;
}

/* Panel (khung block ở cột phụ) ------------------------------------------------------ */

.mt-panel {
  overflow: hidden;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-card);
  box-shadow: var(--mt-shadow-1);
}

.mt-panel__title {
  margin: 0;
  padding: .8rem 1.15rem;
  border-bottom: 3px solid var(--mt-gold);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-lg);
}

.mt-panel__body {
  padding: 1rem 1.15rem;
}

.mt-panel--accent .mt-panel__title {
  background: var(--mt-primary-strong);
  color: var(--mt-text-on-dark);
}

.mt-panel--plain {
  box-shadow: none;
}

.mt-panel__more {
  margin: .75rem 0 0;
  text-align: right;
}

.mt-blockbox__title {
  position: relative;
  margin: 0 0 .85rem;
  padding-left: .85rem;
  font-size: var(--mt-fs-lg);
}

.mt-blockbox__title::before {
  content: "";
  position: absolute;
  top: .15em;
  bottom: .15em;
  left: 0;
  width: 5px;
  border-radius: 5px;
  background: var(--mt-gold);
}

/* Thẻ ------------------------------------------------------------------------------------ */

.mt-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-card);
  box-shadow: var(--mt-shadow-1);
  transition: box-shadow .2s var(--mt-ease), border-color .2s var(--mt-ease);
}

.mt-card:hover {
  border-color: #a9bbd2;
  box-shadow: var(--mt-shadow-2);
}

.mt-card:has(a:focus-visible) {
  outline: 3px solid var(--mt-focus);
  outline-offset: 2px;
}

.mt-card__media {
  position: relative;
  display: block;
  flex: none;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--mt-bg-tint);
}

.mt-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s var(--mt-ease);
}

@media (prefers-reduced-motion: no-preference) {
  .mt-card:hover .mt-card__media img {
    transform: scale(1.045);
  }
}

/* Ảnh nguồn NHỎ hơn ô ảnh (OWN-20; lib/functions.php › mt_img_pick đặt 'fit'): KHÔNG kéo giãn cho mờ — ảnh hiển thị ở cỡ thật (object-fit: scale-down,
   chỉ thu nhỏ khi ô hẹp hơn ảnh) ở giữa ô, phía sau là chính ảnh đó phóng mờ làm nền (bản nền mang data-mt-decor, aria-hidden; cùng tệp nên không tải thêm). */
.mt-card__media--fit {
  background: var(--mt-bg-tint);
}

.mt-card__media img.mt-card__backdrop {
  position: absolute;
  top: -12%;
  left: -12%;
  width: 124%;
  max-width: none;
  height: 124%;
  object-fit: cover;
  opacity: .55;
  filter: blur(16px) saturate(1.15);
}

.mt-card__media img.mt-card__img--fit {
  position: absolute;
  inset: 0;
  width: auto;
  max-width: calc(100% - 1rem);
  height: auto;
  max-height: calc(100% - 1rem);
  margin: auto;
  border-radius: var(--mt-radius-sm);
  object-fit: scale-down;
  box-shadow: 0 8px 20px -10px rgba(8, 45, 127, .55);
}

/* Khi tin chưa có ảnh: nền xanh với vành đồng tâm (gợi huy hiệu), không dùng ảnh giả */
.mt-card__placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(140deg, var(--mt-primary-strong) 0%, var(--mt-primary) 100%);
  color: rgba(255, 255, 255, .55);
}

.mt-card__placeholder::before,
.mt-card__placeholder::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.mt-card__placeholder::before {
  right: -22%;
  bottom: -55%;
  width: 78%;
  aspect-ratio: 1;
  border: 14px solid rgba(255, 255, 255, .07);
}

.mt-card__placeholder::after {
  right: 2%;
  bottom: -26%;
  width: 40%;
  aspect-ratio: 1;
  border: 8px solid rgba(250, 210, 51, .22);
}

.mt-card__body {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
  gap: .5rem;
  padding: 1rem 1.15rem 1.15rem;
}

.mt-card__meta {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .6rem;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
}

.mt-card__title {
  margin: 0;
  font-size: var(--mt-fs-lg);
  line-height: 1.35;
}

.mt-card__title a,
.mt-card__title a:hover,
.mt-card__title a:focus {
  color: var(--mt-primary-strong);
  text-decoration: none;
}

.mt-card__title a:hover,
.mt-card__title a:focus {
  color: var(--mt-link);
  text-decoration: none;
}

/* Cả thẻ bấm được (vùng chạm lớn cho cảm ứng) */
.mt-card__title a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

.mt-card__excerpt {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: var(--mt-text);
  font-size: var(--mt-fs-sm);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.mt-card--horizontal {
  flex-direction: row;
}

.mt-card--horizontal .mt-card__media {
  flex: 0 0 clamp(5.5rem, 34%, 10rem);
  aspect-ratio: 4 / 3;
  align-self: stretch;
  height: auto;
}

.mt-card--horizontal .mt-card__body {
  padding: .8rem 1rem;
  gap: .3rem;
}

.mt-card--horizontal .mt-card__title {
  font-size: var(--mt-fs-base);
}

.mt-card--featured .mt-card__media {
  aspect-ratio: 16 / 9;
}

.mt-card--featured .mt-card__title {
  font-size: var(--mt-fs-2xl);
  line-height: 1.25;
}

.mt-card--featured .mt-card__excerpt {
  font-size: var(--mt-fs-base);
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

/* Thẻ chữ chồng ảnh (tin nổi bật) — nền phủ navy đậm để chữ trắng luôn đọc được */
.mt-card--overlay {
  min-height: 15rem;
  justify-content: flex-end;
  border-color: transparent;
  background: var(--mt-primary-strong);
  color: var(--mt-text-on-dark);
}

.mt-card--overlay .mt-card__media {
  position: absolute;
  inset: 0;
  aspect-ratio: auto;
}

.mt-card--overlay .mt-card__body {
  position: relative;
  padding-top: 4.5rem;
  background: linear-gradient(to top, rgba(6, 22, 66, .96) 0%, rgba(6, 22, 66, .82) 52%, rgba(6, 22, 66, 0) 100%);
  pointer-events: none;
}

.mt-card--overlay .mt-card__body a {
  pointer-events: auto;
}

.mt-card--overlay .mt-card__meta,
.mt-card--overlay .mt-meta,
.mt-card--overlay .mt-card__excerpt {
  color: var(--mt-text-on-dark);
}

.mt-card--overlay .mt-card__title a,
.mt-card--overlay .mt-card__title a:hover,
.mt-card--overlay .mt-card__title a:focus {
  color: var(--mt-text-on-dark);
}

/* Danh sách --------------------------------------------------------------------------------- */

.mt-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-list__item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: .85rem;
  margin: 0;
  padding: .8rem 0;
  border-bottom: 1px solid var(--mt-border);
}

.mt-list__item:first-child {
  padding-top: 0;
}

.mt-list__item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.mt-list__main {
  min-width: 0;
  flex: 1 1 auto;
}

.mt-list__title {
  display: block;
  color: var(--mt-primary-strong);
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
}

.mt-list__title:hover,
.mt-list__title:focus {
  color: var(--mt-link);
  text-decoration: none;
}

.mt-list__desc {
  display: block;
  margin-top: .15rem;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
}

/* Ô ngày (tháng/năm) */
.mt-datechip {
  display: flex;
  flex: none;
  width: 3.4rem;
  flex-direction: column;
  align-items: center;
  padding: .3rem .25rem .35rem;
  border-top: 3px solid var(--mt-gold);
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
  line-height: 1.1;
  text-align: center;
}

.mt-datechip__day {
  font-size: 1.35rem;
  font-weight: 800;
}

.mt-datechip__month {
  color: var(--mt-text);
  font-size: .75rem;
  font-weight: 600;
}

/* Meta, thẻ gắn, huy hiệu, chip ----------------------------------------------------------- */

.mt-meta {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
}

.mt-tag {
  display: inline-flex;
  align-items: center;
  padding: .15rem .7rem;
  border: 1px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-pill);
  background: #fff;
  color: var(--mt-text);
  font-size: var(--mt-fs-xs);
  font-weight: 600;
  text-decoration: none;
}

.mt-tag:hover,
.mt-tag:focus {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-badge {
  display: inline-flex;
  align-items: center;
  gap: .4em;
  padding: .1rem .65rem;
  border: 1px solid transparent;
  border-radius: var(--mt-radius-pill);
  background: var(--mt-bg-chip);
  color: var(--mt-primary-strong);
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
  text-decoration: none;
}

/* Huy hiệu điểm trường: luôn có chữ, thêm hình khác nhau (tròn / thoi / vuông / vành) để không chỉ dựa vào màu */
.mt-badge--campus-main,
.mt-badge--campus-noong-bua,
.mt-badge--campus-thanh-xuong,
.mt-badge--campus-school {
  position: relative;
}

.mt-badge--campus-main::before,
.mt-badge--campus-noong-bua::before,
.mt-badge--campus-thanh-xuong::before,
.mt-badge--campus-school::before {
  content: "";
  flex: none;
  width: .55em;
  height: .55em;
}

.mt-badge--campus-main {
  background: var(--mt-bg-dark);
  color: var(--mt-text-on-dark);
}

.mt-badge--campus-main::before {
  border-radius: 50%;
  background: var(--mt-gold);
}

.mt-badge--campus-noong-bua {
  background: var(--mt-accent);
  color: var(--mt-on-accent);
}

.mt-badge--campus-noong-bua::before {
  background: var(--mt-on-accent);
  transform: rotate(45deg);
}

.mt-badge--campus-thanh-xuong {
  background: var(--mt-bg-chip);
  color: var(--mt-primary-strong);
}

.mt-badge--campus-thanh-xuong::before {
  border-radius: 1px;
  background: var(--mt-primary-strong);
}

.mt-badge--campus-school {
  border-color: var(--mt-border-strong);
  background: #fff;
  color: var(--mt-text);
}

.mt-badge--campus-school::before {
  border: 2px solid var(--mt-primary);
  border-radius: 50%;
}

.mt-badge--status-active,
.mt-badge--status-published {
  background: var(--mt-success);
  color: var(--mt-on-success);
}

.mt-badge--status-expired,
.mt-badge--status-archived {
  background: #e3e9f1;
  color: var(--mt-text);
}

.mt-badge--status-pending,
.mt-badge--status-draft {
  border-color: var(--mt-orange);
  background: var(--mt-bg-notice);
  color: var(--mt-text);
}

.mt-badge--status-hidden,
.mt-badge--status-rejected {
  background: var(--mt-bg-error);
  color: var(--mt-text);
  border-color: var(--mt-flame);
}

.mt-badge--new {
  background: var(--mt-accent);
  color: var(--mt-on-accent);
}

.mt-badge--pinned {
  background: var(--mt-warning);
  color: var(--mt-on-warning);
}

.mt-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: 0 0 1.25rem;
  padding: 0;
  list-style: none;
}

.mt-chip {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 2.25rem;
  padding: 0 1rem;
  border: 1px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-pill);
  background: #fff;
  color: var(--mt-text);
  font: 600 var(--mt-fs-sm) / 1.2 var(--mt-font);
  text-decoration: none;
  cursor: pointer;
}

.mt-chip:hover,
.mt-chip:focus {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-chip.is-active,
.mt-chip.is-active:hover,
.mt-chip.is-active:focus {
  border-color: var(--mt-primary);
  background: var(--mt-primary);
  color: var(--mt-on-primary);
}

/* Bộ lọc ------------------------------------------------------------------------------------ */

.mt-filter {
  margin: 0 0 1.5rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--mt-line);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-tint);
}

.mt-filter__row {
  display: grid;
  align-items: end;
  gap: .85rem 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12.5rem), 1fr));
}

.mt-filter__row + .mt-filter__row {
  margin-top: .85rem;
}

.mt-filter__field {
  min-width: 0;
}

.mt-filter__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

/* Nút ------------------------------------------------------------------------------------------ */

.mt-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 2.75rem;
  padding: .5rem 1.3rem;
  border: 2px solid transparent;
  border-radius: var(--mt-radius-pill);
  font: 700 var(--mt-fs-sm) / 1.2 var(--mt-font);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s, color .15s, border-color .15s, box-shadow .15s;
  -webkit-appearance: none;
  appearance: none;
}

.mt-btn--primary,
.mt-btn--primary:visited {
  border-color: var(--mt-primary);
  background: var(--mt-primary);
  color: var(--mt-on-primary);
}

.mt-btn--primary:hover,
.mt-btn--primary:focus {
  border-color: var(--mt-primary-strong);
  background: var(--mt-primary-strong);
  color: var(--mt-on-primary);
  text-decoration: none;
}

.mt-btn--secondary,
.mt-btn--secondary:visited {
  border-color: var(--mt-primary);
  background: #fff;
  color: var(--mt-primary);
}

.mt-btn--secondary:hover,
.mt-btn--secondary:focus {
  border-color: var(--mt-primary-strong);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
  text-decoration: none;
}

.mt-btn--ghost,
.mt-btn--ghost:visited {
  border-color: transparent;
  background: transparent;
  color: var(--mt-link);
}

.mt-btn--ghost:hover,
.mt-btn--ghost:focus {
  background: var(--mt-bg-tint);
  color: var(--mt-link-hover);
  text-decoration: none;
}

.mt-btn--accent,
.mt-btn--accent:visited {
  border-color: var(--mt-accent);
  background: var(--mt-accent);
  color: var(--mt-on-accent);
}

.mt-btn--accent:hover,
.mt-btn--accent:focus {
  border-color: var(--mt-accent-hover);
  background: var(--mt-accent-hover);
  color: var(--mt-on-accent);
  text-decoration: none;
}

.mt-btn--sm {
  min-height: 2.25rem;
  padding: .25rem .95rem;
  font-size: var(--mt-fs-xs);
}

.mt-btn--lg {
  min-height: 3.25rem;
  padding: .6rem 1.8rem;
  font-size: var(--mt-fs-base);
}

.mt-btn[disabled],
.mt-btn.is-disabled {
  opacity: .55;
  cursor: not-allowed;
  pointer-events: none;
}

/* Biểu mẫu --------------------------------------------------------------------------------------- */

.mt-form__group {
  margin: 0 0 1.1rem;
}

.mt-label {
  display: block;
  margin: 0 0 .35rem;
  color: var(--mt-text);
  font-size: var(--mt-fs-sm);
  font-weight: 600;
}

.mt-label--required::after {
  content: " *";
  color: var(--mt-alert-text);
}

.mt-input,
.mt-select,
.mt-textarea {
  display: block;
  width: 100%;
  min-height: 2.75rem;
  padding: .55rem .9rem;
  border: 2px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-sm);
  background: #fff;
  color: var(--mt-text);
  font: 400 var(--mt-fs-base) / 1.4 var(--mt-font);
  -webkit-appearance: none;
  appearance: none;
}

.mt-textarea {
  min-height: 8rem;
  resize: vertical;
}

.mt-select {
  padding-right: 2.5rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E2C58' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 1.1rem;
}

.mt-input::placeholder,
.mt-textarea::placeholder {
  color: var(--mt-text-muted);
  opacity: 1;
}

.mt-input:focus,
.mt-select:focus,
.mt-textarea:focus {
  border-color: var(--mt-primary);
}

.mt-input[aria-invalid="true"],
.mt-select[aria-invalid="true"],
.mt-textarea[aria-invalid="true"],
.has-error .mt-input,
.has-error .mt-select,
.has-error .mt-textarea {
  border-color: var(--mt-alert-text);
}

.mt-input[disabled],
.mt-select[disabled],
.mt-textarea[disabled] {
  background: #eef2f6;
  color: var(--mt-text-muted);
}

.mt-help {
  margin: .3rem 0 0;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
}

.mt-form__error {
  margin: .35rem 0 0;
  color: var(--mt-alert-text);
  font-size: var(--mt-fs-sm);
  font-weight: 600;
}

.mt-check {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
}

.mt-check input {
  width: 1.2rem;
  height: 1.2rem;
  margin-top: .2rem;
  accent-color: var(--mt-primary);
}

/* Phân trang (do lõi dựng: ul.mt-pagination > li.mt-pagination__item[.active|.disabled] > a.mt-pagination__link) ------------ */

.mt-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .4rem;
  margin: 1.75rem 0 0;
  padding: 0;
  list-style: none;
}

.mt-pagination__item {
  margin: 0;
}

.mt-pagination__link,
.mt-pagination__item > span {
  display: inline-flex;
  min-width: 2.6rem;
  height: 2.6rem;
  align-items: center;
  justify-content: center;
  padding: 0 .75rem;
  border: 1px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-sm);
  background: #fff;
  color: var(--mt-link);
  font-weight: 700;
  text-decoration: none;
}

.mt-pagination__link:hover,
.mt-pagination__link:focus {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-link-hover);
  text-decoration: none;
}

.mt-pagination__item.active .mt-pagination__link,
.mt-pagination__item.active .mt-pagination__link:hover,
.mt-pagination__item.active .mt-pagination__link:focus {
  border-color: var(--mt-primary);
  background: var(--mt-primary);
  color: var(--mt-on-primary);
}

.mt-pagination__item.disabled .mt-pagination__link,
.mt-pagination__item.disabled > span {
  border-color: var(--mt-border);
  background: transparent;
  color: var(--mt-text-muted);
  pointer-events: none;
}

/* Tab --------------------------------------------------------------------------------------------- */

.mt-tabs__list {
  display: none;
  flex-wrap: wrap;
  gap: .25rem .5rem;
  margin: 0 0 1.25rem;
  padding: 0 0 .75rem;
  border-bottom: 2px solid var(--mt-border);
}

.mt-js .mt-tabs__list {
  display: flex;
}

.mt-tabs__tab {
  min-height: 2.5rem;
  padding: 0 1.1rem;
  border: 1px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-pill);
  background: #fff;
  color: var(--mt-text);
  font: 700 var(--mt-fs-sm) / 1.2 var(--mt-font);
  cursor: pointer;
}

.mt-tabs__tab:hover,
.mt-tabs__tab:focus {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-tabs__tab[aria-selected="true"],
.mt-tabs__tab[aria-selected="true"]:hover,
.mt-tabs__tab[aria-selected="true"]:focus {
  border-color: var(--mt-primary);
  background: var(--mt-primary);
  color: var(--mt-on-primary);
}

.mt-tabs__panel + .mt-tabs__panel {
  margin-top: 2rem;
}

.mt-js .mt-tabs__panel + .mt-tabs__panel {
  margin-top: 0;
}

.mt-tabs__heading {
  margin: 0 0 .75rem;
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-lg);
  font-weight: 700;
}

.mt-js .mt-tabs__heading {
  display: none;
}

.mt-tabs__panel:focus {
  outline: 0;
}

/* Phản hồi: cảnh báo, rỗng, đang tải --------------------------------------------------------------------- */

.mt-alert {
  position: relative;
  margin: 0 0 1.25rem;
  padding: .95rem 1.15rem .95rem 3.4rem;
  border: 1px solid var(--mt-info);
  border-left-width: 6px;
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-tint);
  color: var(--mt-text);
}

.mt-alert::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 1.05rem;
  width: 1.5rem;
  height: 1.5rem;
  background: var(--mt-info-text);
  -webkit-mask: var(--mt-alert-icon, none) center / contain no-repeat;
  mask: var(--mt-alert-icon, none) center / contain no-repeat;
}

.mt-alert--info {
  --mt-alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v6M12 7.5v.01'/%3E%3C/svg%3E");
}

.mt-alert--success {
  --mt-alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.5l3 3 5-6'/%3E%3C/svg%3E");
  border-color: var(--mt-success);
  background: var(--mt-bg-success);
}

.mt-alert--success::before {
  background: var(--mt-success-text);
}

.mt-alert--warning {
  --mt-alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4l9 16H3z'/%3E%3Cpath d='M12 10v4.5M12 17.5v.01'/%3E%3C/svg%3E");
  border-color: var(--mt-orange);
  background: var(--mt-bg-notice);
}

.mt-alert--warning::before {
  background: var(--mt-warning-text);
}

.mt-alert--error {
  --mt-alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 9l6 6M15 9l-6 6'/%3E%3C/svg%3E");
  border-color: var(--mt-flame);
  background: var(--mt-bg-error);
}

.mt-alert--error::before {
  background: var(--mt-alert-text);
}

.mt-alert__title {
  margin: 0 0 .25rem;
  font-size: var(--mt-fs-base);
  font-weight: 700;
  line-height: 1.35;
}

.mt-alert__body > :last-child,
.mt-alert > :last-child {
  margin-bottom: 0;
}

.mt-alert__actions {
  margin: .75rem 0 0;
}

.mt-alert--page {
  max-width: 40rem;
  margin: 2rem auto;
  text-align: left;
}

.mt-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  padding: 1.75rem 1.25rem;
  border: 2px dashed #b3c6dc;
  border-radius: var(--mt-radius);
  background: rgba(255, 255, 255, .65);
  color: var(--mt-text);
  text-align: center;
}

.mt-empty__icon {
  display: grid;
  width: 3.5rem;
  height: 3.5rem;
  place-items: center;
  margin-bottom: .25rem;
  border-radius: 50%;
  background: var(--mt-bg-tint);
  color: var(--mt-primary);
}

.mt-empty__title {
  margin: 0;
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-lg);
  font-weight: 700;
}

.mt-empty__text {
  max-width: 34rem;
  margin: 0;
  color: var(--mt-text);
  font-size: var(--mt-fs-sm);
}

.mt-empty__action {
  margin: .6rem 0 0;
}

.mt-loading {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin: 0;
}

.mt-loading__dot {
  width: .6rem;
  height: .6rem;
  border-radius: 50%;
  background: var(--mt-primary);
  animation: mt-dot 1s ease-in-out infinite;
}

.mt-loading__dot:nth-child(2) {
  animation-delay: .15s;
  background: var(--mt-gold);
}

.mt-loading__dot:nth-child(3) {
  animation-delay: .3s;
  background: var(--mt-orange);
}

@keyframes mt-dot {
  0%,
  80%,
  100% {
    opacity: .35;
    transform: scale(.75);
  }

  40% {
    opacity: 1;
    transform: scale(1);
  }
}

/* Dữ liệu: bảng, danh sách thuộc tính, dòng tệp ----------------------------------------------------------- */

.mt-table-wrap {
  max-width: 100%;
  margin: 0 0 1.25rem;
  overflow-x: auto;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius-sm);
  background: #fff;
  -webkit-overflow-scrolling: touch;
}

.mt-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--mt-text);
  font-size: var(--mt-fs-sm);
}

.mt-table caption {
  padding: .75rem .9rem;
  color: var(--mt-primary-strong);
  font-weight: 700;
  text-align: left;
}

.mt-table th,
.mt-table td {
  padding: .7rem .9rem;
  border-bottom: 1px solid var(--mt-border);
  text-align: left;
  vertical-align: top;
}

.mt-table th {
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
  font-weight: 700;
  white-space: nowrap;
}

.mt-table tbody tr:nth-child(even) {
  background: #f7fbfd;
}

.mt-table tbody tr:hover {
  background: #eef7fb;
}

.mt-table tr:last-child td {
  border-bottom: 0;
}

.mt-dl {
  margin: 0 0 1.25rem;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius-sm);
  background: #fff;
}

.mt-dl__row {
  display: grid;
  gap: .1rem 1rem;
  grid-template-columns: minmax(0, 1fr);
  padding: .7rem 1rem;
  border-bottom: 1px solid var(--mt-border);
}

.mt-dl__row:last-child {
  border-bottom: 0;
}

.mt-dl dt {
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-sm);
  font-weight: 600;
}

.mt-dl dd {
  margin: 0;
  min-width: 0;
}

@media (min-width: 40em) {
  .mt-dl__row {
    grid-template-columns: 12rem minmax(0, 1fr);
  }
}

.mt-file {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem 1rem;
  padding: .85rem 1rem;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius-sm);
  background: #fff;
}

.mt-file + .mt-file {
  margin-top: .6rem;
}

.mt-file__icon {
  display: grid;
  flex: none;
  width: 2.9rem;
  height: 3.2rem;
  place-items: center;
  border-radius: 6px;
  background: var(--mt-bg-chip);
  color: var(--mt-primary-strong);
  font-size: .6875rem;
  font-weight: 800;
  letter-spacing: .02em;
}

.mt-file__icon--pdf {
  background: var(--mt-bg-error);
  box-shadow: inset 0 -3px 0 var(--mt-flame);
}

.mt-file__icon--doc {
  background: var(--mt-bg-chip);
  box-shadow: inset 0 -3px 0 var(--mt-azure);
}

.mt-file__icon--xls {
  background: var(--mt-bg-success);
  box-shadow: inset 0 -3px 0 var(--mt-green);
}

.mt-file__icon--ppt {
  background: var(--mt-bg-notice);
  box-shadow: inset 0 -3px 0 var(--mt-orange);
}

.mt-file__main {
  display: flex;
  min-width: 0;
  flex: 1 1 14rem;
  flex-direction: column;
  gap: .1rem;
}

.mt-file__name {
  color: var(--mt-primary-strong);
  font-weight: 700;
  overflow-wrap: anywhere;
  text-decoration: none;
}

.mt-file__name:hover,
.mt-file__name:focus {
  color: var(--mt-link);
  text-decoration: underline;
}

.mt-file__meta {
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
}

.mt-file__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

/* Phương tiện: lưới ảnh, lightbox, video, figure ------------------------------------------------------------ */

.mt-gallery-grid {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 10rem), 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-gallery-grid__item {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-tint);
}

.mt-gallery-grid__item a {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  cursor: zoom-in;
}

.mt-gallery-grid__item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s var(--mt-ease);
}

@media (prefers-reduced-motion: no-preference) {
  .mt-gallery-grid__item a:hover img {
    transform: scale(1.06);
  }
}

.mt-gallery-grid__caption {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0;
  padding: 1.25rem .65rem .5rem;
  background: linear-gradient(to top, rgba(6, 22, 66, .9), rgba(6, 22, 66, 0));
  color: var(--mt-text-on-dark);
  font-size: var(--mt-fs-xs);
  pointer-events: none;
}

.mt-figure {
  margin: 0 0 1.5rem;
}

.mt-figure img {
  display: block;
  border-radius: var(--mt-radius-sm);
}

.mt-figure figcaption {
  padding: .55rem .1rem 0;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-sm);
}

.mt-video {
  position: relative;
  aspect-ratio: 16 / 9;
  margin: 0 0 1.5rem;
  overflow: hidden;
  border-radius: var(--mt-radius);
  background: var(--mt-primary-strong);
}

.mt-video iframe,
.mt-video video,
.mt-video__el {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.mt-video__play {
  position: absolute;
  inset: 0;
  display: grid;
  width: 100%;
  place-items: center;
  padding: 0;
  border: 0;
  background: linear-gradient(140deg, var(--mt-primary-strong), var(--mt-primary));
  color: #fff;
  cursor: pointer;
}

.mt-video__poster {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mt-video__icon {
  position: relative;
  display: grid;
  width: 4.5rem;
  height: 4.5rem;
  place-items: center;
  border-radius: 50%;
  background: var(--mt-accent);
  color: var(--mt-on-accent);
  box-shadow: 0 6px 24px rgba(0, 0, 0, .35);
  transition: transform .2s var(--mt-ease);
}

.mt-video__play:hover .mt-video__icon,
.mt-video__play:focus .mt-video__icon {
  transform: scale(1.08);
}

.mt-video__label {
  position: absolute;
  right: 1rem;
  bottom: .85rem;
  left: 1rem;
  color: #fff;
  font-weight: 600;
  text-align: left;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .6);
}

/* Lightbox (JS dựng: js/mt.js) */
.mt-lightbox {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 3.5rem 1rem 1rem;
  background: rgba(4, 14, 44, .93);
  color: #fff;
}

.mt-lightbox__figure {
  display: flex;
  max-width: 100%;
  max-height: 100%;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  margin: 0;
}

.mt-lightbox__img {
  max-width: 100%;
  min-height: 0;
  max-height: calc(100vh - 11rem);
  object-fit: contain;
  border-radius: var(--mt-radius-sm);
  background: rgba(255, 255, 255, .06);
}

.mt-lightbox__caption {
  max-width: 52rem;
  margin: 0;
  color: #fff;
  font-size: var(--mt-fs-sm);
  text-align: center;
}

.mt-lightbox__counter {
  position: absolute;
  top: 1rem;
  left: 1rem;
  margin: 0;
  color: var(--mt-text-on-dark-muted);
  font-size: var(--mt-fs-sm);
}

.mt-lightbox__btn {
  position: absolute;
  display: grid;
  width: 3rem;
  height: 3rem;
  place-items: center;
  padding: 0;
  border: 2px solid rgba(255, 255, 255, .6);
  border-radius: 50%;
  background: rgba(6, 22, 66, .7);
  color: #fff;
  cursor: pointer;
}

.mt-lightbox__btn:hover,
.mt-lightbox__btn:focus {
  border-color: var(--mt-gold);
  background: var(--mt-gold);
  color: var(--mt-on-accent);
}

.mt-lightbox__btn:focus-visible {
  outline: 3px solid var(--mt-focus-on-dark);
}

.mt-lightbox__btn--close {
  top: .75rem;
  right: .75rem;
}

.mt-lightbox__btn--prev,
.mt-lightbox__btn--next {
  top: 50%;
  margin-top: -1.5rem;
}

.mt-lightbox__btn--prev {
  left: .75rem;
}

.mt-lightbox__btn--next {
  right: .75rem;
}

html.mt-lightbox-open {
  overflow: hidden;
}

/* Thân bài (nội dung nhập từ website cũ: bảng, ảnh, iframe) ----------------------------------------------------- */

.mt-prose {
  max-width: 100%;
  font-size: var(--mt-fs-lg);
  line-height: 1.75;
  overflow-wrap: break-word;
}

.mt-prose > :first-child {
  margin-top: 0;
}

.mt-prose > :last-child {
  margin-bottom: 0;
}

.mt-prose h2,
.mt-prose h3,
.mt-prose h4 {
  margin-top: 1.75em;
}

.mt-prose h2 {
  font-size: var(--mt-fs-2xl);
}

.mt-prose h3 {
  font-size: var(--mt-fs-xl);
}

.mt-prose img,
.mt-prose video {
  max-width: 100%;
  height: auto;
}

.mt-prose img {
  border-radius: var(--mt-radius-sm);
}

.mt-prose figure {
  max-width: 100%;
  margin: 1.5em 0;
}

.mt-prose figcaption {
  padding-top: .5rem;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-sm);
  text-align: center;
}

.mt-prose iframe {
  max-width: 100%;
}

.mt-prose iframe[src*="youtube"],
.mt-prose iframe[src*="youtu.be"],
.mt-prose iframe[src*="vimeo"] {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
}

.mt-prose table {
  max-width: 100%;
  margin: 0 0 1.25em;
  border-collapse: collapse;
  font-size: var(--mt-fs-base);
}

.mt-prose table th,
.mt-prose table td {
  padding: .55rem .75rem;
  border: 1px solid var(--mt-border-strong);
  vertical-align: top;
}

.mt-prose table th {
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-prose .mt-table-wrap table {
  margin: 0;
}

.mt-prose ul,
.mt-prose ol {
  padding-left: 1.5em;
}

.mt-prose li + li {
  margin-top: .3em;
}

.mt-prose a {
  overflow-wrap: anywhere;
}

/* ===== 55-content.css ===== */
/* 55-content.css — thành phần nội dung dùng chung cho tpl của module lõi và module tùy biến: đầu trang danh sách (mt-listhead),
   bài viết/trang tĩnh (mt-article), tệp đính kèm, chấm sao, nhóm điều khiển biểu mẫu (mt-inputrow, mt-checklist, mt-fieldset, mt-captcha),
   phân trang (mt-pager) và bản in (mt-print). Dùng token --mt-*. */

/* Đầu trang chuyên mục / dòng sự kiện / thẻ ---------------------------------------------------------------- */

.mt-listhead {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 1rem 1.5rem;
  margin: 0 0 1.5rem;
}

.mt-listhead__img {
  flex: 0 0 auto;
  width: min(100%, 13rem);
  height: auto;
  border-radius: var(--mt-radius);
  box-shadow: var(--mt-shadow-1);
}

.mt-listhead__text {
  flex: 1 1 16rem;
  min-width: 0;
}

.mt-listhead__title {
  margin-bottom: 1rem;
  overflow-wrap: anywhere;
}

.mt-listhead__desc {
  margin-top: 1rem;
  color: var(--mt-text);
  font-size: var(--mt-fs-base);
}

/* Trang chi tiết bài viết ------------------------------------------------------------------------------- */

.mt-article {
  max-width: 100%;
}

.mt-article__head {
  margin-bottom: 1.25rem;
}

.mt-article__kicker {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .6rem;
  margin: 0 0 .75rem;
}

.mt-article__kicker:empty {
  display: none;
}

.mt-article__cat {
  display: inline-flex;
  align-items: center;
  padding: .15rem .8rem;
  border-radius: var(--mt-radius-pill);
  background: var(--mt-primary);
  color: var(--mt-on-primary);
  font-size: var(--mt-fs-xs);
  font-weight: 700;
  text-decoration: none;
}

.mt-article__cat:hover,
.mt-article__cat:focus {
  background: var(--mt-primary-strong);
  color: var(--mt-on-primary);
}

.mt-article__title {
  margin-bottom: 1rem;
  font-size: var(--mt-fs-2xl);
  overflow-wrap: anywhere;
}

.mt-article__meta {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem 1.25rem;
  margin: 0;
  color: var(--mt-text-muted);
}

.mt-article__source,
.mt-article__author {
  margin: .6rem 0 0;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-sm);
}

.mt-article__label {
  color: var(--mt-text);
  font-weight: 700;
}

.mt-article__lead {
  margin: 0 0 1.25rem;
  padding: 1rem 1.25rem;
  border-left: 5px solid var(--mt-gold);
  border-radius: 0 var(--mt-radius-sm) var(--mt-radius-sm) 0;
  background: var(--mt-bg-notice);
  color: var(--mt-text);
  font-size: var(--mt-fs-lg);
  font-weight: 600;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.mt-article__figure {
  margin: 0 0 1.5rem;
}

.mt-article__figure a {
  display: block;
}

.mt-article__figure {
  text-align: center;
}

.mt-article__figure img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 34rem;
  margin-inline: auto;
  object-fit: contain;
  border-radius: var(--mt-radius);
}

.mt-article__body {
  margin-bottom: 1.75rem;
}

/* Nội dung cũ nhập từ website khác: ảnh/bảng/khung nhúng không được tràn */
.mt-article__body img[style*="height"],
.mt-article__body img[height] {
  height: auto !important;
}

.mt-article__body img[style*="width"],
.mt-article__body img[width] {
  max-width: 100% !important;
}

.mt-article__body table {
  width: auto !important;
  max-width: 100%;
}

.mt-article__body p,
.mt-article__body li {
  overflow-wrap: anywhere;
}

.mt-article__body iframe:not([src*="youtube"]):not([src*="youtu.be"]):not([src*="vimeo"]) {
  max-width: 100%;
}

.mt-article__body [style*="position:absolute"],
.mt-article__body [style*="position: absolute"] {
  position: static !important;
}

.mt-article__h2 {
  margin: 0 0 .85rem;
  font-size: var(--mt-fs-xl);
}

.mt-article__files {
  margin: 0 0 1.5rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-card);
}

.mt-article__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .5rem;
  margin: 0 0 1.25rem;
}

.mt-article__tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .6rem;
  margin: 0 0 1.5rem;
  padding: .85rem 0;
  border-block: 1px solid var(--mt-border);
}

.mt-article__admin {
  margin: 0 0 1.25rem;
}

.mt-article__related {
  display: grid;
  gap: 2rem;
  margin-top: 2.25rem;
}

@media (min-width: 40em) {
  .mt-article__related {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem 2.5rem;
  }
}

.mt-comments-wrap {
  margin-top: 2.5rem;
}

.mt-filelist .mt-file {
  background: #fff;
}

/* Chấm sao */
.mt-rating {
  margin-top: 2rem;
}

.mt-rating__stars {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin: .5rem 0 0;
  padding: 0;
  border: 0;
}

.mt-rating__star {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 2.5rem;
  padding: .3rem .85rem;
  border: 2px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-pill);
  background: #fff;
  cursor: pointer;
  font-weight: 700;
}

.mt-rating__star:has(input:checked) {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-rating__star:has(input:focus-visible) {
  outline: 3px solid var(--mt-focus);
  outline-offset: 2px;
}

.mt-rating__star input {
  accent-color: var(--mt-primary);
}

.mt-pager {
  margin-top: 1.5rem;
}

.mt-pager .mt-pagination {
  margin-top: 0;
}

/* Biểu mẫu đăng bài / gửi bạn bè ------------------------------------------------------------------------- */

.mt-contentnav {
  margin-bottom: 1.25rem;
}

.mt-inputrow {
  display: flex;
  gap: .5rem;
}

.mt-inputrow .mt-input {
  flex: 1 1 auto;
  min-width: 0;
}

.mt-checklist {
  display: grid;
  gap: .4rem;
  max-height: 11rem;
  overflow: auto;
  padding: .75rem;
  border: 2px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-sm);
  background: #fff;
}

.mt-fieldset {
  min-width: 0;
  margin-inline: 0;
  padding: 0;
  border: 0;
}

.mt-fieldset > legend {
  padding: 0;
}

.mt-captcha {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
}

.mt-captcha__input {
  flex: 0 1 10rem;
  width: 10rem;
}

.mt-captcha__img {
  display: block;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius-xs);
  background: #fff;
}

/* Bản in / bản lưu bài viết (layout simple) -------------------------------------------------------------- */

.mt-print {
  max-width: 48rem;
  margin: 0 auto;
  padding: 1rem;
}

.mt-print__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: .5rem 1.5rem;
  padding-bottom: .75rem;
  border-bottom: 3px solid var(--mt-primary);
}

.mt-print__head p {
  margin: 0;
}

.mt-print__site {
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-lg);
  font-weight: 800;
}

.mt-print__title {
  margin: 1.25rem 0 .5rem;
}

.mt-print__meta {
  margin: 0 0 1rem;
  color: var(--mt-text-muted);
}

.mt-print__actions {
  display: flex;
  gap: .5rem;
}

.mt-print__figure {
  margin-top: 0;
}

.mt-print__source {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem 1.5rem;
  margin-top: 1.25rem;
}

.mt-print__foot {
  margin-top: 1.75rem;
  padding-top: .75rem;
  border-top: 1px solid var(--mt-border);
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-sm);
}

.mt-print__foot p {
  margin: 0 0 .25rem;
}

@media print {
  .mt-noprint,
  .mt-article__tools,
  .mt-article__related,
  .mt-comments-wrap,
  .mt-rating,
  .mt-article__admin {
    display: none !important;
  }

  .mt-article__lead {
    border-left-color: #000;
    background: none;
  }

  .mt-article__figure img {
    max-height: 18rem;
  }

  .mt-print {
    max-width: none;
    padding: 0;
  }
}


/* Trang tĩnh (module page): ảnh nhỏ nổi bên trái khi có phần mở đầu; khối "xem thêm" một cột */
.mt-article__figure--left {
  margin: 0 0 1.25rem;
}

@media (min-width: 40em) {
  .mt-article__figure--left {
    float: left;
    max-width: 40%;
    margin: .25rem 1.5rem 1rem 0;
  }

  .mt-article__figure--left img {
    max-height: 22rem;
  }
}

.mt-article::after {
  content: "";
  display: block;
  clear: both;
}

.mt-article__related--single {
  grid-template-columns: minmax(0, 1fr);
}

.mt-pagelist .mt-card__title {
  font-size: var(--mt-fs-lg);
}

/* Danh sách kết quả tìm kiếm (module seek, tìm kiếm trong news, sitesearch…) */

.mt-searchresults__count {
  margin: 0 0 1rem;
  color: var(--mt-text-muted);
}

.mt-resultlist {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-result {
  display: flex;
  gap: 1rem;
  padding: 1.1rem 0;
  border-bottom: 1px solid var(--mt-border);
}

.mt-result:first-child {
  padding-top: 0;
}

.mt-result__media {
  display: block;
  flex: 0 0 8rem;
  height: 5.5rem;
  overflow: hidden;
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-tint);
}

.mt-result__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 30em) {
  .mt-result__media {
    display: none;
  }
}

.mt-result__main {
  min-width: 0;
  flex: 1 1 auto;
}

.mt-result__title {
  margin: 0 0 .15rem;
  font-size: var(--mt-fs-lg);
  overflow-wrap: anywhere;
}

.mt-result__url {
  margin: 0 0 .3rem;
  color: var(--mt-success-text);
  font-size: var(--mt-fs-xs);
  overflow-wrap: anywhere;
}

.mt-result__excerpt {
  margin: 0 0 .5rem;
  overflow-wrap: anywhere;
}

.mt-result__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .6rem;
  margin: 0;
}

mark.keyword,
.keyword {
  padding: 0 .12em;
  border-radius: 3px;
  background: var(--mt-gold-light);
  color: var(--mt-on-accent);
  font-weight: 700;
}

/* Thanh chuyển mục con (banners, users: mt-subnav) ------------------------------------------------------------- */

.mt-subnav {
  margin: 0 0 1.25rem;
}

.mt-subnav__list {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-subnav__list a {
  display: inline-flex;
  align-items: center;
  min-height: 2.5rem;
  padding: .3rem 1rem;
  border: 2px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-pill);
  background: #fff;
  color: var(--mt-text);
  font-size: var(--mt-fs-sm);
  font-weight: 600;
  text-decoration: none;
}

.mt-subnav__list a:hover,
.mt-subnav__list a:focus {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-subnav__list li.active > a {
  border-color: var(--mt-primary);
  background: var(--mt-primary);
  color: var(--mt-on-primary);
}

/* Thanh đo (mt-meter): dùng thẻ progress gốc, không cần style nội tuyến ---------------------------------------- */

.mt-meter {
  display: block;
  width: 100%;
  height: .75rem;
  margin: 0;
  border: 0;
  border-radius: 999px;
  background: var(--mt-bg-tint);
  overflow: hidden;
  accent-color: var(--mt-primary);
  -webkit-appearance: none;
  appearance: none;
}

.mt-meter::-webkit-progress-bar {
  border-radius: 999px;
  background: var(--mt-bg-tint);
}

.mt-meter::-webkit-progress-value {
  border-radius: 999px;
  background: var(--mt-primary);
}

.mt-meter::-moz-progress-bar {
  border-radius: 999px;
  background: var(--mt-primary);
}

/* Bình chọn (block global.voting và trang voting) ------------------------------------------------------------- */

.mt-voting__set {
  min-width: 0;
  margin: 0 0 .85rem;
  padding: 0;
  border: 0;
}

.mt-voting__question {
  float: left;
  width: 100%;
  margin: 0 0 .6rem;
  padding: 0;
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-base);
  font-weight: 700;
  line-height: 1.4;
}

.mt-voting__question + * {
  clear: both;
}

.mt-voting__question--page {
  font-size: var(--mt-fs-lg);
}

.mt-voting .mt-check {
  min-height: 2.4rem;
  align-items: center;
  padding: .15rem 0;
  cursor: pointer;
}

.mt-voting .mt-check input {
  flex: none;
  margin-top: 0;
}

.mt-voting__captcha {
  padding: .5rem 0;
}

.mt-votingpage + .mt-votingpage {
  margin-top: 1.25rem;
}

.mt-votingresult__question {
  margin: 0 0 .85rem;
  font-size: var(--mt-fs-base);
}

.mt-votingresult__list {
  display: grid;
  gap: .8rem;
  margin: 0 0 .85rem;
  padding: 0;
  list-style: none;
}

.mt-votingresult__label {
  margin: 0 0 .25rem;
  overflow-wrap: anywhere;
}

.mt-votingresult__pct {
  margin-top: .15rem;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-sm);
  font-weight: 700;
}

.mt-votingresult__total {
  margin: 0;
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-sm);
}

/* Quảng cáo (block global.banners) --------------------------------------------------------------------------- */

.mt-banner {
  margin: 0 0 1rem;
  text-align: center;
}

.mt-banner:last-child {
  margin-bottom: 0;
}

.mt-banner img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  border-radius: var(--mt-radius-sm);
}

/* Bộ đếm truy cập (block statistics global.counter / global.counter_button) ------------------------------------ */

.mt-counter {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-counter__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .4rem 0;
  border-bottom: 1px dashed var(--mt-border);
  font-size: var(--mt-fs-sm);
}

.mt-counter__row:last-child {
  border-bottom: 0;
}

.mt-counter__row--sep {
  margin-top: .35rem;
  border-top: 1px solid var(--mt-border);
  padding-top: .6rem;
}

.mt-counter__label {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--mt-text);
}

.mt-counter__label .mt-icon {
  flex: none;
  color: var(--mt-primary);
}

.mt-counter__val {
  color: var(--mt-primary-strong);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* Khung trang xác thực ------------------------------------------------------------------------------------------ */

.mt-authwrap {
  display: grid;
  justify-items: center;
  padding: .5rem 0 1.5rem;
}

.mt-authcard {
  width: 100%;
  max-width: 28rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid var(--mt-border);
  border-top: 5px solid var(--mt-gold);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-card);
  box-shadow: var(--mt-shadow-2);
}

.mt-authwrap--wide .mt-authcard {
  max-width: 36rem;
}

.mt-authcard--embed {
  max-width: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.mt-authwrap--embed {
  padding: 0;
}

.mt-authcard__logo {
  margin: 0 0 1rem;
  text-align: center;
}

.mt-authcard__logo img {
  display: inline-block;
  width: 5rem;
  height: auto;
}

.mt-authcard__title {
  margin: 0 0 1.25rem;
  font-size: var(--mt-fs-2xl);
  text-align: center;
}

.mt-authnav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .4rem 1.25rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
  font-size: var(--mt-fs-sm);
}

.mt-authnav:empty {
  display: none;
}

/* Biểu mẫu thành viên ------------------------------------------------------------------------------------------- */

.mt-userform {
  max-width: 100%;
}

.mt-userform__actions {
  margin-top: .5rem;
}

.mt-userform__alt {
  margin: .9rem 0 0;
  font-size: var(--mt-fs-sm);
}

.mt-userform__note {
  margin: 0 0 1rem;
  text-align: center;
}

.mt-userform__avatar {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-tint);
}

.mt-userform__suggest {
  margin-top: .4rem;
  font-size: var(--mt-fs-sm);
}

.mt-userform__suggest summary {
  cursor: pointer;
  color: var(--mt-link);
  font-weight: 600;
}

.mt-userform__suggest ul {
  margin: .4rem 0 0;
  padding-left: 1.2rem;
}

.mt-field {
  min-width: 0;
}

.mt-field--addon {
  display: flex;
  align-items: stretch;
  gap: .5rem;
}

.mt-field--addon > .mt-input,
.mt-field--addon > .mt-select {
  flex: 1 1 auto;
  min-width: 0;
}

.mt-field--addon > .mt-btn {
  flex: none;
}

/* Bộ đếm đặt trong khối nền tối (chân trang): chữ sáng, biểu tượng vàng */
.mt-on-dark .mt-counter__row {
  border-color: rgba(255, 255, 255, .2);
}

.mt-on-dark .mt-counter__label,
.mt-on-dark .mt-counter__val {
  color: var(--mt-text-on-dark);
}

.mt-on-dark .mt-counter__label .mt-icon {
  color: var(--mt-gold);
}

/* ===== 60-blocks.css ===== */
/* 60-blocks.css — giao diện các block của theme: mt_hero_news, mt_notices, mt_news_by_cat, mt_quick_links (kiểu tiles), mt_useful_links. */

/* Tin nổi bật ------------------------------------------------------------------------------ */

.mt-hero {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr);
}

.mt-hero__lead {
  min-height: clamp(17rem, 36vw, 26rem);
}

.mt-hero__lead .mt-card__title {
  font-size: clamp(1.375rem, 1rem + 1.7vw, 2.125rem);
}

.mt-hero__lead .mt-card__body {
  gap: .6rem;
  padding: 5rem clamp(1rem, 3vw, 1.75rem) clamp(1rem, 3vw, 1.6rem);
}

.mt-hero__lead .mt-card__excerpt {
  max-width: 46rem;
}

/* Điện thoại: tin lớn xếp ẢNH TRÊN (16:9) – CHỮ DƯỚI trên nền navy thay vì chữ chồng lên ảnh cao gần vuông: ảnh nhìn rõ hơn và ô ảnh giữ tỉ lệ 16:9
   ở mọi khung nhìn (bản 480/960 px không bị phóng to theo chiều cao — OWN-20). */
@media (max-width: 39.99em) {
  .mt-hero__lead.mt-card--overlay {
    min-height: 0;
  }

  .mt-hero__lead.mt-card--overlay .mt-card__media {
    position: relative;
    inset: auto;
    aspect-ratio: 16 / 9;
  }

  .mt-hero__lead.mt-card--overlay .mt-card__body {
    padding-top: 1rem;
    background: none;
  }
}

.mt-hero__side {
  display: grid;
  gap: .85rem;
  margin: 0;
  padding: 0;
  list-style: none;
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 40em) {
  .mt-hero__side {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mt-hero__side .mt-card {
    flex-direction: column;
  }

  .mt-hero__side .mt-card__media {
    flex: none;
    width: 100%;
    aspect-ratio: 16 / 10;
  }

  .mt-hero__side .mt-card__body {
    padding: .8rem .95rem 1rem;
  }
}

/* Thông báo --------------------------------------------------------------------------------- */

.mt-notices .mt-list__item {
  align-items: flex-start;
}

.mt-notices__title {
  display: block;
  color: var(--mt-primary-strong);
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
}

.mt-notices__title:hover,
.mt-notices__title:focus {
  color: var(--mt-link);
  text-decoration: none;
}

.mt-notices__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .25rem .5rem;
  margin-top: .3rem;
}

/* Tin theo chuyên mục (mt_news_by_cat) ------------------------------------------------------------------
   Bố cục mặc định "lead" (OWN-21): 1 bài lớn (ảnh 16:9, ≤ ~53% bề rộng) + cột thẻ ngang có ảnh nhỏ, ngày, huy hiệu điểm trường, tiêu đề 2–3 dòng,
   phần giới thiệu ngắn (khi bật). Hai cột LUÔN cao bằng nhau: cột bên chia đều chiều cao cho các thẻ; ở bài lớn, phần ẢNH co giãn để lấp chỗ
   (không để khoảng trắng chết). ≤ 60em xếp dọc: bài lớn rồi lưới thẻ ngang 2 cột (≥ 40em) hoặc 1 cột. */

.mt-newstabs__more {
  margin: 1.1rem 0 0;
  text-align: right;
}

.mt-newstabs .mt-card__title {
  font-size: var(--mt-fs-base);
}

/* Khối MỘT chuyên mục đặt trong khung "section": nút "Xem tất cả" nằm cùng hàng với tiêu đề khối (từ 40em) thay vì chiếm thêm một hàng dưới lưới tin;
   phần ": tên chuyên mục" của nhãn chỉ còn cho trình đọc màn hình vì tiêu đề khối đã nói rõ. Dưới 40em nút ở cuối khối, nhãn đầy đủ. */
@media (min-width: 40em) {
  .mt-section {
    position: relative;
  }

  .mt-section > .mt-section__body > .mt-newstabs:not(.mt-tabs) .mt-newstabs__more {
    position: absolute;
    top: -.2rem;
    right: 0;
    margin: 0;
  }

  /* Trang chủ: dải tiêu đề có nền (20-layout.css .mt-is-home .mt-section__head) => canh nút giữa dải theo chiều dọc
     (dải = đệm .7rem × 2 + dòng tiêu đề 1.25 × --mt-fs-xl; trừ viền vàng 4px ở dưới) và lùi vào trong dải 1rem như phần đệm phải */
  .mt-is-home .mt-section > .mt-section__body > .mt-newstabs:not(.mt-tabs) .mt-newstabs__more {
    top: calc((.7rem * 2 + var(--mt-fs-xl) * 1.25) / 2);
    right: 1rem;
    transform: translateY(-50%);
  }

  .mt-section > .mt-section__body > .mt-newstabs:not(.mt-tabs) .mt-newstabs__more-of {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }
}

.mt-newsfeat {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr);
}

.mt-newsfeat__side,
.mt-newsfeat__extra {
  display: grid;
  gap: .75rem;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
}

/* Thẻ ngang của khối: ảnh nhỏ 4:3 bên trái, chữ bên phải */
.mt-newsfeat__item .mt-card__media {
  flex: 0 0 clamp(6.5rem, 31%, 11rem);
  aspect-ratio: 4 / 3;
  align-self: stretch;
}

.mt-newsfeat__item .mt-card__body {
  justify-content: center;
  gap: .28rem;
  padding: .7rem .95rem;
}

.mt-newsfeat__item .mt-card__title {
  display: -webkit-box;
  overflow: hidden;
  font-size: var(--mt-fs-base);
  line-height: 1.36;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.mt-newsfeat--excerpt .mt-newsfeat__item .mt-card__title {
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.mt-newsfeat__item .mt-card__excerpt {
  color: var(--mt-text-muted);
  font-size: .875rem;
  line-height: 1.5;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

/* Bài lớn */
.mt-newsfeat__lead .mt-card__media {
  flex: 1 1 auto;
  min-height: 11rem;
  aspect-ratio: 16 / 9;
}

.mt-newsfeat__lead .mt-card__body {
  flex: 0 0 auto;
  gap: .5rem;
  padding: 1rem 1.25rem 1.2rem;
}

.mt-newsfeat__lead.mt-card--featured .mt-card__title {
  display: -webkit-box;
  overflow: hidden;
  font-size: clamp(1.1875rem, 1rem + .7vw, 1.5rem);
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.mt-newsfeat__lead.mt-card--featured .mt-card__excerpt {
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-sm);
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

@media (min-width: 40em) and (max-width: 59.99em) {
  .mt-newsfeat__side,
  .mt-newsfeat__extra {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* máy tính bảng: bài lớn nằm ngang (ảnh trái, chữ phải) cho gọn — không chiếm cả màn hình */
  .mt-newsfeat__lead {
    flex-direction: row;
  }

  .mt-newsfeat__lead .mt-card__media {
    flex: 0 0 50%;
    min-height: 0;
    aspect-ratio: 16 / 10;
    align-self: stretch;
  }

  .mt-newsfeat__lead .mt-card__body {
    flex: 1 1 0;
    justify-content: center;
  }

  /* số thẻ lẻ: thẻ cuối trải hết hàng để không hở ô */
  .mt-newsfeat__side > :last-child:nth-child(odd),
  .mt-newsfeat__extra > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

@media (min-width: 60em) {
  .mt-newsfeat {
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
    align-items: stretch;
  }

  /* cột bên chia đều chiều cao của hàng cho các thẻ ⇒ đáy hai cột luôn thẳng hàng */
  .mt-newsfeat__side {
    grid-auto-rows: minmax(0, 1fr);
    align-content: stretch;
  }

  .mt-newsfeat__extra {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mt-newsfeat__extra--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mt-newsfeat__extra--1 {
    grid-template-columns: minmax(0, 1fr);
  }

  /* 5 thẻ ở cột bên (khối 6 bài): gọn hơn để bài lớn không bị kéo quá cao */
  .mt-newsfeat--side5 .mt-newsfeat__item .mt-card__body {
    padding-block: .5rem;
  }

  .mt-newsfeat--side5 .mt-newsfeat__item .mt-card__excerpt {
    -webkit-line-clamp: 1;
    line-clamp: 1;
  }

  .mt-newsfeat--side5 .mt-newsfeat__item .mt-card__media {
    flex-basis: clamp(6rem, 26%, 9rem);
  }

  /* chỉ có bài lớn (chuyên mục mới có 1 bài): không để nửa trang trống */
  .mt-newsfeat--side0 {
    grid-template-columns: minmax(0, 1fr);
  }

  .mt-newsfeat--side0 .mt-newsfeat__lead {
    flex-direction: row;
  }

  .mt-newsfeat--side0 .mt-newsfeat__lead .mt-card__media {
    flex: 0 0 52%;
  }

  .mt-newsfeat--side0 .mt-newsfeat__lead .mt-card__body {
    flex: 1 1 0;
    justify-content: center;
  }
}

/* Lưới thẻ đều: số cột theo số bài để hàng nào cũng kín (5 bài: 2 thẻ lớn + 3 thẻ; 7 bài: 3 + 4) */
.mt-newsgrid {
  display: grid;
  gap: 1.1rem;
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 40em) {
  .mt-newsgrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 60em) {
  .mt-newsgrid {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }

  .mt-newsgrid > * {
    grid-column: span 4;
  }

  .mt-newsgrid--1 > * {
    grid-column: span 12;
  }

  .mt-newsgrid--2 > *,
  .mt-newsgrid--5 > :nth-child(-n + 2) {
    grid-column: span 6;
  }

  .mt-newsgrid--4 > *,
  .mt-newsgrid--8 > *,
  .mt-newsgrid--7 > :nth-child(n + 4) {
    grid-column: span 3;
  }
}

/* Truy cập nhanh dạng ô lớn --------------------------------------------------------------------- */

.mt-quick--tiles {
  display: grid;
  gap: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 40em) {
  .mt-quick--tiles {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 60em) {
  .mt-quick--tiles {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.mt-quick--tiles .mt-quick__link {
  display: flex;
  height: 100%;
  flex-direction: column;
  align-items: center;
  gap: .6rem;
  padding: 1.1rem .75rem;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius);
  background: #fff;
  box-shadow: var(--mt-shadow-1);
  color: var(--mt-primary-strong);
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}

.mt-quick--tiles .mt-quick__link:hover,
.mt-quick--tiles .mt-quick__link:focus {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
  box-shadow: var(--mt-shadow-2);
}

.mt-quick--tiles .mt-icon {
  box-sizing: content-box;
  padding: .7rem;
  border-radius: 50%;
  background: var(--mt-bg-chip);
  color: var(--mt-primary);
}

/* Liên kết hữu ích -------------------------------------------------------------------------------- */

.mt-linklist {
  display: grid;
  gap: .6rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-linklist--cols {
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 40em) {
  .mt-linklist--cols {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.mt-linklist__link {
  display: flex;
  align-items: center;
  gap: .75rem;
  height: 100%;
  padding: .75rem .95rem;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius-sm);
  background: #fff;
  color: var(--mt-primary-strong);
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
}

.mt-linklist__link:hover,
.mt-linklist__link:focus {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-linklist__link .mt-icon {
  color: var(--mt-primary);
}

.mt-linklist__text {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: column;
}

.mt-linklist__desc {
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
  font-weight: 400;
}

/* Điện thoại: thẻ của lưới tin chuyển thành thẻ ngang gọn để trang chủ không quá dài; phần giới thiệu ngắn còn 2 dòng */
@media (max-width: 39.99em) {
  .mt-newsgrid .mt-card {
    flex-direction: row;
  }

  .mt-newsgrid .mt-card__media {
    flex: 0 0 clamp(6.5rem, 34%, 10rem);
    align-self: stretch;
    aspect-ratio: 4 / 3;
  }

  .mt-newsgrid .mt-card__body {
    justify-content: center;
    gap: .3rem;
    padding: .7rem .95rem;
  }

  .mt-newsgrid .mt-card__title {
    font-size: var(--mt-fs-base);
  }

  .mt-newsgrid .mt-card__excerpt,
  .mt-newsfeat__item .mt-card__excerpt {
    -webkit-line-clamp: 2;
    line-clamp: 2;
  }

  .mt-newsfeat__lead .mt-card__media {
    flex: none;
  }
}

/* Khối tin ở cột phụ / vị trí block ---------------------------------------------------------------------- */

.mt-newsblock {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-newsblock__item {
  display: flex;
  align-items: flex-start;
  gap: .8rem;
  padding: .75rem 0;
  border-bottom: 1px solid var(--mt-border);
}

.mt-newsblock__item:first-child {
  padding-top: 0;
}

.mt-newsblock__item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.mt-newsblock__thumb {
  flex: 0 0 5.5rem;
  display: block;
  overflow: hidden;
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-tint);
  aspect-ratio: 4 / 3;
}

.mt-newsblock__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mt-newsblock__text {
  min-width: 0;
  flex: 1 1 auto;
}

.mt-newsblock__text .mt-badge {
  margin-left: .35rem;
}

.mt-newsblock--ranked {
  counter-reset: mtrank;
}

.mt-newsblock--ranked .mt-newsblock__item {
  position: relative;
  counter-increment: mtrank;
  padding-left: 2.4rem;
}

.mt-newsblock--ranked .mt-newsblock__item::before {
  content: counter(mtrank);
  position: absolute;
  top: .75rem;
  left: 0;
  display: grid;
  width: 1.8rem;
  height: 1.8rem;
  place-items: center;
  border-radius: 50%;
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-sm);
  font-weight: 800;
}

.mt-newsblock--ranked .mt-newsblock__item:first-child::before {
  top: 0;
}

/* Hai cột (thẻ lớn + danh sách) theo bề rộng của chính khối, không theo màn hình: ở cột phụ hẹp tự xếp một cột */
.mt-newscenter,
.mt-headline {
  container-type: inline-size;
}

.mt-newscenter__grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr);
}

@container (min-width: 34rem) {
  .mt-newscenter__grid {
    grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
    align-items: start;
  }
}

.mt-card__more {
  margin: .25rem 0 0;
}

.mt-headline__grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr);
}

@container (min-width: 34rem) {
  .mt-headline__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
  }
}

.mt-headline__lead {
  display: grid;
  gap: 1rem;
}

.mt-catmenu__list,
.mt-catmenu__sub {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-catmenu__list > li {
  border-bottom: 1px solid var(--mt-border);
}

.mt-catmenu__list > li:last-child {
  border-bottom: 0;
}

.mt-catmenu a {
  display: block;
  padding: .55rem .25rem;
  color: var(--mt-primary-strong);
  font-weight: 600;
  text-decoration: none;
}

.mt-catmenu a:hover,
.mt-catmenu a:focus {
  color: var(--mt-link);
  text-decoration: none;
}

.mt-catmenu__sub {
  margin: 0 0 .5rem .9rem;
  padding-left: .75rem;
  border-left: 3px solid var(--mt-gold);
}

.mt-catmenu__sub a {
  padding-block: .35rem;
  font-weight: 400;
}

.mt-commentblock {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mt-commentblock__item {
  padding: .7rem 0;
  border-bottom: 1px solid var(--mt-border);
}

.mt-commentblock__who,
.mt-commentblock__text {
  margin: 0;
}

/* Block của module contact ở cột phụ (contact_default, contact_list, department, supporter): danh sách .mt-contactlist dùng chung với chân trang
   (40-footer.css, biểu tượng vàng trên nền tối); ở nền sáng đổi biểu tượng sang màu chính */

.mt-contactlist li {
  overflow-wrap: anywhere;
}

.mt-contactlist li > span:only-child {
  margin-left: 1.65rem;
}

.mt-contactblock .mt-contactlist .mt-icon,
.mt-contactlist-block .mt-contactlist .mt-icon {
  color: var(--mt-primary);
}

.mt-contactblock + .mt-contactblock {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--mt-border);
}

.mt-contactblock__title {
  margin: 0 0 .6rem;
  font-size: var(--mt-fs-lg);
}

.mt-contactblock__person {
  margin: 0 0 .25rem;
}

.mt-contactblock .mt-dl__row {
  grid-template-columns: minmax(0, 1fr);
}

.mt-contactblock .mt-dl dd {
  margin: 0;
  text-align: left;
  overflow-wrap: anywhere;
}

/* Nội dung tự do (block freecontent) */

.mt-freecontent {
  display: grid;
  gap: 1.25rem;
}

.mt-freecontent__item {
  min-width: 0;
}

.mt-freecontent__title {
  margin: 0 0 .5rem;
  font-size: var(--mt-fs-lg);
  line-height: 1.3;
}

.mt-freecontent__img {
  display: block;
  margin: 0 0 .6rem;
}

.mt-freecontent__img img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: var(--mt-radius-sm);
}

.mt-freecontent__text > :last-child {
  margin-bottom: 0;
}


.mt-newscenter__lead .mt-card__title {
  font-size: var(--mt-fs-lg);
}

@container (min-width: 34rem) {
  .mt-newscenter__lead .mt-card__title {
    font-size: var(--mt-fs-xl);
  }
}

/* ===== 70-compat.css ===== */
/* 70-compat.css — (1) trang trạng thái/lỗi độc lập, (2) thành phần "hợp đồng JS" của lõi (hộp thoại, popup đăng nhập, cảnh báo),
   (3) CHẾ ĐỘ TƯƠNG THÍCH: tpl mặc định của module lõi (Bootstrap 3, lưới 24 cột) được tô lại cho hòa với giao diện trường cho tới khi
   module có tpl riêng trong theme (class body "mt-legacy"). Mọi quy tắc (3) đều nằm trong ".mt-legacy .mt-module" nên tự mất tác dụng khi hết dùng. */

/* (1) Trang trạng thái (404, 403, 500, thông báo hệ thống): system/error_page.tpl, system/info_die.tpl ------------------------- */

body.mt-body--status {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: 1.25rem;
  background:
    radial-gradient(circle at 12% 18%, rgba(250, 210, 51, .18) 0 9rem, transparent 9.1rem),
    radial-gradient(circle at 92% 86%, rgba(13, 70, 166, .10) 0 14rem, transparent 14.1rem),
    var(--mt-bg-page);
}

.mt-status {
  width: 100%;
  max-width: 38rem;
}

.mt-status__card {
  position: relative;
  overflow: hidden;
  padding: clamp(1.5rem, 4vw, 2.75rem);
  border: 1px solid var(--mt-border);
  border-top: 6px solid var(--mt-gold);
  border-radius: var(--mt-radius-lg);
  background: #fff;
  box-shadow: var(--mt-shadow-3);
  text-align: center;
}

.mt-status__brand,
.mt-status__brand:hover,
.mt-status__brand:focus {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-lg);
  font-weight: 800;
  line-height: 1.25;
  text-decoration: none;
}

.mt-status__code {
  margin: .75rem 0 0;
  color: var(--mt-primary);
  font-size: clamp(4rem, 15vw, 6.75rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1;
}

.mt-status__title {
  margin: .5rem 0 .75rem;
  font-size: var(--mt-fs-2xl);
}

.mt-status__content {
  margin: 0 auto 1.5rem;
  max-width: 30rem;
  color: var(--mt-text);
}

.mt-status__content > :last-child {
  margin-bottom: 0;
}

.mt-status__search {
  margin: 0 0 1.5rem;
  text-align: left;
}

.mt-status__searchrow {
  display: flex;
  gap: .5rem;
}

.mt-status__searchrow .mt-input {
  flex: 1 1 auto;
  min-width: 0;
}

.mt-status__searchrow .mt-btn {
  flex: none;
  white-space: nowrap;
}

.mt-status__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .6rem;
  margin: 0;
}

/* (2) Thành phần mà JS/tpl lõi dựng sẵn (hộp thoại Bootstrap, popup, cảnh báo cố định) ---------------------------------------- */

.fade {
  opacity: 0;
  transition: opacity .15s linear;
}

.fade.in {
  opacity: 1;
}

.modal {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: none;
  overflow: auto;
  outline: 0;
  -webkit-overflow-scrolling: touch;
}

.modal-open {
  overflow: hidden;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1040;
  background: #061642;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop.in {
  opacity: .6;
}

.modal-dialog {
  position: relative;
  width: auto;
  max-width: 40rem;
  margin: 1.25rem auto;
  padding-inline: .75rem;
}

.modal-content {
  position: relative;
  overflow: hidden;
  border-radius: var(--mt-radius);
  background: #fff;
  box-shadow: var(--mt-shadow-3);
}

.modal-header {
  padding: .9rem 1.25rem;
  border-bottom: 3px solid var(--mt-gold);
  background: var(--mt-bg-tint);
}

.modal-title {
  margin: 0;
  font-size: var(--mt-fs-lg);
}

.modal-body {
  padding: 1.25rem;
}

.modal-footer {
  padding: .9rem 1.25rem;
  border-top: 1px solid var(--mt-border);
  text-align: right;
}

.modal .close {
  position: absolute;
  top: .6rem;
  right: .6rem;
  z-index: 2;
  display: grid;
  width: 2.5rem;
  height: 2.5rem;
  place-items: center;
  padding: 0;
  border: 2px solid var(--mt-border-strong);
  border-radius: 50%;
  background: #fff;
  color: var(--mt-text);
  cursor: pointer;
}

.modal .close:hover,
.modal .close:focus {
  border-color: var(--mt-primary);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

#sitemodal .modal-dialog {
  max-width: 38rem;
}

/* Popup đăng nhập / thông tin nhanh (lõi chèn nội dung vào #tip, #ftip và show/hide bằng JS) */
#tip,
#ftip {
  position: fixed;
  z-index: 600;
  display: none;
  width: min(92vw, 30rem);
  max-height: 80vh;
  overflow: auto;
  border: 1px solid var(--mt-border);
  border-top: 4px solid var(--mt-gold);
  border-radius: var(--mt-radius);
  background: #fff;
  color: var(--mt-text);
  box-shadow: var(--mt-shadow-3);
}

#tip {
  top: 5rem;
  right: 1rem;
}

#ftip {
  bottom: 5rem;
  left: 1rem;
}

#tip .bg,
#ftip .bg {
  padding: 1.1rem;
}

#tip a,
#ftip a {
  color: var(--mt-link);
}

#openidResult.nv-alert,
.nv-alert {
  position: fixed;
  top: 20%;
  right: 0;
  left: 0;
  z-index: 700;
  width: min(92vw, 24rem);
  margin: auto;
  padding: 1.5rem;
  border: 1px solid var(--mt-info);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-tint);
  box-shadow: var(--mt-shadow-3);
  text-align: center;
}

/* (2b) Mã JS của module lõi (users.js, comment.js, voting.js…) bật/tắt các lớp quen thuộc của Bootstrap: .hidden, .tab-pane.active/.in, .collapse.in,
   .tooltip (thông báo lỗi biểu mẫu), .has-error, .nv-info (hộp thông báo), .load-bar. Theme không nạp CSS Bootstrap nên khai báo tối thiểu ở đây
   để các hàm đó vẫn hoạt động đúng và hợp giao diện trường. ------------------------------------------------------------------------ */

.hidden {
  display: none !important;
}

.collapse:not(.in) {
  display: none;
}

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
}

.tab-content > .tab-pane {
  display: none;
}

.tab-content > .tab-pane.active {
  display: block;
}

.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  max-width: min(20rem, 90vw);
  margin-top: 4px;
  font-size: var(--mt-fs-sm);
  line-height: 1.4;
  opacity: 0;
  visibility: visible;
}

.tooltip.in {
  opacity: 1;
}

.tooltip.top {
  margin-top: -4px;
  padding: 5px 0;
}

.tooltip.bottom {
  padding: 5px 0;
}

.tooltip.left {
  margin-left: -4px;
  padding: 0 5px;
}

.tooltip.right {
  margin-left: 4px;
  padding: 0 5px;
}

.tooltip-inner {
  padding: .45rem .8rem;
  border-radius: var(--mt-radius-sm);
  background: var(--mt-alert-text);
  color: #fff;
  font-weight: 600;
  text-align: left;
}

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: var(--mt-alert-text);
}

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: var(--mt-alert-text);
}

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: var(--mt-alert-text);
}

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: var(--mt-alert-text);
}

/* Hộp thông báo của biểu mẫu thành viên: .nv-info (+ .error | .success | .info), thanh tải .load-bar */
.nv-info {
  margin: 0 0 1.1rem;
  padding: .8rem 1rem;
  border: 1px solid var(--mt-line);
  border-left: 5px solid var(--mt-info);
  border-radius: var(--mt-radius-sm);
  background: var(--mt-bg-tint);
  color: var(--mt-text);
  font-size: var(--mt-fs-sm);
}

.nv-info > :last-child {
  margin-bottom: 0;
}

.nv-info.error {
  border-color: #f2c2a8;
  border-left-color: var(--mt-alert-text);
  background: var(--mt-bg-error);
  color: var(--mt-alert-text);
  font-weight: 600;
}

.nv-info.success {
  border-color: #c5e3b0;
  border-left-color: var(--mt-success-text);
  background: var(--mt-bg-success);
  color: var(--mt-text);
  font-weight: 600;
}

.nv-info.info {
  border-left-color: var(--mt-info);
}

.load-bar {
  display: block;
  height: 4px;
  margin-top: .6rem;
  overflow: hidden;
  border-radius: 4px;
  background: rgba(8, 45, 127, .15);
}

.load-bar::after {
  content: "";
  display: block;
  width: 40%;
  height: 100%;
  border-radius: 4px;
  background: var(--mt-primary);
  animation: mt-loadbar 1.2s ease-in-out infinite;
}

@keyframes mt-loadbar {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(260%);
  }
}

.has-error .mt-label {
  color: var(--mt-alert-text);
}

/* Thông báo do PHP của module lõi in thẳng, không qua tpl (vd. news/search: '<div class="alert alert-danger">…'): dựng lại như mt-alert (không biểu tượng) */
.mt-module > .alert,
.mt-module .alert:not(.mt-alert) {
  margin: 0 0 1rem;
  padding: .9rem 1.15rem;
  border: 1px solid var(--mt-border);
  border-left-width: 6px;
  border-radius: var(--mt-radius-sm);
  background: #fff;
  color: var(--mt-text);
}

.mt-module .alert-info {
  border-color: var(--mt-info);
  background: var(--mt-bg-tint);
}

.mt-module .alert-success {
  border-color: var(--mt-success);
  background: var(--mt-bg-success);
}

.mt-module .alert-warning {
  border-color: var(--mt-orange);
  background: var(--mt-bg-notice);
}

.mt-module .alert-danger {
  border-color: var(--mt-flame);
  background: var(--mt-bg-error);
}

/* (3) Chế độ tương thích với tpl mặc định (Bootstrap 3) của module lõi ---------------------------------------------------------- */

.mt-legacy .mt-module {
  font-size: var(--mt-fs-base);
  line-height: var(--mt-lh);
}

.mt-legacy .mt-module .row {
  margin-right: -.6rem;
  margin-left: -.6rem;
}

.mt-legacy .mt-module [class*="col-"] {
  padding-right: .6rem;
  padding-left: .6rem;
}

.mt-legacy .mt-module .panel {
  margin-bottom: 1.25rem;
  overflow: hidden;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius);
  background: #fff;
  box-shadow: var(--mt-shadow-1);
}

.mt-legacy .mt-module .panel-heading {
  padding: .8rem 1.15rem;
  border-bottom: 3px solid var(--mt-gold);
  border-radius: 0;
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-legacy .mt-module .panel-title,
.mt-legacy .mt-module .panel-heading h1,
.mt-legacy .mt-module .panel-heading h2,
.mt-legacy .mt-module .panel-heading h3,
.mt-legacy .mt-module .panel-heading h4 {
  margin: 0;
  color: var(--mt-primary-strong);
  font-size: var(--mt-fs-lg);
  font-weight: 700;
}

.mt-legacy .mt-module .panel-body {
  padding: 1rem 1.15rem;
}

.mt-legacy .mt-module .panel-footer {
  padding: .75rem 1.15rem;
  border-top: 1px solid var(--mt-border);
  background: #f7fbfd;
}

.mt-legacy .mt-module .well {
  padding: 1rem 1.15rem;
  border: 1px solid var(--mt-line);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-tint);
  box-shadow: none;
}

.mt-legacy .mt-module .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  min-height: 2.5rem;
  padding: .4rem 1.1rem;
  border: 2px solid var(--mt-primary);
  border-radius: var(--mt-radius-pill);
  background: #fff;
  color: var(--mt-primary);
  font-size: var(--mt-fs-sm);
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  text-shadow: none;
  box-shadow: none;
}

.mt-legacy .mt-module .btn:hover,
.mt-legacy .mt-module .btn:focus {
  border-color: var(--mt-primary-strong);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
  text-decoration: none;
}

.mt-legacy .mt-module .btn-primary,
.mt-legacy .mt-module .btn-primary:hover,
.mt-legacy .mt-module .btn-primary:focus,
.mt-legacy .mt-module .btn-info,
.mt-legacy .mt-module .btn-info:hover,
.mt-legacy .mt-module .btn-info:focus {
  border-color: var(--mt-primary);
  background: var(--mt-primary);
  color: var(--mt-on-primary);
}

.mt-legacy .mt-module .btn-primary:hover,
.mt-legacy .mt-module .btn-primary:focus,
.mt-legacy .mt-module .btn-info:hover,
.mt-legacy .mt-module .btn-info:focus {
  border-color: var(--mt-primary-strong);
  background: var(--mt-primary-strong);
}

.mt-legacy .mt-module .btn-success,
.mt-legacy .mt-module .btn-success:hover,
.mt-legacy .mt-module .btn-success:focus,
.mt-legacy .mt-module .btn-warning,
.mt-legacy .mt-module .btn-warning:hover,
.mt-legacy .mt-module .btn-warning:focus {
  border-color: var(--mt-accent);
  background: var(--mt-accent);
  color: var(--mt-on-accent);
}

.mt-legacy .mt-module .btn-danger,
.mt-legacy .mt-module .btn-danger:hover,
.mt-legacy .mt-module .btn-danger:focus {
  border-color: var(--mt-alert-text);
  background: var(--mt-alert-text);
  color: #fff;
}

.mt-legacy .mt-module .btn-xs,
.mt-legacy .mt-module .btn-sm {
  min-height: 2.1rem;
  padding: .2rem .85rem;
  font-size: var(--mt-fs-xs);
}

.mt-legacy .mt-module .btn-lg {
  min-height: 3.1rem;
  padding: .5rem 1.6rem;
  font-size: var(--mt-fs-base);
}

.mt-legacy .mt-module .form-control {
  min-height: 2.75rem;
  height: auto;
  padding: .55rem .9rem;
  border: 2px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-sm);
  background-color: #fff;
  color: var(--mt-text);
  font-size: var(--mt-fs-base);
  box-shadow: none;
}

.mt-legacy .mt-module .form-control:focus {
  border-color: var(--mt-primary);
  box-shadow: none;
}

.mt-legacy .mt-module textarea.form-control {
  min-height: 8rem;
}

.mt-legacy .mt-module label,
.mt-legacy .mt-module .control-label {
  font-weight: 600;
}

.mt-legacy .mt-module .has-error .form-control {
  border-color: var(--mt-alert-text);
}

.mt-legacy .mt-module .help-block {
  color: var(--mt-text-muted);
  font-size: var(--mt-fs-xs);
}

.mt-legacy .mt-module .table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 1.25rem;
  border-collapse: collapse;
  background: #fff;
  font-size: var(--mt-fs-sm);
}

.mt-legacy .mt-module .table > thead > tr > th,
.mt-legacy .mt-module .table > tbody > tr > th {
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
  font-weight: 700;
}

.mt-legacy .mt-module .table > thead > tr > th,
.mt-legacy .mt-module .table > thead > tr > td,
.mt-legacy .mt-module .table > tbody > tr > th,
.mt-legacy .mt-module .table > tbody > tr > td,
.mt-legacy .mt-module .table > tfoot > tr > td {
  padding: .65rem .85rem;
  border-color: var(--mt-border);
}

.mt-legacy .mt-module .table-striped > tbody > tr:nth-of-type(odd) {
  background: #f7fbfd;
}

.mt-legacy .mt-module .table-hover > tbody > tr:hover {
  background: #eef7fb;
}

.mt-legacy .mt-module .alert {
  padding: .9rem 1.15rem;
  border-width: 1px;
  border-left-width: 6px;
  border-radius: var(--mt-radius-sm);
  color: var(--mt-text);
}

.mt-legacy .mt-module .alert-info {
  border-color: var(--mt-info);
  background: var(--mt-bg-tint);
}

.mt-legacy .mt-module .alert-success {
  border-color: var(--mt-success);
  background: var(--mt-bg-success);
}

.mt-legacy .mt-module .alert-warning {
  border-color: var(--mt-orange);
  background: var(--mt-bg-notice);
}

.mt-legacy .mt-module .alert-danger {
  border-color: var(--mt-flame);
  background: var(--mt-bg-error);
}

.mt-legacy .mt-module .label {
  display: inline-block;
  padding: .15rem .65rem;
  border-radius: var(--mt-radius-pill);
  background: var(--mt-bg-chip);
  color: var(--mt-primary-strong);
  font-size: .75rem;
  font-weight: 700;
}

.mt-legacy .mt-module .label-success {
  background: var(--mt-success);
  color: var(--mt-on-success);
}

.mt-legacy .mt-module .label-warning {
  background: var(--mt-warning);
  color: var(--mt-on-warning);
}

.mt-legacy .mt-module .label-danger {
  background: var(--mt-bg-error);
  color: var(--mt-alert-text);
}

.mt-legacy .mt-module .text-muted {
  color: var(--mt-text-muted);
}

.mt-legacy .mt-module .breadcrumb {
  padding: .5rem 0;
  background: transparent;
}

.mt-legacy .mt-module .nav-tabs {
  border-bottom: 2px solid var(--mt-border);
}

.mt-legacy .mt-module .nav-tabs > li > a {
  border: 0;
  border-radius: var(--mt-radius-sm) var(--mt-radius-sm) 0 0;
  color: var(--mt-link);
  font-weight: 600;
}

.mt-legacy .mt-module .nav-tabs > li.active > a,
.mt-legacy .mt-module .nav-tabs > li.active > a:hover,
.mt-legacy .mt-module .nav-tabs > li.active > a:focus {
  border: 0;
  border-bottom: 3px solid var(--mt-gold);
  background: var(--mt-bg-tint);
  color: var(--mt-primary-strong);
}

.mt-legacy .mt-module .thumbnail,
.mt-legacy .mt-module .img-thumbnail {
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius-sm);
  background: #fff;
  box-shadow: none;
}

.mt-legacy .mt-module .pagination {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin: 1.5rem 0;
}

.mt-legacy .mt-module .pagination > li > a,
.mt-legacy .mt-module .pagination > li > span {
  border: 1px solid var(--mt-border-strong);
  border-radius: var(--mt-radius-sm);
  color: var(--mt-link);
}

.mt-legacy .mt-module .pagination > .active > a,
.mt-legacy .mt-module .pagination > .active > span {
  border-color: var(--mt-primary);
  background: var(--mt-primary);
  color: #fff;
}

.mt-legacy .mt-module .list-group-item {
  border-color: var(--mt-border);
}

.mt-legacy .mt-module .clearfix::after {
  content: "";
  display: table;
  clear: both;
}

.mt-legacy .mt-module img {
  max-width: 100%;
  height: auto;
}

/* Liên kết bọc ảnh khối (img.img-responsive…): để hộp liên kết có kích thước thật, vòng focus bao quanh ảnh */
.mt-legacy .mt-module a:has(> img) {
  display: inline-block;
  max-width: 100%;
}

/* Khối (block) của module lõi đặt vào cột phụ: giữ nhịp với khung mt-panel */
.mt-legacy .mt-aside .panel-heading,
.mt-legacy .mt-aside .panel-body {
  color: var(--mt-text);
}

.mt-legacy .mt-aside ul {
  padding-left: 1.1em;
}

/* ===== 75-integration.css ===== */
/* 75-integration.css — chỉnh khớp giữa theme và site SAU provisioning (nghiệm thu toàn site trên prv, docs/ops/provisioning-acceptance.md).
   Chỉ gồm các sửa nhỏ cho chỗ nội dung/cấu hình thật làm lộ lệch bố cục; không đổi hệ thiết kế. Mỗi khối ghi nguyên nhân. */

/* 1) Thanh truy cập nhanh trên điện thoại ---------------------------------------------------------------------------------------------
   Provisioning đặt 5 liên kết (Thông báo, Công khai giáo dục, Lịch – Sự kiện, Thư viện, Liên hệ). Ở < 40em dải này từng cuộn ngang và không có dấu hiệu
   gợi ý cuộn: ở 320 px chỉ thấy 2 liên kết, 3 liên kết còn lại bị ẩn. Cho xuống dòng để thấy đủ cả 5. */
@media (max-width: 39.99em) {
  .mt-topbar__quick {
    overflow: visible;
  }

  .mt-quick--bar {
    flex-wrap: wrap;
  }
}

/* 2) Bảng trong thân trang tĩnh ---------------------------------------------------------------------------------------------------------
   Thân trang (about/siteterms) là HTML thô; mt.js bọc bảng trong .mt-table-wrap (khung viền) nhưng bảng chỉ rộng theo nội dung nên để hở một khoảng trắng
   bên phải khung (trang Ban Giám hiệu). Cho bảng đầy khung; bảng rộng hơn khung vẫn cuộn ngang trong khung. */
/* (55-content.css đặt `.mt-article__body table { width: auto !important }` để bỏ độ rộng cố định do trình soạn thảo sinh; nên cần !important cùng độ ưu tiên cao hơn) */
.mt-article__body .mt-table-wrap > table,
.mt-prose .mt-table-wrap > table {
  width: 100% !important;
}

/* 3) Khoảng cách giữa các mục trong .mt-stack ---------------------------------------------------------------------------------------------
   Các tpl của module tùy biến (điểm trường, sự kiện, album, công khai giáo dục) bọc các <section class="mt-section"> trong .mt-stack nhưng 20-layout.css đặt
   `.mt-section { margin: 0 }` SAU `.mt-stack > * + *` (cùng độ ưu tiên) nên khoảng cách bị mất: khung "chưa có ..." của mục trên dính tiêu đề mục dưới
   (thấy ở trang chi tiết điểm trường). Trả lại đúng ý đồ của .mt-stack; trang điểm trường dùng khoảng cách rộng hơn. */
.mt-stack > * + .mt-section {
  margin-top: var(--mt-stack, 1rem);
}

.mt-campus.mt-stack {
  --mt-stack: 2rem;
}

/* 4) Khung "Thông tin" của điểm trường -------------------------------------------------------------------------------------------------------
   tpl dùng <dl class="mt-dl mt-campus__info"> với dt/dd liền kề (không có .mt-dl__row) nên chữ sát mép khung viền. */
.mt-dl.mt-campus__info {
  padding: .75rem 1rem;
}

/* 5) Đầu trang chi tiết điểm trường ------------------------------------------------------------------------------------------------------------
   tpl dùng `<header class="mt-section__head mt-campus__head">` (flex, space-between) cho huy hiệu + h1 + mô tả nên h1 bị đẩy sang PHẢI cùng hàng với huy hiệu
   và nhỏ hơn h1 của các trang trong. Xếp dọc (huy hiệu, tiêu đề, mô tả) và cho h1 cỡ tiêu đề trang. */
.mt-campus__head.mt-section__head {
  display: block;
}

.mt-campus__head .mt-section__title {
  margin: .5rem 0 .5rem;
  font-size: var(--mt-fs-3xl);
}

/* 6) Ảnh thay thế của tin CHƯA CÓ ẢNH — lấy từ BIỂU TRƯNG của trường (không dùng ảnh/hình giả) --------------------------------------------------
   Phản hồi khi xem bản xem thử: khung xanh trơn với biểu tượng mũ cử nhân trông như chỗ giữ chỗ. Nay: nền sáng nhạt cùng tông biểu trưng, biểu trưng
   (logo-cutout, nền trong suốt, tệp gốc của dự án — không vẽ lại) đặt giữa; riêng thẻ nổi bật chữ chồng ảnh (nền navy) đặt biểu trưng lớn ở bên phải. Biểu trưng là
   ảnh nền CSS (trang trí, aria-hidden) nên không thêm phần tử/ảnh vào HTML. Mọi nơi dùng .mt-card__placeholder (khối trang chủ, danh sách tin) đều hưởng. */
.mt-card__placeholder {
  background:
    radial-gradient(circle at 50% 46%, #fff 0, #f2f7fd 44%, #dbe7f7 100%);
  color: var(--mt-primary);
}

.mt-card__placeholder > .mt-icon {
  display: none;
}

.mt-card__placeholder::before {
  right: -16%;
  bottom: -52%;
  width: 66%;
  border: 12px solid rgba(13, 70, 166, .06);
}

.mt-card__placeholder::after {
  inset: 0;
  right: 0;
  bottom: 0;
  width: auto;
  aspect-ratio: auto;
  border: 0;
  border-radius: 0;
  background: url("../images/brand/logo-cutout-192.webp") center 50% / auto 58% no-repeat;
  filter: drop-shadow(0 3px 8px rgba(8, 45, 127, .2));
}

/* Thẻ nổi bật (chữ trắng chồng ảnh): nền navy; biểu trưng lớn, MỜ như dấu chìm ở bên phải — tiêu đề dài chồng lên vẫn đọc được (chữ trắng trên navy, tương phản không đổi) */
.mt-card--overlay .mt-card__placeholder {
  background:
    radial-gradient(circle at 84% 34%, rgba(255, 255, 255, .14) 0, rgba(255, 255, 255, 0) 40%),
    linear-gradient(140deg, var(--mt-primary-strong) 0%, var(--mt-primary) 100%);
}

.mt-card--overlay .mt-card__placeholder::before {
  border-color: rgba(255, 255, 255, .07);
}

.mt-card--overlay .mt-card__placeholder::after {
  background-position: 90% 28%;
  background-size: auto 74%;
  opacity: .26;
  filter: none;
}

@media (max-width: 39.99em) {
  .mt-card--overlay .mt-card__placeholder::after {
    background-position: 50% 12%;
    background-size: auto 60%;
  }
}

/* 7) Trang chủ: hai danh sách tài liệu cạnh nhau khi HOME_LINKS còn trống ----------------------------------------------------------------
   Provisioning đặt "Văn bản mới" và "Tài nguyên tải về" cùng ở HOME_RESOURCES. Khi HOME_LINKS không có khối nào (chưa có liên kết hữu ích đã xác minh, khối tự ẩn)
   thì HOME_RESOURCES là con DUY NHẤT của .mt-pair và chiếm cả hàng: hai khối xếp chồng, mỗi khối rộng 100% với 1–5 dòng ngắn trông thưa và lệch với hàng
   "Công khai giáo dục | Lịch và sự kiện" phía trên. Cho hai khối chạy thành hai cột (chỉ từ 60em; dưới đó vẫn xếp chồng). */
@media (min-width: 60em) {
  .mt-pair > .mt-slot[data-mt-slot="home-resources"]:only-child {
    display: grid;
    gap: var(--mt-flow) 2rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }

  .mt-pair > .mt-slot[data-mt-slot="home-resources"]:only-child > * + * {
    margin-top: 0;
  }
}

/* 8) Trang chủ: khối "Tin theo điểm trường" của module campuses (dải nền .mt-band) -----------------------------------------------------------
   Khối của module là danh sách một cột (tiêu đề gạch chân + ngày) trải hết chiều rộng 1200 px nên phần lớn dải nền để trống và khác hẳn thẻ tin của khối nổi bật.
   Chỉ trong .mt-band của trang chủ (trang chi tiết điểm trường không bị đổi): hai cột từ 48em, mỗi tin một thẻ trắng viền như các thẻ khác, tiêu đề cùng kiểu
   (navy, gạch chân khi trỏ/focus). CSS riêng của module (campuses.css) không đụng. */
.mt-band .mt-campus-news__list {
  display: grid;
  gap: .75rem 1.25rem;
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 48em) {
  .mt-band .mt-campus-news__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.mt-band .mt-campus-news__item {
  padding: .85rem 1rem;
  border: 1px solid var(--mt-border);
  border-radius: var(--mt-radius);
  background: var(--mt-bg-card);
  box-shadow: var(--mt-shadow-1);
}

.mt-band .mt-campus-news__title {
  color: var(--mt-primary-strong);
  text-decoration: none;
}

.mt-band .mt-campus-news__title:hover,
.mt-band .mt-campus-news__title:focus {
  color: var(--mt-link);
  text-decoration: none;
}

/* 9) Trang trạng thái (404, thông báo hệ thống): dòng ghi công nền tảng ------------------------------------------------------------------
   Hai mẫu system/info_die.tpl và system/error_page.tpl là trang đứng riêng (không có chân trang của theme) nên có thêm một dòng ghi công NukeViet CMS dưới thẻ,
   cùng nội dung với chân trang thường (mt_powered_by) — giữ ghi công như quy tắc kỹ thuật của dự án. */
.mt-status__credit {
  margin: 1rem 0 0;
  color: var(--mt-text-muted);
  font-size: .875rem;
  text-align: center;
}

.mt-status__credit a {
  color: inherit;
  text-decoration: underline;
}

.mt-status__credit a:hover,
.mt-status__credit a:focus {
  color: var(--mt-link);
}

/* ===== 80-print.css ===== */
/* 80-print.css — bản in: bỏ khung điều hướng, chữ đen trên nền trắng, hiện địa chỉ liên kết trong thân bài. */

@media print {
  html,
  body.mt-body {
    background: #fff !important;
    color: #000 !important;
    font-size: 11.5pt;
  }

  .mt-skip-link,
  .mt-topbar,
  .mt-nav,
  .mt-search,
  .mt-search-toggle,
  .mt-nav-toggle,
  .mt-pagehead,
  .mt-aside,
  .mt-footer__main,
  .mt-totop,
  .mt-cookie,
  .mt-timeout,
  .mt-admintool,
  .mt-pagination,
  .mt-filter,
  .mt-chips,
  .mt-lightbox,
  #tip,
  #ftip,
  #sitemodal {
    display: none !important;
  }

  .mt-masthead {
    border-bottom: 2px solid #000;
    background: none;
  }

  .mt-masthead::before,
  .mt-masthead::after,
  .mt-footer__wave,
  .mt-footer__rings,
  .mt-footer__cta {
    display: none !important;
  }

  [data-mt-reveal] {
    opacity: 1 !important;
    transform: none !important;
  }

  .mt-footer__logo {
    box-shadow: none;
  }

  .mt-footer__brandbar,
  .mt-footer__brand,
  .mt-footer__brand-name,
  .mt-footer__brand-slogan,
  .mt-footer__brand-org,
  .mt-footer__copy-name,
  .mt-footer a {
    color: #000 !important;
  }

  .mt-brand__name,
  .mt-brand__org,
  .mt-brand__place {
    color: #000 !important;
  }

  .mt-page__grid,
  .mt-page__grid--aside {
    display: block;
  }

  .mt-footer {
    margin-top: 1rem;
    border-top: 1px solid #000;
    background: none;
    color: #000;
  }

  .mt-footer__bottom {
    background: none;
    color: #000;
  }

  .mt-card,
  .mt-panel,
  .mt-table-wrap,
  .mt-file {
    border-color: #999 !important;
    box-shadow: none !important;
    break-inside: avoid;
  }

  .mt-body h1,
  .mt-body h2,
  .mt-body h3,
  .mt-body h4 {
    color: #000;
    break-after: avoid;
  }

  .mt-body img,
  .mt-body figure,
  .mt-body table {
    break-inside: avoid;
  }

  .mt-prose a[href^="http"]::after {
    content: " (" attr(href) ")";
    color: #333;
    font-size: .85em;
    word-break: break-all;
  }
}