/* 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, 40-footer.css, 50-components.css, 55-content.css, 60-blocks.css, 70-compat.css, 75-integration.css, 76-mamnon.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 B1B55D3AA63EA52DCEB6D857307432AD093C7A3E72B85FFCCC0795CF7A3113CE); dữ liệu sinh ngày 2026-10-04. 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: #FFFCF5;
  --mt-navy: #073B88;
  --mt-cobalt: #0666C6;
  --mt-amber: #F5B81F;
  --mt-gold: #FEDB4A;
  --mt-sky-pale: #CFEFFB;
  --mt-azure: #1477D4;
  --mt-gold-light: #FFEB99;
  --mt-orange: #F4669A;
  --mt-cream: #FFF4CC;
  --mt-sky: #3FB8EE;
  --mt-ink: #1B2A4E;
  --mt-slate: #5F7594;
  --mt-bronze: #A8642F;
  --mt-green: #55A434;
  --mt-flame: #EC3081;
  --mt-pink: #F4669A;
  --mt-pink-strong: #C2185B;
  --mt-pink-pale: #FDE7F0;
  --mt-green-strong: #2B7A0B;
  --mt-green-pale: #E8F5DF;
  /* Bề mặt/nền */
  --mt-bg-page: #FFFCF5;
  --mt-bg-card: #FFFFFF;
  --mt-bg-tint: #E6F5FD;
  --mt-bg-notice: #FFF6D6;
  --mt-bg-chip: #CFEFFB;
  --mt-bg-dark: #073B88;
  /* Chữ */
  --mt-text: #1B2A4E;
  --mt-text-muted: #566B8A;
  --mt-text-on-dark: #FFFFFF;
  --mt-text-on-dark-muted: #CFEFFB;
  /* Hành động (nút, liên kết, nhấn) */
  --mt-primary: #0666C6;
  --mt-primary-strong: #073B88;
  --mt-on-primary: #FFFFFF;
  --mt-link: #0A5CB5;
  --mt-link-hover: #073B88;
  --mt-link-on-dark: #CFEFFB;
  --mt-accent: #FEDB4A;
  --mt-accent-hover: #F5B81F;
  --mt-on-accent: #1B2A4E;
  --mt-accent-text: #8A5A00;
  /* Trạng thái */
  --mt-success: #55A434;
  --mt-on-success: #10213F;
  --mt-success-text: #2B7A0B;
  --mt-warning: #E08A1B;
  --mt-on-warning: #1B2A4E;
  --mt-warning-text: #9A5200;
  --mt-info: #1477D4;
  --mt-on-info: #FFFFFF;
  --mt-info-text: #0A5CB5;
  --mt-alert-text: #C0264A;
  /* Viền và focus */
  --mt-border: #D5DCE6;
  --mt-border-strong: #5F7594;
  --mt-focus: #073B88;
  --mt-focus-on-dark: #FEDB4A;
}

/* ===== 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;
}

.mt-section__more:hover,
.mt-section__more:focus {
  text-decoration: underline;
}

/* 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;
}

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

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

.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 cơ sở… (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;
}

.mt-topbar__contact a:hover,
.mt-topbar__contact a:focus {
  text-decoration: underline;
}

.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;
}

.mt-brand__name {
  margin: 0;
  color: var(--mt-primary-strong);
  font-size: clamp(1.0625rem, .8rem + 1.5vw, 1.875rem);
  font-weight: 800;
  letter-spacing: -.01em;
  line-height: 1.15;
}

.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-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 {
  color: var(--mt-text-on-dark);
  text-decoration: underline;
}

.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 {
  color: var(--mt-gold);
  text-decoration: underline;
}

.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: underline;
}

.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;
  }
}

/* ===== 40-footer.css ===== */
/* 40-footer.css — chân trang, về đầu trang, thông báo cookie, nhắc phiên đăng nhập. */

.mt-footer {
  position: relative;
  margin-top: var(--mt-flow);
  overflow: hidden;
  border-top: 5px solid var(--mt-gold);
  background: var(--mt-bg-dark);
  color: var(--mt-text-on-dark);
}

/* Họa tiết vành đồng tâm (trang trí) */
.mt-footer::before,
.mt-footer::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.mt-footer::before {
  right: -7rem;
  bottom: -11rem;
  width: 24rem;
  height: 24rem;
  border: 2.5rem solid rgba(255, 255, 255, .045);
}

.mt-footer::after {
  right: -1.5rem;
  bottom: -5.5rem;
  width: 12rem;
  height: 12rem;
  border: 1.25rem solid rgba(250, 210, 51, .08);
}

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

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

@media (min-width: 56em) {
  .mt-footer__grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.35fr) minmax(0, .9fr);
  }

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

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

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

.mt-footer__title {
  position: relative;
  margin: 0 0 1rem;
  padding-bottom: .65rem;
  color: var(--mt-text-on-dark);
  font-size: var(--mt-fs-lg);
  font-weight: 700;
}

.mt-footer__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 2.75rem;
  height: 4px;
  border-radius: 4px;
  background: var(--mt-gold);
}

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

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

.mt-footer a:hover,
.mt-footer a:focus {
  color: var(--mt-accent);
  text-decoration: underline;
}

.mt-footer__bottom {
  position: relative;
  z-index: 1;
  border-top: 1px solid rgba(255, 255, 255, .16);
  background: rgba(0, 0, 0, .14);
  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: .9rem;
}

.mt-footer__bottom p {
  margin: 0;
}

/* Khối thông tin trong chân trang (mt_school_info) */
.mt-schoolinfo__name {
  margin: 0 0 .2rem;
  color: var(--mt-text-on-dark);
  font-size: var(--mt-fs-lg);
  font-weight: 700;
  line-height: 1.3;
}

.mt-schoolinfo__slogan {
  margin: 0 0 .5rem;
  color: var(--mt-gold);
  font-size: var(--mt-fs-sm);
  font-style: italic;
  font-weight: 600;
}

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

.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 li > span {
  white-space: nowrap;
}

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

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

.mt-campuslist__item {
  position: relative;
  margin: 0;
  padding-left: 1.5rem;
}

.mt-campuslist__item::before {
  content: "";
  position: absolute;
  top: .55em;
  left: .1rem;
  width: .6rem;
  height: .6rem;
  border-radius: 50%;
  background: var(--mt-gold);
  box-shadow: 0 0 0 4px rgba(254, 219, 74, .22);
}

.mt-campuslist__item:nth-child(2)::before {
  border-radius: 2px;
  transform: rotate(45deg);
  background: var(--mt-sky-pale);
  box-shadow: 0 0 0 4px rgba(207, 239, 251, .2);
}

.mt-campuslist__item:nth-child(3)::before {
  border-radius: 50% 0 50% 50%;
  background: var(--mt-pink);
  box-shadow: 0 0 0 4px rgba(244, 102, 154, .22);
}

.mt-campuslist__item:nth-child(4)::before {
  border-radius: 0;
  background: var(--mt-green);
  box-shadow: none;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.mt-campuslist__item:nth-child(5)::before {
  border-radius: 2px;
  background: var(--mt-sky);
  box-shadow: 0 0 0 4px rgba(63, 184, 238, .2);
}

.mt-campuslist__name {
  display: block;
  color: var(--mt-text-on-dark);
  font-weight: 700;
  line-height: 1.35;
}

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

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

.mt-footnav {
  display: grid;
  gap: .15rem 1.5rem;
  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 {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding-block: .3rem;
  text-decoration: none;
}

.mt-footnav a:hover,
.mt-footnav a:focus {
  text-decoration: underline;
}

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

.mt-totop {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 90;
  display: grid;
  width: 2.875rem;
  height: 2.875rem;
  place-items: center;
  border-radius: 50%;
  background: var(--mt-accent);
  color: var(--mt-on-accent);
  box-shadow: var(--mt-shadow-2);
}

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

/* 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);
  }
}

/* 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: underline;
}

/* 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: underline;
}

.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 cơ sở: luôn có chữ, thêm hình khác nhau (tròn / thoi / cánh sen / tam giác / 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-hoa-sen,
.mt-badge--campus-hoa-mo,
.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-hoa-sen::before,
.mt-badge--campus-hoa-mo::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-hoa-sen {
  border-color: var(--mt-pink);
  background: var(--mt-pink-pale);
  color: var(--mt-pink-strong);
}

.mt-badge--campus-hoa-sen::before {
  border-radius: 50% 0 50% 50%;
  background: var(--mt-pink-strong);
}

.mt-badge--campus-hoa-mo {
  border-color: var(--mt-green);
  background: var(--mt-green-pale);
  color: var(--mt-green-strong);
}

.mt-badge--campus-hoa-mo::before {
  background: var(--mt-green-strong);
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.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;
}

.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: underline;
}

.mt-notices__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .25rem .5rem;
  margin-top: .3rem;
}

/* Tin theo chuyên mục (tab) ---------------------------------------------------------------------- */

.mt-newstabs__more {
  margin: 1.1rem 0 0;
  text-align: right;
}

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

/* 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ẻ tin trong tab chuyển thành thẻ ngang gọn để trang chủ không quá dài */
@media (max-width: 39.99em) {
  .mt-newstabs .mt-card {
    flex-direction: row;
  }

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

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

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

/* 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: underline;
}

.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 (cơ sở, 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 cơ sở). Trả lại đúng ý đồ của .mt-stack; trang cơ sở 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 cơ sở -------------------------------------------------------------------------------------------------------
   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 cơ sở ------------------------------------------------------------------------------------------------------------
   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);
}

/* ===== 76-mamnon.css ===== */
/* 76-mamnon.css — lớp nhận diện riêng của Trường Mầm non Mường Thanh.
   Sáng, ấm, bo tròn; họa tiết lấy cảm hứng từ biểu trưng (mặt trời vàng, lá xanh, cánh sen hồng) vẽ bằng CSS, không dùng ảnh ngoài.
   Hồng / xanh lá / vàng chỉ làm nền và điểm nhấn; chữ luôn là mực hoặc xanh đậm (tương phản AA — xem docs/brand-palette.md). */

:root {
  --mt-shadow-1: 0 1px 2px rgba(7, 59, 136, .08), 0 1px 1px rgba(7, 59, 136, .05);
  --mt-shadow-2: 0 10px 26px -10px rgba(7, 59, 136, .28), 0 2px 6px rgba(7, 59, 136, .08);
  --mt-shadow-3: 0 22px 48px -16px rgba(7, 59, 136, .34), 0 4px 12px rgba(7, 59, 136, .10);
}

/* Nền trang chủ: vầng mặt trời và mảng lá rất nhạt ở hai góc, không ảnh hưởng nội dung */
.mt-main--home {
  background:
    radial-gradient(circle at 96% 2rem, rgba(254, 219, 74, .38) 0 5.5rem, rgba(254, 219, 74, .16) 5.6rem 8.5rem, transparent 8.6rem),
    radial-gradient(ellipse 14rem 9rem at -2rem 22rem, rgba(85, 164, 52, .10) 0 99%, transparent 100%);
  background-repeat: no-repeat;
}

/* Lối tắt trang chủ: 5 ô lớn, mỗi ô một sắc nền nhạt + vạch màu dưới; chữ xanh đậm */
.mt-shortcuts {
  margin-block: clamp(1.25rem, .75rem + 2vw, 2.25rem) 0;
}

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

.mt-shortcuts .mt-quick--tiles {
  gap: clamp(.75rem, .5rem + 1vw, 1.25rem);
}

.mt-shortcuts .mt-quick--tiles .mt-quick__link {
  min-height: 7.25rem;
  justify-content: center;
  border: 0;
  border-bottom: 5px solid var(--mt-tile-line, var(--mt-primary));
  border-radius: var(--mt-radius-lg);
  background: var(--mt-tile, var(--mt-bg-tint));
  font-size: 1.0625rem;
  line-height: 1.3;
  transition: transform .15s ease, box-shadow .15s ease;
}

.mt-shortcuts .mt-quick--tiles .mt-quick__link:hover,
.mt-shortcuts .mt-quick--tiles .mt-quick__link:focus {
  background: var(--mt-tile, var(--mt-bg-tint));
  transform: translateY(-3px);
}

.mt-shortcuts .mt-quick--tiles .mt-icon {
  background: #fff;
  color: var(--mt-tile-ink, var(--mt-primary));
  box-shadow: var(--mt-shadow-1);
}

.mt-shortcuts .mt-quick--tiles li:nth-child(5n + 1) { --mt-tile: var(--mt-pink-pale); --mt-tile-line: var(--mt-pink); --mt-tile-ink: var(--mt-pink-strong); }
.mt-shortcuts .mt-quick--tiles li:nth-child(5n + 2) { --mt-tile: var(--mt-bg-notice); --mt-tile-line: var(--mt-amber); --mt-tile-ink: var(--mt-accent-text); }
.mt-shortcuts .mt-quick--tiles li:nth-child(5n + 3) { --mt-tile: var(--mt-green-pale); --mt-tile-line: var(--mt-green); --mt-tile-ink: var(--mt-green-strong); }
.mt-shortcuts .mt-quick--tiles li:nth-child(5n + 4) { --mt-tile: var(--mt-bg-tint); --mt-tile-line: var(--mt-primary); --mt-tile-ink: var(--mt-primary); }
.mt-shortcuts .mt-quick--tiles li:nth-child(5n + 5) { --mt-tile: var(--mt-bg-chip); --mt-tile-line: var(--mt-primary-strong); --mt-tile-ink: var(--mt-primary-strong); }

/* 5 ô trên máy tính bảng: 3 + 2 cân giữa; điện thoại: 2 cột, ô cuối trải hết hàng */
@media (max-width: 39.99em) {
  .mt-shortcuts .mt-quick--tiles li:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

/* Dải nền: vạch nhấn vàng – hồng, viền theo bảng màu mới */
.mt-band {
  border-block-color: var(--mt-bg-chip);
}

/* Liên hệ và các cơ sở */
.mt-band--contact {
  margin-top: clamp(2rem, 1.5rem + 2vw, 3.25rem);
  border-block-color: var(--mt-gold-light);
  background:
    radial-gradient(circle at 100% 0, rgba(254, 219, 74, .45) 0 4.5rem, transparent 4.6rem),
    var(--mt-bg-notice);
}

.mt-band--contact:has(> .mt-container:empty) {
  display: none;
}

/* Thẻ: bo tròn hơn một chút cho cảm giác thân thiện */
.mt-card,
.mt-campus-card {
  border-radius: var(--mt-radius-lg);
}

/* Tiêu đề khối: chấm tròn ba màu của biểu trưng đứng trước */
.mt-section__title::before {
  content: "";
  display: inline-block;
  width: .7em;
  height: .7em;
  margin-right: 2.35em;
  border-radius: 50%;
  background: var(--mt-gold);
  box-shadow: .95em 0 0 -.12em var(--mt-green), 1.75em 0 0 -.22em var(--mt-pink);
  vertical-align: .05em;
}


/* Thanh trên cùng của trang: ba sắc của biểu trưng */
.mt-header::before {
  content: "";
  display: block;
  height: 5px;
  background: linear-gradient(90deg, var(--mt-primary) 0 40%, var(--mt-gold) 40% 65%, var(--mt-green) 65% 85%, var(--mt-pink) 85% 100%);
}

/* Khẩu hiệu trên biểu trưng */
.mt-masthead__slogan {
  color: var(--mt-pink-strong);
  font-style: italic;
  font-weight: 600;
}

@media (prefers-reduced-motion: reduce) {
  .mt-shortcuts .mt-quick--tiles .mt-quick__link {
    transition: none;
  }

  .mt-shortcuts .mt-quick--tiles .mt-quick__link:hover,
  .mt-shortcuts .mt-quick--tiles .mt-quick__link:focus {
    transform: none;
  }
}

@media print {
  .mt-shortcuts,
  .mt-band--contact,
  .mt-header::before {
    display: none;
  }
}

/* ===== 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::before,
  .mt-footer::after {
    display: none;
  }

  .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;
  }
}