/**
 * Giao diện mamnon75 - Trang thông tin điện tử Trường Mầm non 7 tháng 5
 * mn.css - hệ thống thiết kế "mn-" (nạp SAU bootstrap.min.css, style.css, style.responsive.css)
 *
 * Tài liệu sử dụng: .work/contract/DESIGN.md
 *
 * MỤC LỤC
 *  01. Biến thiết kế (tokens)
 *  02. Nền tảng: chữ, liên kết, tiêu đề, ảnh, tiêu điểm bàn phím
 *  03. Trình bày lại các thành phần Bootstrap 3 / NukeViet mặc định
 *      (panel, well, nút, biểu mẫu, bảng, phân trang, cảnh báo, hộp thoại, tab...)
 *  04. Khung trang: container, thanh tiện ích, nhận diện, dải bốn màu
 *  05. Trình đơn chính (.mn-nav) - máy tính và ngăn kéo trên màn hình hẹp
 *  06. Đường dẫn trang, vùng nội dung, bố cục (.mn-split, .mn-grid, .mn-stack...)
 *  07. Chân trang, nút lên đầu trang
 *  08. Tiêu đề trang, khối (.mn-pagehead, .mn-section)
 *  09. Thẻ (.mn-card)
 *  10. Nhãn (.mn-badge)
 *  11. Nút (.mn-btn) và liên kết nhanh
 *  12. Danh sách: .mn-list, .mn-files, .mn-meta, .mn-timeline, .mn-linklist
 *  13. Biểu mẫu, thanh lọc (.mn-filter)
 *  14. Bảng (.mn-table)
 *  15. Thông báo, trạng thái rỗng (.mn-notice, .mn-updating, .mn-empty)
 *  16. Tab, accordion
 *  17. Thư viện ảnh, hộp xem ảnh (lightbox), khung PDF, video
 *  18. Lịch (.mn-calendar), số liệu (.mn-stat)
 *  19. Trang chủ: .mn-hero, .mn-quick, .mn-strip
 *  20. Nội dung bài viết (.mn-prose)
 *  21. Mẫu module trong giao diện (tin tức, trang, liên hệ) và block dùng chung
 *  22. Trang thông báo/lỗi (info_die), chế độ quản trị kéo thả block
 *  23. Tiện ích
 *  24. In ấn
 *  25. Giảm chuyển động, tương phản cao
 *  26. Bổ sung của giao diện v2: ô ngày (.mn-date), dòng nguồn (.mn-source), nhãn trong danh sách tin phụ,
 *      .mn-thumblist__body, .mn-form__policy, liên kết của trang thông báo, bổ sung cho bản in
 */

/* ==========================================================================
   01. Biến thiết kế
   ========================================================================== */

:root {
    /* Màu lấy từ logo */
    --mn-blue-900: #0A2A5E;
    --mn-blue-800: #063F86;
    --mn-blue-700: #084C9E;
    --mn-blue-600: #0B63CE;
    --mn-blue-200: #BBD6F7;
    --mn-blue-100: #DCEBFC;
    --mn-blue-50: #EEF5FE;
    --mn-yellow-500: #F5C400;
    --mn-yellow-400: #FFD60A;
    --mn-yellow-100: #FFF3B8;
    --mn-yellow-50: #FFFAE0;
    --mn-green-700: #15792A;
    --mn-green-600: #1E8A2E;
    --mn-green-100: #CFEBD4;
    --mn-green-50: #EAF6EC;
    --mn-pink-700: #B81F67;
    --mn-pink-600: #D6297B;
    --mn-pink-100: #FAD3E5;
    --mn-pink-50: #FDECF4;
    --mn-red-700: #A80D15;
    --mn-red-600: #D0111B;
    --mn-red-50: #FDECEC;
    --mn-orange-700: #B45309;
    --mn-orange-50: #FFF1E0;

    /* Màu chữ, nền, đường kẻ */
    --mn-ink-900: #1F2937;
    --mn-ink-700: #374151;
    --mn-ink-600: #4B5563;
    --mn-ink-500: #5F6876;
    --mn-line: #E6DFD0;
    --mn-line-strong: #8A8F98;
    --mn-bg: #FFFBF3;
    --mn-bg-soft: #FBF4E4;
    --mn-surface: #FFFFFF;
    --mn-link: var(--mn-blue-600);
    --mn-link-hover: var(--mn-blue-800);
    --mn-focus: var(--mn-blue-700);

    /* Màu nhận biết từng cơ sở (chữ trắng, tương phản >= 4.5:1) */
    --mn-coso-toan-truong: #084C9E;
    --mn-coso-truong-chinh: #0B63CE;
    --mn-coso-hoa-hong: #D6297B;
    --mn-coso-20-10: #B45309;
    --mn-coso-7-5: #D0111B;
    --mn-coso-thanh-binh: #15792A;

    /* Chữ */
    --mn-font: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif;
    --mn-text: 1.0625rem;
    --mn-text-sm: 0.9375rem;
    --mn-text-xs: 0.875rem;
    --mn-leading: 1.65;

    /* Khoảng cách */
    --mn-space-1: 4px;
    --mn-space-2: 8px;
    --mn-space-3: 12px;
    --mn-space-4: 16px;
    --mn-space-5: 24px;
    --mn-space-6: 32px;
    --mn-space-7: 48px;
    --mn-space-8: 64px;
    --mn-gap: 24px;
    --mn-gutter: 20px;
    --mn-container: 1180px;

    /* Bo góc, đổ bóng */
    --mn-radius-sm: 8px;
    --mn-radius: 14px;
    --mn-radius-lg: 20px;
    --mn-radius-xl: 28px;
    --mn-radius-pill: 999px;
    --mn-shadow-sm: 0 1px 2px rgba(31, 41, 55, 0.05), 0 2px 6px rgba(31, 41, 55, 0.06);
    --mn-shadow: 0 2px 4px rgba(31, 41, 55, 0.04), 0 10px 24px rgba(31, 41, 55, 0.08);
    --mn-shadow-lg: 0 18px 44px rgba(8, 76, 158, 0.16);

    --mn-ease: cubic-bezier(0.2, 0.7, 0.3, 1);
}

/* ==========================================================================
   02. Nền tảng
   ========================================================================== */

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: 16px;
}

body,
body.mn-body {
    font-family: var(--mn-font);
    font-size: 1rem;
    line-height: var(--mn-leading);
    color: var(--mn-ink-900);
    background-color: var(--mn-bg);
    overflow-wrap: break-word;
    -webkit-font-smoothing: antialiased;
}

@media (min-width: 768px) {
    body,
    body.mn-body {
        font-size: var(--mn-text);
    }
}

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

button,
input,
select,
textarea {
    font-family: inherit;
}

a {
    color: var(--mn-link);
    text-decoration: none;
    text-underline-offset: 0.18em;
}

a:hover,
a:focus {
    color: var(--mn-link-hover);
    text-decoration: underline;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: var(--mn-font);
    color: var(--mn-ink-900);
    line-height: 1.25;
    font-weight: 800;
    letter-spacing: -0.01em;
}

h1,
.h1 {
    font-size: clamp(1.625rem, 1.2rem + 1.8vw, 2.25rem);
}

h2,
.h2 {
    font-size: clamp(1.375rem, 1.15rem + 1vw, 1.75rem);
}

h3,
.h3 {
    font-size: 1.25rem;
}

h4,
.h4 {
    font-size: 1.125rem;
}

h5,
.h5,
h6,
.h6 {
    font-size: 1rem;
}

p {
    margin: 0 0 1em;
}

img {
    max-width: 100%;
    height: auto;
}

hr {
    border: 0;
    border-top: 1px solid var(--mn-line);
    margin: var(--mn-space-5) 0;
}

small,
.small {
    font-size: var(--mn-text-xs);
}

::selection {
    background: var(--mn-yellow-400);
    color: var(--mn-ink-900);
}

/* Tiêu điểm bàn phím: luôn nhìn thấy, 3px */
:focus:not(:focus-visible) {
    outline: none;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
iframe:focus-visible,
[tabindex]:focus-visible,
.btn:focus-visible,
.form-control:focus-visible {
    outline: 3px solid var(--mn-focus) !important;
    outline-offset: 2px !important;
    border-radius: 4px;
    text-decoration: none;
}

main:focus-visible,
#mn-main:focus {
    outline: none !important;
}

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

[hidden] {
    display: none !important;
}

.mn-skip {
    position: absolute;
    left: 12px;
    top: -80px;
    z-index: 3000;
    padding: 12px 18px;
    background: var(--mn-yellow-400);
    color: var(--mn-ink-900) !important;
    font-weight: 800;
    border-radius: 0 0 var(--mn-radius-sm) var(--mn-radius-sm);
    box-shadow: var(--mn-shadow);
    text-decoration: none;
}

.mn-skip:focus {
    top: 0;
}

.mn-noscript {
    background: var(--mn-yellow-100);
    color: var(--mn-ink-900);
    padding: 10px var(--mn-gutter);
    text-align: center;
    font-size: var(--mn-text-sm);
}

html.mn-lock,
html.mn-lock body {
    overflow: hidden;
}

/* Ngăn kéo trình đơn đang mở: phần đầu trang nổi trên mọi thành phần khác */
html.mn-nav-open .mn-header {
    z-index: 1500;
}

/* ==========================================================================
   03. Thành phần Bootstrap 3 / NukeViet mặc định (các mẫu module dùng dự phòng)
   ========================================================================== */

.panel {
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius);
    box-shadow: var(--mn-shadow-sm);
    margin-bottom: var(--mn-space-5);
}

.panel > .panel-heading,
.panel-heading {
    background-color: transparent;
    background-image: none !important;
    border-bottom: 1px solid var(--mn-line);
    border-radius: var(--mn-radius) var(--mn-radius) 0 0;
    color: var(--mn-ink-900);
    font-size: 1.0625rem;
    font-weight: 800;
    padding: 14px 20px;
}

.panel-heading h1,
.panel-heading h2,
.panel-heading h3,
.panel-heading .h3 {
    font-size: 1.125rem;
    margin: 0;
}

.panel-body {
    padding: 20px;
}

.panel-footer {
    background: var(--mn-bg-soft);
    border-top: 1px solid var(--mn-line);
    border-radius: 0 0 var(--mn-radius) var(--mn-radius);
    padding: 12px 20px;
}

.panel-default,
.panel-primary,
.panel-info,
.panel-success,
.panel-warning,
.panel-danger {
    border-color: var(--mn-line);
}

.panel-default > .panel-heading {
    background-color: transparent;
    border-color: var(--mn-line);
    color: var(--mn-ink-900);
}

.panel-primary > .panel-heading {
    background-color: var(--mn-blue-700);
    border-color: var(--mn-blue-700);
    color: #fff;
}

.panel-primary > .panel-heading a {
    color: #fff;
}

.panel-info > .panel-heading {
    background-color: var(--mn-blue-50);
    color: var(--mn-blue-800);
}

.panel-success > .panel-heading {
    background-color: var(--mn-green-50);
    color: var(--mn-green-700);
}

.panel-warning > .panel-heading {
    background-color: var(--mn-yellow-50);
    color: var(--mn-ink-900);
}

.panel-danger > .panel-heading {
    background-color: var(--mn-red-50);
    color: var(--mn-red-700);
}

.panel > .list-group:last-child .list-group-item:last-child,
.panel > .table:last-child,
.panel > .table-responsive:last-child > .table:last-child {
    border-bottom-left-radius: var(--mn-radius);
    border-bottom-right-radius: var(--mn-radius);
}

.well {
    background: var(--mn-blue-50);
    border: 1px solid var(--mn-blue-100);
    border-radius: var(--mn-radius);
    box-shadow: none;
    color: var(--mn-ink-900);
    line-height: var(--mn-leading);
    padding: 16px 20px;
}

.list-group-item {
    border-color: var(--mn-line);
    padding: 12px 16px;
}

.list-group-item:first-child {
    border-top-left-radius: var(--mn-radius-sm);
    border-top-right-radius: var(--mn-radius-sm);
}

.list-group-item:last-child {
    border-bottom-left-radius: var(--mn-radius-sm);
    border-bottom-right-radius: var(--mn-radius-sm);
}

/* Nút */
.btn {
    border-radius: var(--mn-radius-pill);
    border-width: 2px;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    min-height: 44px;
    padding: 8px 20px;
    white-space: normal;
    transition: background-color 0.15s var(--mn-ease), border-color 0.15s var(--mn-ease), color 0.15s var(--mn-ease);
}

.btn-lg {
    font-size: 1.0625rem;
    min-height: 52px;
    padding: 12px 28px;
}

.btn-sm,
.btn-xs {
    /* cao tối thiểu 44px (vùng chạm); phần đệm dọc đủ lớn để chữ nằm giữa cả khi nút là thẻ <a> */
    font-size: var(--mn-text-sm);
    min-height: 44px;
    padding: 9px 14px;
}

.btn-primary,
a.btn-primary,
.btn-info,
a.btn-info {
    background-color: var(--mn-blue-600);
    border-color: var(--mn-blue-600);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open > .dropdown-toggle.btn-primary,
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.btn-info:active:focus,
.btn-info:active:hover {
    background-color: var(--mn-blue-800);
    border-color: var(--mn-blue-800);
    color: #fff;
}

.btn-default,
a.btn-default {
    background-color: #fff;
    border-color: var(--mn-blue-600);
    color: var(--mn-blue-700);
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.btn-default:active:focus,
.btn-default:active:hover,
.open > .dropdown-toggle.btn-default {
    background-color: var(--mn-blue-50);
    border-color: var(--mn-blue-700);
    color: var(--mn-blue-800);
}

.btn-success,
a.btn-success {
    background-color: var(--mn-green-700);
    border-color: var(--mn-green-700);
    color: #fff;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success:active:focus,
.btn-success:active:hover {
    background-color: #0F5E20;
    border-color: #0F5E20;
    color: #fff;
}

.btn-warning,
a.btn-warning {
    background-color: var(--mn-yellow-400);
    border-color: var(--mn-yellow-400);
    color: var(--mn-ink-900);
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning:active:focus,
.btn-warning:active:hover {
    background-color: var(--mn-yellow-500);
    border-color: var(--mn-yellow-500);
    color: var(--mn-ink-900);
}

.btn-danger,
a.btn-danger {
    background-color: var(--mn-red-600);
    border-color: var(--mn-red-600);
    color: #fff;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger:active:focus,
.btn-danger:active:hover {
    background-color: var(--mn-red-700);
    border-color: var(--mn-red-700);
    color: #fff;
}

.btn-link,
a.btn-link {
    color: var(--mn-link);
    font-weight: 700;
}

.btn[disabled],
.btn.disabled,
fieldset[disabled] .btn {
    opacity: 0.6;
}

/* Biểu mẫu */
label,
.control-label {
    font-weight: 700;
    color: var(--mn-ink-900);
}

.form-control {
    background-color: #fff;
    border: 1.5px solid var(--mn-line-strong);
    border-radius: var(--mn-radius-sm);
    box-shadow: none;
    color: var(--mn-ink-900);
    font-size: 1rem;
    height: 46px;
    line-height: 1.5;
    padding: 9px 14px;
}

textarea.form-control {
    height: auto;
    min-height: 120px;
}

select.form-control {
    padding-right: 30px;
}

select[multiple].form-control,
select[size].form-control {
    height: auto;
}

.form-control:focus {
    border-color: var(--mn-blue-600);
    box-shadow: 0 0 0 3px var(--mn-blue-100);
}

.form-control::placeholder {
    color: var(--mn-ink-500);
    opacity: 1;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background-color: #F3F1EC;
    color: var(--mn-ink-600);
}

.input-sm,
.form-group-sm .form-control {
    font-size: var(--mn-text-sm);
    height: 38px;
    padding: 6px 12px;
}

.input-lg {
    font-size: 1.0625rem;
    height: 52px;
}

.form-group {
    margin-bottom: 18px;
}

.form-horizontal .control-label {
    padding-top: 11px;
}

.help-block {
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
}

.input-group-addon {
    background-color: var(--mn-blue-50);
    border: 1.5px solid var(--mn-line-strong);
    border-radius: var(--mn-radius-sm);
    color: var(--mn-blue-800);
    font-size: 1rem;
    min-width: 46px;
    padding: 6px 12px;
}

.input-group-btn {
    font-size: 1rem !important;
}

.input-group-btn > .btn {
    border-radius: var(--mn-radius-sm);
    min-height: 46px;
}

.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group .form-control:not(:first-child):not(:last-child) {
    border-radius: 0;
}

input[type='checkbox'],
input[type='radio'] {
    border: 1.5px solid var(--mn-line-strong);
    box-shadow: none;
    height: 20px;
    width: 20px;
    min-width: 20px;
    margin: 0 8px 2px 0;
}

input[type='checkbox'] {
    border-radius: 5px;
}

input[type='checkbox']:checked,
input[type='radio']:checked {
    border-color: var(--mn-blue-600);
}

input[type='checkbox']:checked:before {
    color: var(--mn-blue-700);
    font-size: 15px;
    margin: 1px 0 0 1px;
    width: 16px;
}

input[type='radio']:checked:before {
    background-color: var(--mn-blue-600);
    height: 10px;
    width: 10px;
    margin: 3.5px;
}

.checkbox label,
.radio label,
label.check-box,
label.radio-box,
label.radio-inline,
label.checkbox-inline {
    font-weight: 400;
    /* dòng chọn cao tối thiểu 44px (vùng chạm): phần đệm thay cho lề của .checkbox/.radio */
    min-height: 44px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.checkbox,
.radio {
    margin-top: 0;
    margin-bottom: 0;
}

.radio-inline + .radio-inline,
.checkbox-inline + .checkbox-inline {
    margin-top: 0;
}

/* Ô chọn 20px của giao diện rộng bằng đúng phần đệm 20px của Bootstrap nên chữ dính sát ô chọn: nới thành 30px */
.radio label,
.checkbox label,
label.radio-inline,
label.checkbox-inline {
    padding-left: 30px;
}

.radio input[type='radio'],
.radio-inline input[type='radio'],
.checkbox input[type='checkbox'],
.checkbox-inline input[type='checkbox'] {
    margin-left: -30px;
    margin-top: 3px;
}

.has-error .form-control,
.has-error .input-group-addon,
.form-control[aria-invalid='true'] {
    border-color: var(--mn-red-600);
}

.has-error .form-control:focus {
    border-color: var(--mn-red-600);
    box-shadow: 0 0 0 3px var(--mn-red-50);
}

.has-error .control-label,
.has-error .help-block {
    color: var(--mn-red-700);
}

.has-success .form-control {
    border-color: var(--mn-green-700);
}

input[type='text'].required,
input[type='password'].required,
input[type='email'].required,
input[type='number'].required,
input[type='search'].required,
input[type='tel'].required,
input[type='url'].required,
textarea.required,
select.required {
    background-image: none;
}

.txtrequired,
.required-mark,
sup.required {
    color: var(--mn-red-600);
}

.nv-captcha img,
img.captchaImg {
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-sm);
    background: #fff;
}

/* Bảng */
.table {
    background: #fff;
    margin-bottom: var(--mn-space-5);
}

.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
    border-color: var(--mn-line);
    line-height: 1.5;
    padding: 11px 14px;
    vertical-align: top;
}

.table > thead > tr > th,
.table > caption + thead > tr:first-child > th {
    background: var(--mn-blue-50);
    border-bottom: 2px solid var(--mn-blue-200);
    color: var(--mn-blue-800);
    font-weight: 800;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: var(--mn-bg);
}

.table-hover > tbody > tr:hover {
    background-color: var(--mn-blue-50);
}

.table-bordered,
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
    border-color: var(--mn-line);
}

table caption {
    color: var(--mn-ink-900);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.4;
    padding: 0 0 10px 2px;
}

.table-responsive {
    border: 0;
    margin-bottom: var(--mn-space-5);
}

/* Phân trang (nv_generate_page / nv_alias_page) */
.pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin: var(--mn-space-5) 0;
    padding: 0;
    border-radius: 0;
}

.pagination > li {
    display: block;
    list-style: none;
}

.pagination > li > a,
.pagination > li > span {
    display: flex;
    align-items: center;
    justify-content: center;
    float: none;
    min-width: 44px;
    min-height: 44px;
    margin: 0;
    padding: 6px 12px;
    background: #fff;
    border: 1.5px solid var(--mn-line);
    border-radius: var(--mn-radius-pill) !important;
    color: var(--mn-blue-700);
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}

.pagination > li > a:hover,
.pagination > li > a:focus {
    background: var(--mn-blue-50);
    border-color: var(--mn-blue-600);
    color: var(--mn-blue-800);
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > a:focus {
    background: var(--mn-blue-700);
    border-color: var(--mn-blue-700);
    color: #fff;
    cursor: default;
}

.pagination > .disabled > span,
.pagination > .disabled > a {
    background: transparent;
    border-color: transparent;
    color: var(--mn-ink-600);
}

/* Cảnh báo */
.alert {
    border: 1px solid transparent;
    border-left-width: 6px;
    border-radius: var(--mn-radius);
    color: var(--mn-ink-900);
    padding: 14px 18px;
}

.alert-info {
    background: var(--mn-blue-50);
    border-color: var(--mn-blue-200);
    border-left-color: var(--mn-blue-600);
    color: var(--mn-ink-900);
}

.alert-success {
    background: var(--mn-green-50);
    border-color: var(--mn-green-100);
    border-left-color: var(--mn-green-700);
    color: var(--mn-ink-900);
}

.alert-warning {
    background: var(--mn-yellow-50);
    border-color: var(--mn-yellow-100);
    border-left-color: var(--mn-yellow-500);
    color: var(--mn-ink-900);
}

.alert-danger {
    background: var(--mn-red-50);
    border-color: #F6C6C9;
    border-left-color: var(--mn-red-600);
    color: var(--mn-ink-900);
}

.alert a:not(.btn):not(.mn-btn),
.alert .alert-link {
    color: var(--mn-blue-800);
    font-weight: 700;
    text-decoration: underline;
}

.nv-info {
    border-color: var(--mn-line);
    border-radius: var(--mn-radius);
    background: var(--mn-surface);
    color: var(--mn-ink-900);
    padding: 14px 18px;
}

.nv-info.error {
    background-color: var(--mn-red-50) !important;
    border-color: #F6C6C9 !important;
}

.nv-info.success,
.nv-info.info {
    background-color: var(--mn-blue-50) !important;
    border-color: var(--mn-blue-200) !important;
    color: var(--mn-ink-900);
}

.nv-info.error:before {
    color: var(--mn-red-600);
}

.nv-info.success:before {
    color: var(--mn-green-700);
}

.nv-info.info:before {
    color: var(--mn-blue-700);
}

.text-muted {
    color: var(--mn-ink-600);
}

.text-danger {
    color: var(--mn-red-700);
}

.text-success {
    color: var(--mn-green-700);
}

.text-primary,
.text-info {
    color: var(--mn-blue-700);
}

.label {
    border-radius: var(--mn-radius-pill);
    font-size: 0.8125rem;
    font-weight: 700;
    padding: 0.3em 0.75em;
}

.label-primary,
.label-info {
    background-color: var(--mn-blue-700);
}

.label-success {
    background-color: var(--mn-green-700);
}

.label-danger {
    background-color: var(--mn-red-600);
}

.label-warning {
    background-color: var(--mn-yellow-400);
    color: var(--mn-ink-900);
}

.label-default {
    background-color: var(--mn-ink-600);
}

.badge {
    background-color: var(--mn-blue-700);
    border-radius: var(--mn-radius-pill);
    font-size: 0.8125rem;
    padding: 4px 9px;
}

.badge a {
    color: #fff;
}

.img-thumbnail {
    background-color: #fff;
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-sm);
    padding: 3px;
}

blockquote {
    border-left: 5px solid var(--mn-yellow-400);
    background: var(--mn-yellow-50);
    border-radius: 0 var(--mn-radius-sm) var(--mn-radius-sm) 0;
    font-size: 1em;
    margin: 0 0 1.25em;
    padding: 14px 18px;
}

/* Hộp thoại, tooltip, tab của Bootstrap */
.modal-content {
    border: 0;
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-lg);
}

.modal-header {
    border-bottom: 1px solid var(--mn-line);
    padding: 16px 20px;
}

.modal-title {
    font-size: 1.25rem;
    font-weight: 800;
}

.modal-body {
    padding: 20px;
}

.modal-footer {
    border-top: 1px solid var(--mn-line);
    padding: 14px 20px;
}

.modal-backdrop.in {
    opacity: 0.6;
    background: var(--mn-blue-900);
}

.close,
button.close {
    color: var(--mn-ink-900);
    font-size: 26px;
    min-height: 44px;
    min-width: 44px;
    opacity: 0.75;
    text-shadow: none;
}

.close:hover,
.close:focus {
    opacity: 1;
}

/* Nút đóng 44px trong phần đầu hộp thoại: lề âm để phần đầu không cao thêm */
.modal-header .close {
    margin: -9px -10px -9px 8px;
}

#sitemodal .modal-content {
    font-size: 1rem;
    max-width: 100%;
}

#sitemodal .close,
#sitemodalTerm .close {
    right: -12px;
    top: -12px;
    bottom: auto;
    width: 44px;
    height: 44px;
    background-color: var(--mn-blue-900);
    border: 2px solid #fff;
    border-radius: 50%;
    color: #fff;
    font-size: 16px;
    opacity: 1;
}

/* Điện thoại: hộp thoại chỉ cách mép màn hình 10px nên nút đóng lùi vào để không bị cắt */
@media (max-width: 767.98px) {
    #sitemodal .close,
    #sitemodalTerm .close {
        right: -6px;
        top: -6px;
    }
}

.tooltip {
    font-family: var(--mn-font);
    font-size: var(--mn-text-xs);
}

.tooltip-inner {
    background: var(--mn-ink-900);
    border-radius: var(--mn-radius-sm);
    padding: 8px 12px;
}

.nav-tabs {
    border-bottom: 2px solid var(--mn-line);
}

.nav-tabs > li > a {
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    color: var(--mn-ink-700);
    font-weight: 700;
    margin-right: 4px;
    padding: 12px 16px;
}

.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
    background: var(--mn-blue-50);
    border-bottom-color: var(--mn-blue-200);
    color: var(--mn-blue-800);
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background: transparent;
    border: 0;
    border-bottom: 3px solid var(--mn-blue-600);
    color: var(--mn-blue-800);
}

.dropdown-menu {
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-sm);
    box-shadow: var(--mn-shadow);
    font-size: 1rem;
    padding: 6px;
}

.dropdown-menu > li > a {
    border-radius: 6px;
    color: var(--mn-ink-900);
    padding: 9px 12px;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background: var(--mn-blue-50);
    color: var(--mn-blue-800);
}

.breadcrumb {
    background: transparent;
    padding: 0;
}

.progress {
    border-radius: var(--mn-radius-pill);
    box-shadow: none;
    background: var(--mn-blue-100);
}

.progress-bar {
    background-color: var(--mn-blue-600);
}

/* Lớp tiện ích cũ của giao diện mặc định */
.title {
    font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2rem);
}

.hometext {
    font-weight: 600;
    color: var(--mn-ink-700);
}

.bodytext {
    line-height: var(--mn-leading);
    overflow-x: auto;
    word-break: normal;
}

.nv-fullbg {
    background-color: transparent;
    min-height: 0;
}

.box-shadow {
    box-shadow: var(--mn-shadow-sm);
}

.nv-list-item li {
    padding: 6px 0;
}

.module-menu {
    background: transparent;
    border-radius: var(--mn-radius);
    float: none;
    margin-bottom: var(--mn-space-5);
    overflow: hidden;
    border: 1px solid var(--mn-line);
}

.module-menu a {
    background: #fff;
    background-image: none;
    border-bottom: 1px solid var(--mn-line);
    color: var(--mn-ink-900);
    font-weight: 600;
    padding: 12px 16px;
}

.module-menu a:hover,
.module-menu a:focus,
.module-menu a.active {
    background: var(--mn-blue-50);
    background-image: none;
    color: var(--mn-blue-800);
}

.cookie-notice {
    font-size: var(--mn-text-sm);
}

.cookie-notice div {
    border-radius: var(--mn-radius);
}

.chromeframe,
#timeoutsess {
    height: auto;
    line-height: 1.5;
    padding: 8px 12px;
    background-color: var(--mn-yellow-400) !important;
}

.nv-alert {
    max-width: calc(100% - 32px);
    border-radius: var(--mn-radius);
    box-shadow: var(--mn-shadow-lg);
}

/* Hộp nổi #tip / #ftip (các block thành viên, liên hệ, mạng xã hội của lõi dùng) */
.mn-tipwrap {
    position: relative;
}

#tip,
#ftip {
    display: none;
    position: absolute;
    z-index: 1200;
    width: min(360px, calc(100vw - 32px));
    background: #fff;
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius);
    box-shadow: var(--mn-shadow-lg);
    color: var(--mn-ink-900);
    font-size: var(--mn-text-sm);
}

#tip {
    right: var(--mn-gutter);
    top: 4px;
}

#ftip {
    left: 0;
    bottom: 100%;
}

#tip .bg,
#ftip .bg {
    background: transparent;
    padding: 16px;
    border-radius: var(--mn-radius);
}

#tip a,
#ftip a {
    color: var(--mn-link);
}

/* ==========================================================================
   04. Khung trang
   ========================================================================== */

.mn-container {
    width: 100%;
    max-width: var(--mn-container);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--mn-gutter);
    padding-right: var(--mn-gutter);
}

@media (max-width: 575.98px) {
    :root {
        --mn-gutter: 16px;
        --mn-gap: 16px;
    }
}

.mn-header {
    position: relative;
    z-index: 100;
    background: var(--mn-surface);
}

/* Thanh tiện ích (nền tối: đổi cả biến màu liên kết để mọi thành phần dùng var(--mn-link) đều đọc được) */
.mn-topbar {
    --mn-focus: var(--mn-yellow-400);
    --mn-link: #fff;
    --mn-link-hover: var(--mn-yellow-400);
    background: var(--mn-blue-800);
    color: #fff;
    font-size: var(--mn-text-sm);
}

.mn-topbar__in {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mn-space-4);
    min-height: 48px;
    padding-top: 4px;
    padding-bottom: 4px;
}

.mn-topbar__place {
    margin: 0;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mn-topbar__place .fa {
    color: var(--mn-yellow-400);
    margin-right: 4px;
}

.mn-topbar__tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--mn-space-3);
    flex: 1 1 auto;
    min-width: 0;
}

.mn-topbar__blocks {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--mn-space-3);
}

.mn-topbar__blocks:empty {
    display: none;
}

.mn-topbar a:not(.mn-btn):not(.mn-badge) {
    color: #fff;
}

.mn-topbar a:not(.mn-btn):not(.mn-badge):hover,
.mn-topbar a:not(.mn-btn):not(.mn-badge):focus {
    color: var(--mn-yellow-400);
}

/* Nút trong thanh tiện ích không xuống dòng; block HTML tự do lấy màu chữ của thanh */
.mn-topbar .mn-btn {
    white-space: nowrap;
}

.mn-topbar .mn-prose,
.mn-topbar .mn-htmlblock {
    max-width: none;
    color: inherit;
    font-size: inherit;
    line-height: 1.4;
}

.mn-topbar .mn-prose p {
    margin: 0 !important;
}

/* Màn hình rất hẹp: nút có biểu tượng chỉ còn biểu tượng (nhãn vẫn dành cho trình đọc màn hình), ô tìm kiếm đủ rộng */
@media (max-width: 479.98px) {
    .mn-topbar .mn-btn--has-icon {
        min-width: 44px;
        padding-left: 10px;
        padding-right: 10px;
    }

    .mn-topbar .mn-btn--has-icon > .mn-btn__label {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .mn-topbar .mn-search {
        min-width: 150px;
    }
}

/* Ô tìm kiếm */
.mn-search {
    position: relative;
    display: flex;
    align-items: center;
    flex: 0 1 260px;
    min-width: 0;
    margin: 0;
}

.mn-search__input {
    width: 100%;
    height: 44px;
    padding: 6px 46px 6px 16px;
    background: #fff;
    border: 2px solid transparent;
    border-radius: var(--mn-radius-pill);
    color: var(--mn-ink-900);
    font-size: 1rem;
    line-height: 1.4;
    -webkit-appearance: none;
    appearance: none;
}

.mn-search__input::placeholder {
    color: var(--mn-ink-500);
    opacity: 1;
}

.mn-search__input:focus {
    border-color: var(--mn-yellow-400);
}

.mn-search__btn {
    position: absolute;
    right: 0;
    top: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0 var(--mn-radius-pill) var(--mn-radius-pill) 0;
    color: var(--mn-blue-700);
    cursor: pointer;
    font-size: 1.0625rem;
}

.mn-search__btn:hover {
    color: var(--mn-blue-900);
}

.mn-search--page {
    flex: none;
    max-width: 440px;
    margin: 0 auto;
}

.mn-search--page .mn-search__input {
    height: 48px;
    border-color: var(--mn-line-strong);
}

.mn-search--page .mn-search__input:focus {
    border-color: var(--mn-blue-600);
}

.mn-search--page .mn-search__btn {
    height: 48px;
    width: 52px;
}

/* Hàng nhận diện */
.mn-brandbar {
    background: var(--mn-surface);
}

.mn-brandbar__in {
    display: flex;
    align-items: center;
    gap: var(--mn-space-4);
    padding-top: 14px;
    padding-bottom: 14px;
}

.mn-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1 1 auto;
    min-width: 0;
}

.mn-brand__mark {
    flex: none;
    display: block;
    line-height: 0;
}

.mn-brand__logo {
    display: block;
    height: 72px;
    width: auto;
    max-width: none;
}

.mn-brand__text {
    min-width: 0;
}

.mn-brand__kicker {
    margin: 0 0 2px;
    color: var(--mn-green-700);
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.3;
    text-transform: uppercase;
}

.mn-brand__name {
    margin: 0;
    font-size: clamp(1.125rem, 0.85rem + 1.35vw, 1.75rem);
    font-weight: 800;
    /* tên trường viết hoa ở đầu trang (yêu cầu của nhà trường) */
    text-transform: uppercase;
    letter-spacing: 0.005em;
    line-height: 1.15;
}

.mn-brand__name a {
    /* vùng chạm cao tối thiểu 44px, lề âm để chiều cao hàng nhận diện không đổi */
    display: inline-block;
    padding: 12px 0;
    margin: -12px 0;
    color: var(--mn-blue-700);
    text-decoration: none;
}

.mn-brand__name a:hover,
.mn-brand__name a:focus {
    color: var(--mn-blue-900);
}

.mn-brand__desc {
    margin: 3px 0 0;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
    line-height: 1.35;
}

.mn-brandbar__quick {
    flex: none;
}

.mn-brandbar__quick:empty {
    display: none;
}

/* Nút mở trình đơn (màn hình hẹp, khi có JavaScript) */
.mn-menu-toggle {
    display: none;
    flex: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-width: 64px;
    min-height: 52px;
    padding: 6px 10px;
    background: var(--mn-blue-700);
    border: 0;
    border-radius: var(--mn-radius);
    color: #fff;
    cursor: pointer;
    font-size: 0.8125rem;
    font-weight: 800;
    line-height: 1;
}

.mn-menu-toggle:hover {
    background: var(--mn-blue-900);
}

.mn-menu-toggle__icon {
    position: relative;
    display: block;
    width: 24px;
    height: 16px;
    border-top: 3px solid currentColor;
    border-bottom: 3px solid currentColor;
}

.mn-menu-toggle__icon span {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 3px;
    margin-top: -1.5px;
    background: currentColor;
}

/* Dải bốn màu theo logo */
.mn-ribbon {
    display: flex;
    height: 6px;
}

.mn-ribbon span {
    flex: 1 1 25%;
}

.mn-ribbon span:nth-child(1) {
    background: var(--mn-blue-600);
}

.mn-ribbon span:nth-child(2) {
    background: var(--mn-yellow-400);
}

.mn-ribbon span:nth-child(3) {
    background: var(--mn-green-600);
}

.mn-ribbon span:nth-child(4) {
    background: var(--mn-pink-600);
}

@media (max-width: 991.98px) {
    .mn-brandbar__quick {
        display: none;
    }

    .mn-brand__desc {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .mn-topbar__place {
        display: none;
    }

    .mn-topbar__tools {
        justify-content: space-between;
    }

    .mn-search {
        flex: 1 1 auto;
    }

    .mn-brandbar__in {
        padding-top: 10px;
        padding-bottom: 10px;
        gap: var(--mn-space-3);
    }

    .mn-brand {
        gap: 10px;
    }

    .mn-brand__logo {
        height: 52px;
    }

    .mn-brand__kicker {
        font-size: 0.6875rem;
        letter-spacing: 0.06em;
    }

    .mn-brand__name {
        font-size: 1.125rem;
    }
}

/* ==========================================================================
   05. Trình đơn chính
   ========================================================================== */

.mn-navbar {
    --mn-focus: var(--mn-yellow-400);
    background: var(--mn-blue-700);
}

.mn-nav__head {
    display: none;
}

.mn-nav__list,
.mn-nav__sub {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-nav__list {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -8px;
}

.mn-nav__item {
    position: relative;
    display: flex;
    align-items: stretch;
}

.mn-nav__link {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 52px;
    padding: 8px 14px;
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
}

.mn-nav__item--has-sub > .mn-nav__link {
    padding-right: 4px;
}

.mn-nav__link:hover,
.mn-nav__link:focus,
.mn-nav__item.is-open > .mn-nav__link {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    text-decoration: none;
}

.mn-nav__item.is-active > .mn-nav__link {
    box-shadow: inset 0 -4px 0 var(--mn-yellow-400);
}

.mn-nav__icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

.mn-nav__subtoggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 32px;
    padding: 0 8px 0 4px;
    background: transparent;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-size: 1.125rem;
}

.mn-nav__subtoggle--label {
    padding: 8px 14px;
    font-size: 1rem;
}

.mn-nav__subtoggle:hover,
.mn-nav__item.is-open > .mn-nav__subtoggle {
    background: rgba(255, 255, 255, 0.14);
}

.mn-nav__subtoggle .fa {
    transition: transform 0.2s var(--mn-ease);
}

.mn-nav__subtoggle[aria-expanded='true'] .fa {
    transform: rotate(180deg);
}

/* Máy tính: danh sách con thả xuống */
@media (min-width: 992px) {
    .mn-nav__sub--l1 {
        display: none;
        position: absolute;
        left: 0;
        top: 100%;
        z-index: 120;
        min-width: 280px;
        max-width: 400px;
        max-height: calc(100vh - 220px);
        overflow-y: auto;
        padding: 8px;
        background: #fff;
        border-radius: 0 0 var(--mn-radius) var(--mn-radius);
        box-shadow: var(--mn-shadow-lg);
        --mn-focus: var(--mn-blue-700);
    }

    .mn-nav__sub--l1.is-right {
        left: auto;
        right: 0;
    }

    .mn-nav__item.is-open > .mn-nav__sub--l1,
    html:not(.mn-js) .mn-nav__item--has-sub:hover > .mn-nav__sub--l1,
    html:not(.mn-js) .mn-nav__item--has-sub:focus-within > .mn-nav__sub--l1 {
        display: block;
    }

    .mn-nav__subitem {
        display: block;
    }

    .mn-nav__sublink {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        min-height: 44px;
        padding: 8px 12px;
        background: transparent;
        border: 0;
        border-radius: var(--mn-radius-sm);
        color: var(--mn-ink-900);
        font-size: 1rem;
        font-weight: 600;
        line-height: 1.35;
        text-align: left;
        text-decoration: none;
    }

    .mn-nav__sublink:hover,
    .mn-nav__sublink:focus {
        background: var(--mn-blue-50);
        color: var(--mn-blue-800);
    }

    .mn-nav__subitem.is-active > .mn-nav__sublink {
        background: var(--mn-blue-50);
        color: var(--mn-blue-800);
        box-shadow: inset 4px 0 0 var(--mn-yellow-400);
    }

    /* Cấp 3 trở đi: hiển thị sẵn, thụt vào, không cần nút mở */
    .mn-nav__sub .mn-nav__subtoggle:not(.mn-nav__subtoggle--label) {
        display: none;
    }

    .mn-nav__sub .mn-nav__subtoggle--label {
        cursor: default;
        color: var(--mn-ink-600);
        font-weight: 800;
    }

    .mn-nav__sub .mn-nav__subtoggle--label .fa {
        display: none;
    }

    .mn-nav__sub .mn-nav__sub {
        margin: 0 0 4px 14px;
        padding-left: 8px;
        border-left: 2px solid var(--mn-blue-100);
    }

    .mn-nav__sub .mn-nav__sub .mn-nav__sublink {
        font-weight: 400;
        min-height: 40px;
    }
}

/* Màn hình hẹp */
@media (max-width: 991.98px) {
    /* Không có JavaScript: trình đơn hiển thị ngay dưới phần đầu trang, mở sẵn mọi cấp */
    .mn-nav__list {
        display: block;
        margin: 0;
        padding: 6px 0;
    }

    .mn-nav__item,
    .mn-nav__subitem {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
    }

    .mn-nav__link,
    .mn-nav__sublink {
        display: flex;
        align-items: center;
        gap: 8px;
        flex: 1 1 0;
        min-width: 0;
        min-height: 48px;
        padding: 10px 12px;
        background: transparent;
        border: 0;
        color: #fff;
        font-size: 1rem;
        font-weight: 700;
        line-height: 1.35;
        text-align: left;
        text-decoration: none;
    }

    .mn-nav__sublink {
        font-weight: 400;
    }

    .mn-nav__sub {
        flex: 0 0 100%;
        padding-left: 16px;
    }

    .mn-nav__subtoggle:not(.mn-nav__subtoggle--label) {
        display: none;
    }

    .mn-nav__item.is-active > .mn-nav__link {
        box-shadow: inset 4px 0 0 var(--mn-yellow-400);
    }

    /* Có JavaScript: ngăn kéo trượt từ bên phải */
    .mn-js .mn-menu-toggle:not([hidden]) {
        display: flex;
    }

    .mn-js .mn-nav[data-mn-nav] {
        --mn-focus: var(--mn-blue-700);
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 1100;
        display: flex;
        flex-direction: column;
        width: min(88vw, 380px);
        background: #fff;
        box-shadow: var(--mn-shadow-lg);
        overflow-y: auto;
        overscroll-behavior: contain;
        transform: translateX(105%);
        visibility: hidden;
        transition: transform 0.25s var(--mn-ease), visibility 0s linear 0.25s;
    }

    .mn-js .mn-nav[data-mn-nav].is-open {
        transform: none;
        visibility: visible;
        transition: transform 0.25s var(--mn-ease), visibility 0s;
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        position: sticky;
        top: 0;
        z-index: 2;
        padding: 10px 10px 10px 18px;
        background: var(--mn-blue-700);
        color: #fff;
    }

    .mn-nav__heading {
        margin: 0;
        color: #fff;
        font-size: 1.125rem;
        font-weight: 800;
    }

    .mn-nav__close {
        --mn-focus: var(--mn-yellow-400);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        background: rgba(255, 255, 255, 0.14);
        border: 0;
        border-radius: 50%;
        color: #fff;
        cursor: pointer;
        font-size: 1.25rem;
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__list {
        padding: 8px 10px 24px;
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__item {
        border-bottom: 1px solid var(--mn-line);
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__link,
    .mn-js .mn-nav[data-mn-nav] .mn-nav__sublink {
        color: var(--mn-ink-900);
        min-height: 52px;
        border-radius: var(--mn-radius-sm);
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__link:hover,
    .mn-js .mn-nav[data-mn-nav] .mn-nav__sublink:hover {
        background: var(--mn-blue-50);
        color: var(--mn-blue-800);
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__item.is-active > .mn-nav__link,
    .mn-js .mn-nav[data-mn-nav] .mn-nav__subitem.is-active > .mn-nav__sublink {
        color: var(--mn-blue-800);
        background: var(--mn-blue-50);
        box-shadow: inset 4px 0 0 var(--mn-yellow-500);
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__subtoggle {
        display: flex;
        flex: 0 0 52px;
        min-height: 52px;
        padding: 0;
        color: var(--mn-blue-700);
        border-left: 1px solid var(--mn-line);
        font-size: 1.375rem;
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__subtoggle--label {
        flex: 1 1 0;
        justify-content: space-between;
        padding: 10px 16px 10px 12px;
        border-left: 0;
        color: var(--mn-ink-900);
        font-size: 1rem;
        font-weight: 700;
        text-align: left;
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__subtoggle:hover,
    .mn-js .mn-nav[data-mn-nav] .is-open > .mn-nav__subtoggle {
        background: var(--mn-blue-50);
    }

    .mn-js .mn-nav[data-mn-nav] .mn-nav__sub {
        display: none;
        margin: 0 0 8px;
        padding: 4px 0 4px 12px;
        border-left: 3px solid var(--mn-blue-100);
    }

    .mn-js .mn-nav[data-mn-nav] .is-open > .mn-nav__sub {
        display: block;
    }

    .mn-nav-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1090;
        background: rgba(10, 42, 94, 0.6);
    }
}

/* ==========================================================================
   06. Đường dẫn trang, vùng nội dung, bố cục
   ========================================================================== */

.mn-page {
    min-height: 40vh;
}

.mn-breadcrumb {
    padding: 8px 0 0;
    font-size: var(--mn-text-sm);
}

.mn-breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-breadcrumb__list li {
    display: flex;
    align-items: center;
    min-width: 0;
}

.mn-breadcrumb__list li + li::before {
    content: '';
    width: 7px;
    height: 7px;
    margin: 0 10px 0 8px;
    border-right: 2px solid var(--mn-ink-500);
    border-top: 2px solid var(--mn-ink-500);
    transform: rotate(45deg);
    flex: none;
}

.mn-breadcrumb__list a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 0;
    color: var(--mn-ink-700);
    font-weight: 600;
}

.mn-breadcrumb__list a:hover,
.mn-breadcrumb__list a:focus {
    color: var(--mn-blue-700);
}

.mn-breadcrumb__list [aria-current='page'] {
    color: var(--mn-ink-900);
}

.mn-main {
    display: block;
    padding: var(--mn-space-5) 0 var(--mn-space-7);
}

.mn-is-home .mn-main {
    padding-top: var(--mn-space-5);
}

.mn-zone:empty,
.mn-home__zone:empty,
.mn-home__content:empty {
    display: none;
}

/* Các block đặt ở vùng trên/dưới nội dung: cách đều nhau và cách nội dung module.
   Khoảng cách với nội dung đặt trên chính vùng chứa (vùng rỗng đã bị ẩn), khoảng cách giữa các block dùng bộ chọn có
   #mn-main để không quy tắc lề nào của thành phần bên trong (.mn-section:last-child, .mn-notice...) ghi đè được. */
.mn-zone--top,
.mn-zone--before {
    margin-bottom: var(--mn-space-5);
}

.mn-zone--bottom,
.mn-zone--after {
    margin-top: var(--mn-space-6);
}

#mn-main .mn-zone > *,
#mn-main .mn-home__zone > * {
    margin-top: 0;
    margin-bottom: 0;
}

#mn-main .mn-zone > * + * {
    margin-top: var(--mn-space-5);
}

.mn-content__body > *:last-child {
    margin-bottom: 0;
}

.mn-home > * + * {
    margin-top: var(--mn-space-7);
}

#mn-main .mn-home__zone > * + * {
    margin-top: var(--mn-space-7);
}

.mn-simple {
    /* trang bố cục tối giản (cửa sổ bật lên, bản in): mẫu của module tự căn lề */
    padding: 0;
}

/* Nội dung + cột bên */
.mn-split {
    display: flex;
    align-items: flex-start;
    gap: var(--mn-space-6);
}

.mn-split__main {
    flex: 1 1 0;
    min-width: 0;
}

.mn-split__aside {
    flex: 0 0 320px;
    min-width: 0;
}

.mn-split__aside:empty {
    display: none;
}

/* Các khối trong cột bên xếp chồng, cách nhau 24px (bộ chọn có #mn-main: lề riêng của khối bên trong không ghi đè) */
#mn-main .mn-split__aside > * {
    margin-top: 0;
    margin-bottom: 0;
}

#mn-main .mn-split__aside > * + * {
    margin-top: var(--mn-space-5);
}

.mn-split--narrow > .mn-split__aside {
    flex-basis: 260px;
}

@media (max-width: 991.98px) {
    .mn-split {
        flex-direction: column;
        align-items: stretch;
    }

    .mn-split__aside,
    .mn-split--narrow > .mn-split__aside {
        flex: 1 1 auto;
        width: 100%;
    }
}

/* Lưới */
.mn-grid {
    display: grid;
    gap: var(--mn-gap);
    grid-template-columns: minmax(0, 1fr);
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-grid > * {
    min-width: 0;
}

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

@media (min-width: 992px) {
    .mn-grid--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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

    /* Trong cột nội dung có cột bên: bớt một cột cho dễ đọc. Không áp dụng khi cột bên không có gì:
       bố cục main-right không có block ở cột bên được theme.php đánh dấu .mn-split--full */
    .mn-split:not(.mn-split--full) > .mn-split__main .mn-grid--3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mn-split:not(.mn-split--full) > .mn-split__main .mn-grid--4 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    /* .mn-split do module tự dựng mà cột bên rỗng (đã bị ẩn): giữ đủ số cột */
    .mn-split:has(> .mn-split__aside:empty) > .mn-split__main .mn-grid--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .mn-split:has(> .mn-split__aside:empty) > .mn-split__main .mn-grid--4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Thẻ trong lưới cao bằng nhau theo hàng */
.mn-grid > li > .mn-card,
.mn-grid > div > .mn-card {
    height: 100%;
}

.mn-grid--auto {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr));
}

.mn-stack > * {
    margin-top: 0;
    margin-bottom: 0;
}

.mn-stack > * + * {
    margin-top: var(--mn-space-5);
}

.mn-stack--sm > * + * {
    margin-top: var(--mn-space-3);
}

.mn-stack--lg > * + * {
    margin-top: var(--mn-space-7);
}

.mn-cluster {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--mn-space-2) var(--mn-space-3);
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ==========================================================================
   07. Chân trang
   ========================================================================== */

/* Nền tối: đổi biến màu liên kết/tiêu điểm cho cả vùng. Mọi thành phần lấy màu liên kết qua var(--mn-link)
   (kể cả .mn-prose của block HTML tự do, khai báo ở mục 20) nhờ vậy luôn đủ tương phản trên nền chân trang. */
.mn-footer {
    --mn-focus: var(--mn-yellow-400);
    --mn-link: #fff;
    --mn-link-hover: var(--mn-yellow-400);
    --mn-link-line: rgba(255, 255, 255, 0.45);
    background: var(--mn-blue-900);
    color: #fff;
    font-size: 1rem;
}

.mn-footer a:not(.mn-btn):not(.mn-badge) {
    color: var(--mn-link);
    text-decoration: underline;
    text-decoration-color: var(--mn-link-line);
}

.mn-footer a:not(.mn-btn):not(.mn-badge):hover,
.mn-footer a:not(.mn-btn):not(.mn-badge):focus {
    color: var(--mn-link-hover);
    text-decoration-color: currentColor;
}

/* Khối nền sáng đặt trong chân trang (ghi chú, thẻ, dải thông báo, bảng...): trả lại màu chữ và màu liên kết thường dùng */
.mn-footer .mn-notice,
.mn-footer .mn-strip,
.mn-footer .mn-card,
.mn-footer .mn-list,
.mn-footer .mn-accordion,
.mn-footer .mn-table-wrap,
.mn-footer .panel,
.mn-footer .well,
.mn-footer .alert {
    --mn-focus: var(--mn-blue-700);
    --mn-link: var(--mn-blue-700);
    --mn-link-hover: var(--mn-blue-900);
    --mn-link-line: currentColor;
    color: var(--mn-ink-900);
}

.mn-footer__grid {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-6) var(--mn-space-7);
    padding: var(--mn-space-7) 0 var(--mn-space-6);
}

.mn-footer__col {
    flex: 1 1 200px;
    min-width: 0;
}

.mn-footer__col--about {
    flex: 1.3 1 300px;
}

/* Chân trang 3 khối: giới thiệu · các cơ sở (rộng, danh sách chia 2 cột) · liên hệ */
.mn-footer__col--sites {
    flex: 2 1 420px;
}

.mn-footer__col--contact {
    flex: 0.9 1 220px;
}

.mn-footer__col:empty,
.mn-footer__extra-item:empty,
.mn-footer__menu:empty {
    display: none;
}

/* Các block trong một cột chân trang xếp chồng, cách nhau 24px (lề riêng của block không ghi đè được) */
#mn-footer .mn-footer__col > * {
    margin-top: 0;
    margin-bottom: 0;
}

#mn-footer .mn-footer__col > * + * {
    margin-top: var(--mn-space-5);
}

.mn-footer__title,
.mn-footer h2,
.mn-footer h3,
.mn-footer .h3 {
    margin: 0 0 12px;
    color: var(--mn-yellow-400);
    font-size: 0.9375rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.mn-footer p {
    margin: 0 0 0.6em;
}

.mn-footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-footer li {
    padding: 4px 0;
}

/* Dòng có liên kết: phần đệm thuộc về liên kết để vùng chạm cao tối thiểu 44px */
.mn-footer li:has(a) {
    padding-top: 0;
    padding-bottom: 0;
}

.mn-footer li a {
    display: inline-block;
    padding: 10px 0;
}

.mn-footer__extra {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mn-space-5);
    position: relative;
}

.mn-footer__extra-item {
    flex: 1 1 280px;
    padding-bottom: var(--mn-space-5);
}

.mn-footer__bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    font-size: var(--mn-text-sm);
}

.mn-footer__bottom-in {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 24px;
    padding-top: 16px;
    padding-bottom: 16px;
    /* chừa chỗ cho nút lên đầu trang cố định ở góc phải dưới */
    padding-right: calc(var(--mn-gutter) + 60px);
}

.mn-footer__copy,
.mn-footer__credit {
    margin: 0 !important;
}

.mn-footer__credit {
    color: #D5E0F0;
}

/* Liên kết trong dòng cuối trang: nới vùng chạm lên 44px mà không đổi chiều cao của dòng */
.mn-footer__credit a,
.mn-footer__copy a {
    display: inline-block;
    padding: 10px 0;
    margin: -10px 0;
}

.mn-fnav__list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 20px;
}

.mn-about__brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
}

.mn-about__logo {
    flex: none;
    width: 84px;
    height: 84px;
    object-fit: contain;
    background: #fff;
    border-radius: 50%;
    padding: 4px;
}

.mn-about__name {
    margin: 0 !important;
    font-size: 1.1875rem;
    font-weight: 800;
    /* tên trường viết hoa ở chân trang (yêu cầu của nhà trường) */
    text-transform: uppercase;
    letter-spacing: 0.01em;
    line-height: 1.25;
    /* tên trường căn giữa trong phần còn lại bên cạnh logo */
    flex: 1 1 auto;
    text-align: center;
}

.mn-about__text {
    max-width: 62ch;
}

.mn-about__legal {
    margin-top: 10px;
    color: #D5E0F0;
    font-size: var(--mn-text-sm);
}

/* Văn bản của block HTML tự do trong chân trang lấy màu chữ của vùng chứa nó (chân trang, hoặc khối nền sáng ở trên) */
.mn-footer .mn-prose {
    max-width: none;
    color: inherit;
    font-size: 1rem;
    line-height: 1.6;
}

.mn-footer .mn-htmlblock {
    max-width: none;
    font-size: 1rem;
    line-height: 1.6;
}

.mn-footer .mn-prose p {
    margin-bottom: 0.6em !important;
}

/* Liên kết trong .mn-prose ở chân trang: cùng kiểu với mọi liên kết khác của chân trang (trắng, gạch chân mờ) */
.mn-footer .mn-prose a:not(.mn-btn):not(.mn-badge) {
    color: var(--mn-link);
    text-decoration-color: var(--mn-link-line);
}

.mn-footer .mn-prose a:not(.mn-btn):not(.mn-badge):hover,
.mn-footer .mn-prose a:not(.mn-btn):not(.mn-badge):focus {
    color: var(--mn-link-hover);
    text-decoration-color: currentColor;
}

.mn-footer .mn-prose li::marker {
    color: var(--mn-yellow-400);
}

/* Tiêu đề trong nội dung chân trang: h2, h3 màu vàng (như tiêu đề cột), h4-h6 màu trắng - không để màu chữ tối mặc định */
.mn-footer h4,
.mn-footer h5,
.mn-footer h6,
.mn-footer .mn-prose :is(h4, h5, h6) {
    color: #fff;
}

.mn-footer .mn-prose :is(h2, h3) {
    color: var(--mn-yellow-400);
    font-size: 0.9375rem;
}

/* Tiêu đề nằm trong khối nền sáng ở chân trang: không dùng kiểu chữ vàng/trắng của chân trang */
.mn-footer :is(.mn-notice, .mn-strip, .mn-card, .mn-list, .mn-accordion, .mn-table-wrap, .panel, .well, .alert) :is(h2, h3, h4, h5, h6, .h3) {
    color: var(--mn-blue-800);
    font-size: 1.125rem;
    letter-spacing: normal;
    text-transform: none;
}

.mn-footer :is(.mn-notice, .mn-strip, .mn-card, .mn-list, .mn-accordion, .mn-table-wrap, .panel, .well, .alert) li::marker {
    color: var(--mn-blue-600);
}

/* Khi block giới thiệu đặt ngoài chân trang */
.mn-card .mn-about__name {
    color: var(--mn-blue-700);
}

.mn-totop {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: var(--mn-yellow-400);
    border: 2px solid var(--mn-blue-900);
    border-radius: 50%;
    box-shadow: var(--mn-shadow);
    color: var(--mn-blue-900);
    cursor: pointer;
    font-size: 1.125rem;
}

.mn-totop:hover {
    background: #fff;
}

/* ==========================================================================
   08. Tiêu đề trang, khối
   ========================================================================== */

.mn-pagehead {
    position: relative;
    margin: 0 0 var(--mn-space-5);
    padding: 0 0 var(--mn-space-4);
    border-bottom: 1px solid var(--mn-line);
}

.mn-pagehead::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 96px;
    height: 5px;
    border-radius: var(--mn-radius-pill);
    background: linear-gradient(90deg, var(--mn-blue-600) 0 25%, var(--mn-yellow-400) 25% 50%, var(--mn-green-600) 50% 75%, var(--mn-pink-600) 75% 100%);
}

.mn-pagehead__kicker {
    margin: 0 0 6px;
    color: var(--mn-green-700);
    font-size: var(--mn-text-xs);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mn-pagehead__title {
    margin: 0;
    color: var(--mn-blue-800);
    font-size: clamp(1.625rem, 1.2rem + 1.8vw, 2.25rem);
    line-height: 1.2;
}

.mn-pagehead__lead {
    margin: 10px 0 0;
    max-width: 72ch;
    color: var(--mn-ink-700);
    font-size: 1.0625rem;
}

.mn-pagehead__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin: 12px 0 0;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
}

.mn-pagehead__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.mn-section {
    margin: 0 0 var(--mn-space-7);
}

.mn-section:last-child {
    margin-bottom: 0;
}

.mn-section__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px 16px;
    margin: 0 0 var(--mn-space-4);
}

.mn-section__title,
.mn-section__head > h2 {
    position: relative;
    margin: 0;
    padding-left: 16px;
    color: var(--mn-blue-800);
    font-size: clamp(1.375rem, 1.15rem + 1vw, 1.75rem);
    line-height: 1.25;
}

.mn-section__title::before,
.mn-section__head > h2::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.16em;
    bottom: 0.16em;
    width: 6px;
    border-radius: var(--mn-radius-pill);
    background: var(--mn-yellow-400);
}

.mn-section__title:empty {
    display: none;
}

.mn-section__title a,
.mn-section__head > h2 > a {
    /* vùng chạm cao tối thiểu 44px, lề âm để chiều cao tiêu đề không đổi */
    display: inline-block;
    padding: 9px 0;
    margin: -9px 0;
    color: inherit;
}

.mn-section__more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    color: var(--mn-blue-700);
    font-size: 1rem;
    font-weight: 700;
    white-space: nowrap;
}

.mn-section__lead {
    flex: 0 0 100%;
    margin: 0;
    color: var(--mn-ink-600);
}

.mn-section--tint {
    padding: var(--mn-space-6) var(--mn-space-5);
    background: var(--mn-bg-soft);
    border-radius: var(--mn-radius-lg);
}

.mn-section--blue {
    padding: var(--mn-space-6) var(--mn-space-5);
    background: var(--mn-blue-50);
    border-radius: var(--mn-radius-lg);
}

@media (max-width: 575.98px) {
    .mn-section--tint,
    .mn-section--blue {
        padding: var(--mn-space-5) var(--mn-space-4);
    }

    .mn-section {
        margin-bottom: var(--mn-space-6);
    }
}

.mn-block-simple__title {
    margin: 0 0 10px;
    font-size: 1.125rem;
}

/* ==========================================================================
   09. Thẻ
   ========================================================================== */

.mn-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-sm);
    overflow: hidden;
}

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

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

.mn-card__media--1x1 {
    aspect-ratio: 1 / 1;
}

.mn-card__media--4x3 {
    aspect-ratio: 4 / 3;
}

.mn-card__media--16x9 {
    aspect-ratio: 16 / 9;
}

.mn-card__media--contain img {
    object-fit: contain;
    padding: 12px;
}

.mn-card__media .mn-badge {
    position: absolute;
    left: 12px;
    top: 12px;
    z-index: 1;
}

.mn-card__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 8px;
    min-width: 0;
    padding: 18px 20px 20px;
}

.mn-card__body > * {
    margin: 0;
}

.mn-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.mn-card__title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 800;
    line-height: 1.35;
}

.mn-card__title a {
    color: var(--mn-ink-900);
    text-decoration: none;
}

.mn-card__title a:hover,
.mn-card__title a:focus {
    color: var(--mn-blue-700);
    text-decoration: underline;
}

.mn-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 12px;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-xs);
}

.mn-card__text {
    color: var(--mn-ink-700);
    font-size: 1rem;
}

.mn-card__foot {
    margin-top: auto !important;
    padding-top: 6px;
}

/* Cả thẻ bấm được: liên kết ở tiêu đề phủ toàn thẻ */
.mn-card--link .mn-card__title a::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
}

.mn-card--link {
    transition: box-shadow 0.2s var(--mn-ease), transform 0.2s var(--mn-ease), border-color 0.2s var(--mn-ease);
}

.mn-card--link:hover {
    border-color: var(--mn-blue-200);
    box-shadow: var(--mn-shadow);
    transform: translateY(-2px);
}

.mn-card--link:focus-within {
    border-color: var(--mn-blue-600);
}

.mn-card--link .mn-card__body a:not(.mn-card__title a),
.mn-card--link .mn-card__body button {
    position: relative;
    z-index: 2;
}

/* Thẻ ngang: ảnh bên trái */
.mn-card--row {
    flex-direction: row;
    align-items: stretch;
}

.mn-card--row > .mn-card__media {
    flex: 0 0 38%;
    max-width: 300px;
    aspect-ratio: auto;
    min-height: 150px;
}

.mn-card--row > .mn-card__media img {
    position: absolute;
    inset: 0;
}

@media (max-width: 575.98px) {
    .mn-card--row {
        flex-direction: column;
    }

    .mn-card--row > .mn-card__media {
        flex: none;
        max-width: none;
        aspect-ratio: 16 / 10;
        min-height: 0;
    }
}

/* Thẻ gọn: ảnh nhỏ vuông bên trái, dùng trong cột bên và danh sách phụ */
.mn-card--compact {
    flex-direction: row;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    border-radius: var(--mn-radius);
    box-shadow: none;
}

.mn-card--compact > .mn-card__media {
    flex: 0 0 88px;
    aspect-ratio: 1 / 1;
    border-radius: var(--mn-radius-sm);
}

.mn-card--compact > .mn-card__body {
    padding: 0;
    gap: 4px;
}

.mn-card--compact .mn-card__title {
    font-size: 1rem;
}

.mn-card--flat {
    box-shadow: none;
}

.mn-card--accent {
    border-top: 5px solid var(--mn-yellow-400);
}

/* Khung block (layout/block.mn-card.tpl, block.default.tpl) */
.mn-card--block {
    overflow: visible;
}

.mn-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 4px 12px;
    padding: 16px 20px 0;
}

.mn-card__heading {
    position: relative;
    margin: 0;
    padding-left: 14px;
    color: var(--mn-blue-800);
    font-size: 1.1875rem;
    line-height: 1.3;
}

.mn-card__heading::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0.15em;
    bottom: 0.15em;
    width: 5px;
    border-radius: var(--mn-radius-pill);
    background: var(--mn-yellow-400);
}

.mn-card__heading:empty {
    display: none;
}

.mn-card__heading a {
    display: inline-block;
    padding: 11px 0;
    margin: -11px 0;
    color: inherit;
}

.mn-card__head .mn-section__more {
    /* vùng chạm 44px; lề âm giữ nguyên chiều cao của phần đầu thẻ */
    min-height: 44px;
    margin: -6px 0;
    font-size: var(--mn-text-sm);
}

.mn-card--block > .mn-card__body {
    display: block;
    padding: 14px 20px 20px;
}

.mn-card--block > .mn-card__body > *:last-child {
    margin-bottom: 0;
}

/* ==========================================================================
   10. Nhãn
   ========================================================================== */

.mn-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    padding: 3px 11px;
    background: var(--mn-blue-50);
    border: 1px solid transparent;
    border-radius: var(--mn-radius-pill);
    color: var(--mn-blue-800);
    font-size: 0.8125rem;
    font-weight: 700;
    line-height: 1.45;
    text-decoration: none;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mn-badge:hover,
.mn-badge:focus {
    text-decoration: underline;
}

/* Cơ sở: nền màu riêng, chữ trắng */
.mn-badge--coso {
    background: var(--mn-coso-toan-truong);
    color: #fff;
}

.mn-badge--coso::before {
    content: '\f041';
    font: normal normal normal 12px/1 FontAwesome;
}

.mn-badge--coso-toan-truong {
    background: var(--mn-coso-toan-truong) !important;
}

.mn-badge--coso-toan-truong::before {
    content: '\f19c';
}

.mn-badge--coso-truong-chinh {
    background: var(--mn-coso-truong-chinh) !important;
}

.mn-badge--coso-hoa-hong {
    background: var(--mn-coso-hoa-hong) !important;
}

.mn-badge--coso-20-10 {
    background: var(--mn-coso-20-10) !important;
}

.mn-badge--coso-7-5 {
    background: var(--mn-coso-7-5) !important;
}

.mn-badge--coso-thanh-binh {
    background: var(--mn-coso-thanh-binh) !important;
}

/* Loại nội dung */
.mn-badge--type {
    background: var(--mn-green-50);
    border-color: var(--mn-green-100);
    color: var(--mn-green-700);
}

/* Mới */
.mn-badge--new {
    background: var(--mn-red-600);
    color: #fff;
}

/* Ghim / quan trọng */
.mn-badge--pin {
    background: var(--mn-yellow-400);
    color: var(--mn-ink-900);
}

.mn-badge--pin::before {
    content: '\f08d';
    font: normal normal normal 12px/1 FontAwesome;
}

/* Tư liệu trước sắp xếp */
.mn-badge--legacy {
    background: #F1ECE0;
    border: 1px dashed #8A7A55;
    color: #5B4A1E;
}

.mn-badge--legacy::before {
    content: '\f187';
    font: normal normal normal 12px/1 FontAwesome;
}

/* Trạng thái */
.mn-badge--status {
    background: #EEF0F3;
    border-color: #C9CED6;
    color: var(--mn-ink-700);
}

.mn-badge--status-published,
.mn-badge--status-2 {
    background: var(--mn-green-50);
    border-color: var(--mn-green-100);
    color: var(--mn-green-700);
}

.mn-badge--status-pending,
.mn-badge--status-1,
.mn-badge--status-scheduled {
    background: var(--mn-yellow-50);
    border-color: var(--mn-yellow-500);
    color: #6B4E00;
}

.mn-badge--status-archived,
.mn-badge--status-3,
.mn-badge--status-expired {
    background: #F1ECE0;
    border-color: #CDBF9C;
    color: #5B4A1E;
}

.mn-badge--status-hidden,
.mn-badge--status-4 {
    background: var(--mn-red-50);
    border-color: #F6C6C9;
    color: var(--mn-red-700);
}

.mn-badge--outline {
    background: transparent;
    border-color: currentColor;
}

.mn-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ==========================================================================
   11. Nút và liên kết nhanh
   ========================================================================== */

.mn-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 8px 22px;
    background: var(--mn-blue-600);
    border: 2px solid var(--mn-blue-600);
    border-radius: var(--mn-radius-pill);
    color: #fff;
    cursor: pointer;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.15s var(--mn-ease), border-color 0.15s var(--mn-ease), color 0.15s var(--mn-ease);
}

.mn-btn:hover,
.mn-btn:focus {
    background: var(--mn-blue-800);
    border-color: var(--mn-blue-800);
    color: #fff;
    text-decoration: none;
}

.mn-btn--primary {
    background: var(--mn-blue-600);
    border-color: var(--mn-blue-600);
    color: #fff;
}

.mn-btn--secondary {
    background: #fff;
    border-color: var(--mn-blue-600);
    color: var(--mn-blue-700);
}

.mn-btn--secondary:hover,
.mn-btn--secondary:focus {
    background: var(--mn-blue-50);
    border-color: var(--mn-blue-800);
    color: var(--mn-blue-800);
}

.mn-btn--ghost {
    background: transparent;
    border-color: transparent;
    color: var(--mn-blue-700);
    padding-left: 14px;
    padding-right: 14px;
}

.mn-btn--ghost:hover,
.mn-btn--ghost:focus {
    background: var(--mn-blue-50);
    border-color: var(--mn-blue-50);
    color: var(--mn-blue-800);
}

.mn-btn--accent {
    background: var(--mn-yellow-400);
    border-color: var(--mn-yellow-400);
    color: var(--mn-ink-900);
}

.mn-btn--accent:hover,
.mn-btn--accent:focus {
    background: var(--mn-yellow-500);
    border-color: var(--mn-yellow-500);
    color: var(--mn-ink-900);
}

.mn-btn--green {
    background: var(--mn-green-700);
    border-color: var(--mn-green-700);
    color: #fff;
}

.mn-btn--green:hover,
.mn-btn--green:focus {
    background: #0F5E20;
    border-color: #0F5E20;
    color: #fff;
}

.mn-btn--pink {
    background: var(--mn-pink-600);
    border-color: var(--mn-pink-600);
    color: #fff;
}

.mn-btn--pink:hover,
.mn-btn--pink:focus {
    background: var(--mn-pink-700);
    border-color: var(--mn-pink-700);
    color: #fff;
}

.mn-btn--danger {
    background: var(--mn-red-600);
    border-color: var(--mn-red-600);
    color: #fff;
}

.mn-btn--danger:hover,
.mn-btn--danger:focus {
    background: var(--mn-red-700);
    border-color: var(--mn-red-700);
    color: #fff;
}

.mn-btn--sm {
    min-height: 44px;
    padding: 6px 16px;
    font-size: var(--mn-text-sm);
}

.mn-btn--lg {
    min-height: 52px;
    padding: 12px 28px;
    font-size: 1.0625rem;
}

.mn-btn--block {
    display: flex;
    width: 100%;
}

.mn-btn--icon {
    min-width: 44px;
    padding-left: 10px;
    padding-right: 10px;
}

.mn-btn[disabled],
.mn-btn[aria-disabled='true'] {
    cursor: not-allowed;
    opacity: 0.6;
}

/* Trên nền tối (thanh tiện ích, chân trang) */
.mn-topbar .mn-btn--ghost,
.mn-footer .mn-btn--ghost {
    color: #fff;
    text-decoration: none;
}

.mn-topbar .mn-btn--ghost:hover,
.mn-footer .mn-btn--ghost:hover {
    background: rgba(255, 255, 255, 0.14);
    border-color: transparent;
    color: #fff;
}

.mn-footer .mn-btn {
    text-decoration: none;
}

.mn-footer .mn-btn--accent,
.mn-footer .mn-btn--accent:hover {
    color: var(--mn-ink-900);
}

.mn-footer .mn-btn--secondary,
.mn-footer .mn-btn--secondary:hover {
    color: var(--mn-blue-800);
}

/* Hàng nút hành động (in, chia sẻ...) */
.mn-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Liên kết nhanh dạng nút (block global.mn_quick, vị trí HEAD_QUICK) */
.mn-quicklinks__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ==========================================================================
   12. Danh sách
   ========================================================================== */

.mn-list {
    list-style: none;
    margin: 0;
    padding: 0;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-sm);
}

.mn-list__item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
}

.mn-list__item + .mn-list__item {
    border-top: 1px solid var(--mn-line);
}

.mn-list__icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--mn-blue-50);
    border-radius: 12px;
    color: var(--mn-blue-700);
    font-size: 1.25rem;
}

.mn-list__body {
    flex: 1 1 0;
    min-width: 0;
}

.mn-list__title {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.4;
}

.mn-list__title a {
    /* vùng chạm cao tối thiểu 44px, lề âm để chiều cao dòng tiêu đề không đổi */
    display: inline-block;
    padding: 11px 0;
    margin: -11px 0;
    color: var(--mn-ink-900);
}

.mn-list__title a:hover,
.mn-list__title a:focus {
    color: var(--mn-blue-700);
}

.mn-list__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 12px;
    margin: 6px 0 0;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-xs);
}

.mn-list__text {
    margin: 6px 0 0;
    color: var(--mn-ink-700);
    font-size: 1rem;
}

.mn-list__actions {
    flex: none;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-self: center;
}

.mn-list--plain {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.mn-list--plain > .mn-list__item {
    padding-left: 0;
    padding-right: 0;
}

.mn-list--compact > .mn-list__item {
    padding: 10px 16px;
}

@media (max-width: 575.98px) {
    .mn-list__item {
        flex-wrap: wrap;
        padding: 14px 16px;
    }

    .mn-list__actions {
        flex: 0 0 100%;
    }
}

/* Tệp đính kèm */
.mn-files {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-files__item,
.mn-files > li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
    padding: 12px 16px;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius);
}

.mn-files__item + .mn-files__item,
.mn-files > li + li {
    margin-top: 10px;
}

.mn-files__icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--mn-red-50);
    border-radius: 12px;
    color: var(--mn-red-600);
    font-size: 1.25rem;
}

.mn-files__name {
    flex: 1 1 200px;
    min-width: 0;
    font-weight: 700;
    line-height: 1.4;
}

.mn-files__meta {
    display: block;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-xs);
    font-weight: 400;
}

.mn-files__actions {
    flex: none;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.mn-files__preview {
    flex: 0 0 100%;
}

/* Bảng thông tin dạng danh sách định nghĩa */
.mn-meta {
    display: grid;
    grid-template-columns: minmax(120px, 220px) minmax(0, 1fr);
    margin: 0;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius);
    overflow: hidden;
}

.mn-meta > dt,
.mn-meta > dd {
    margin: 0;
    padding: 11px 16px;
    border-top: 1px solid var(--mn-line);
}

.mn-meta > dt {
    background: var(--mn-blue-50);
    color: var(--mn-blue-800);
    font-weight: 700;
}

.mn-meta > dt:first-of-type,
.mn-meta > dt:first-of-type + dd {
    border-top: 0;
}

@media (max-width: 575.98px) {
    .mn-meta {
        grid-template-columns: minmax(0, 1fr);
    }

    .mn-meta > dt {
        padding-bottom: 4px;
        background: transparent;
        font-size: var(--mn-text-xs);
    }

    .mn-meta > dd {
        border-top: 0;
        padding-top: 0;
    }

    .mn-meta > dt:first-of-type + dd {
        border-top: 0;
    }
}

/* Dòng thời gian */
.mn-timeline {
    list-style: none;
    margin: 0;
    padding: 0 0 0 8px;
}

.mn-timeline__item {
    position: relative;
    padding: 0 0 22px 28px;
    border-left: 3px solid var(--mn-blue-100);
}

.mn-timeline__item:last-child {
    border-left-color: transparent;
    padding-bottom: 0;
}

.mn-timeline__item::before {
    content: '';
    position: absolute;
    left: -10px;
    top: 4px;
    width: 17px;
    height: 17px;
    background: var(--mn-yellow-400);
    border: 3px solid var(--mn-blue-600);
    border-radius: 50%;
}

.mn-timeline__time {
    display: block;
    color: var(--mn-blue-700);
    font-size: var(--mn-text-sm);
    font-weight: 800;
}

.mn-timeline__title {
    margin: 2px 0 4px;
    font-size: 1.0625rem;
    font-weight: 700;
}

.mn-timeline__body > *:last-child {
    margin-bottom: 0;
}

/* Danh sách liên kết dọc (block trình đơn kiểu plain, cột bên) */
.mn-linklist ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-linklist__list > li + li {
    border-top: 1px solid var(--mn-line);
}

.mn-linklist a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 8px 0;
    color: var(--mn-ink-900);
    font-weight: 600;
}

.mn-linklist a:hover,
.mn-linklist a:focus,
.mn-linklist a[aria-current='page'] {
    color: var(--mn-blue-700);
}

.mn-linklist__sub {
    padding-left: 16px !important;
}

.mn-linklist__sub a {
    font-weight: 400;
    min-height: 44px;
}

.mn-footer .mn-linklist__list > li + li {
    border-top: 0;
}

.mn-footer .mn-linklist a {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    padding: 8px 0;
    color: #fff;
    font-weight: 400;
}

/* ==========================================================================
   13. Biểu mẫu, thanh lọc
   ========================================================================== */

.mn-filter {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px 16px;
    margin: 0 0 var(--mn-space-5);
    padding: 16px 20px;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-sm);
}

.mn-filter__field {
    flex: 1 1 180px;
    min-width: 0;
}

.mn-filter__field--wide {
    flex: 2 1 260px;
}

.mn-filter__field > label,
.mn-filter label {
    display: block;
    margin: 0 0 4px;
    color: var(--mn-ink-700);
    font-size: var(--mn-text-sm);
    font-weight: 700;
}

.mn-filter .form-control {
    width: 100%;
}

.mn-filter__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 0 0 auto;
}

.mn-filter__summary {
    flex: 0 0 100%;
    margin: 0;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
}

.mn-form {
    max-width: 720px;
}

.mn-field {
    margin: 0 0 18px;
}

.mn-label {
    display: block;
    margin: 0 0 6px;
    font-weight: 700;
}

.mn-label__text {
    display: block;
    margin-bottom: 6px;
}

.mn-req {
    color: var(--mn-red-600);
    font-weight: 800;
}

.mn-help {
    margin: 6px 0 0;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
}

.mn-field__error {
    margin: 6px 0 0;
    color: var(--mn-red-700);
    font-size: var(--mn-text-sm);
    font-weight: 700;
}

.mn-field__error::before {
    content: '\f06a';
    font: normal normal normal 14px/1 FontAwesome;
    margin-right: 6px;
}

.mn-field__error:empty {
    display: none;
}

/* ==========================================================================
   14. Bảng
   ========================================================================== */

.mn-table-wrap {
    margin: 0 0 var(--mn-space-5);
    overflow-x: auto;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius);
    -webkit-overflow-scrolling: touch;
}

.mn-table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    background: var(--mn-surface);
    font-size: 1rem;
}

.mn-table caption {
    padding: 14px 16px 10px;
    caption-side: top;
    color: var(--mn-blue-800);
    font-size: 1.0625rem;
    font-weight: 800;
    text-align: left;
}

.mn-table th,
.mn-table td {
    padding: 12px 16px;
    border-bottom: 1px solid var(--mn-line);
    line-height: 1.5;
    text-align: left;
    vertical-align: top;
}

.mn-table thead th {
    background: var(--mn-blue-50);
    border-bottom: 2px solid var(--mn-blue-200);
    color: var(--mn-blue-800);
    font-weight: 800;
    white-space: nowrap;
}

.mn-table tbody th {
    font-weight: 700;
}

.mn-table tbody tr:last-child > * {
    border-bottom: 0;
}

.mn-table--zebra tbody tr:nth-child(even) {
    background: var(--mn-bg);
}

.mn-table--compact th,
.mn-table--compact td {
    padding: 8px 12px;
}

.mn-table--bordered th,
.mn-table--bordered td {
    border: 1px solid var(--mn-line);
}

.mn-table .mn-num,
.mn-table td.text-right {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Bảng xếp chồng: mỗi dòng thành một thẻ trên màn hình < 640px (ô dùng data-label) */
@media (max-width: 639.98px) {
    .mn-table--stack,
    .mn-table--stack tbody,
    .mn-table--stack tr,
    .mn-table--stack td,
    .mn-table--stack th {
        display: block;
        width: 100%;
    }

    .mn-table--stack thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
    }

    .mn-table--stack tbody tr {
        margin: 0 0 12px;
        background: var(--mn-surface);
        border: 1px solid var(--mn-line);
        border-radius: var(--mn-radius);
        overflow: hidden;
    }

    .mn-table--stack tbody tr:last-child {
        margin-bottom: 0;
    }

    .mn-table--stack td,
    .mn-table--stack tbody th {
        padding: 9px 14px;
        border-bottom: 1px solid var(--mn-line);
        text-align: left;
    }

    .mn-table--stack td[data-label]::before,
    .mn-table--stack tbody th[data-label]::before {
        content: attr(data-label);
        display: block;
        color: var(--mn-ink-600);
        font-size: var(--mn-text-xs);
        font-weight: 700;
    }

    .mn-table-wrap--stack {
        background: transparent;
        border: 0;
        overflow: visible;
    }

    .mn-table-wrap--stack > .mn-table--stack {
        background: transparent;
    }
}

/* ==========================================================================
   15. Thông báo, trạng thái rỗng
   ========================================================================== */

.mn-notice {
    position: relative;
    margin: 0 0 var(--mn-space-5);
    padding: 14px 18px 14px 54px;
    background: var(--mn-blue-50);
    border: 1px solid var(--mn-blue-200);
    border-radius: var(--mn-radius);
    color: var(--mn-ink-900);
}

.mn-notice::before {
    content: '\f05a';
    position: absolute;
    left: 18px;
    top: 14px;
    color: var(--mn-blue-700);
    font: normal normal normal 22px/1.2 FontAwesome;
}

.mn-notice > *:last-child {
    margin-bottom: 0;
}

/* Đoạn rỗng (sinh ra khi lồng <p> trong <p>) không được đẩy chữ lệch khỏi biểu tượng */
.mn-notice > p:empty {
    display: none;
}

/* Kiểu thông tin (mặc định): .mn-notice--info là tên tường minh của kiểu gốc */
.mn-notice--info {
    background: var(--mn-blue-50);
    border-color: var(--mn-blue-200);
}

.mn-notice--info::before {
    content: '\f05a';
    color: var(--mn-blue-700);
}

.mn-notice__title {
    margin: 0 0 4px;
    font-size: 1.0625rem;
    font-weight: 800;
}

.mn-notice a:not(.mn-btn):not(.mn-badge) {
    font-weight: 700;
    text-decoration: underline;
}

.mn-notice--warn {
    background: var(--mn-yellow-50);
    border-color: var(--mn-yellow-500);
}

.mn-notice--warn::before {
    content: '\f071';
    color: #8A6500;
}

.mn-notice--legacy {
    background: #F6F1E4;
    border: 1px dashed #8A7A55;
    color: #3F3413;
}

.mn-notice--legacy::before {
    content: '\f187';
    color: #5B4A1E;
}

.mn-notice--success {
    background: var(--mn-green-50);
    border-color: var(--mn-green-100);
}

.mn-notice--success::before {
    content: '\f058';
    color: var(--mn-green-700);
}

.mn-notice--danger {
    background: var(--mn-red-50);
    border-color: #F6C6C9;
}

.mn-notice--danger::before {
    content: '\f06a';
    color: var(--mn-red-600);
}

.mn-updating,
.mn-empty {
    margin: 0 0 var(--mn-space-5);
    padding: 28px 20px;
    background: var(--mn-surface);
    border: 2px dashed var(--mn-line);
    border-radius: var(--mn-radius-lg);
    color: var(--mn-ink-600);
    font-size: 1.0625rem;
    font-weight: 600;
    text-align: center;
}

.mn-updating::before,
.mn-empty::before {
    content: '\f017';
    display: block;
    margin: 0 auto 8px;
    color: var(--mn-blue-200);
    font: normal normal normal 34px/1 FontAwesome;
}

.mn-empty::before {
    content: '\f115';
}

.mn-updating--inline {
    display: inline-block;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--mn-ink-600);
    font-size: inherit;
    font-style: italic;
    font-weight: 400;
    text-align: left;
}

.mn-updating--inline::before {
    display: none;
}

.mn-footer .mn-updating,
.mn-card--block .mn-updating,
.mn-card--block .mn-empty {
    margin: 0;
    padding: 14px;
    font-size: 1rem;
}

.mn-footer .mn-updating {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.35);
    color: #fff;
}

.mn-footer .mn-updating::before {
    display: none;
}

/* ==========================================================================
   16. Tab, accordion
   ========================================================================== */

.mn-tabs__list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    list-style: none;
    margin: 0 0 var(--mn-space-4);
    padding: 0 0 0;
    border-bottom: 2px solid var(--mn-line);
}

.mn-tabs__list > li {
    display: block;
    margin: 0;
    padding: 0;
}

.mn-tabs__tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    margin-bottom: -2px;
    padding: 8px 16px;
    background: transparent;
    border: 0;
    border-bottom: 4px solid transparent;
    border-radius: var(--mn-radius-sm) var(--mn-radius-sm) 0 0;
    color: var(--mn-ink-700);
    cursor: pointer;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
}

.mn-tabs__tab:hover,
.mn-tabs__tab:focus {
    background: var(--mn-blue-50);
    color: var(--mn-blue-800);
    text-decoration: none;
}

.mn-tabs__tab[aria-selected='true'],
.mn-tabs__tab.is-active {
    border-bottom-color: var(--mn-blue-600);
    color: var(--mn-blue-800);
}

.mn-tabs__panel[hidden] {
    display: none;
}

/* Không có JavaScript: các bảng nội dung hiện lần lượt, cách nhau một khoảng */
html:not(.mn-js) .mn-tabs__panel + .mn-tabs__panel {
    margin-top: var(--mn-space-6);
}

.mn-accordion {
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius);
}

.mn-accordion + .mn-accordion {
    margin-top: 10px;
}

.mn-accordion > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 52px;
    padding: 12px 18px;
    border-radius: var(--mn-radius);
    color: var(--mn-ink-900);
    cursor: pointer;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.4;
    list-style: none;
}

.mn-accordion > summary::-webkit-details-marker {
    display: none;
}

.mn-accordion > summary::after {
    content: '';
    flex: none;
    width: 11px;
    height: 11px;
    margin-right: 4px;
    border-right: 3px solid var(--mn-blue-600);
    border-bottom: 3px solid var(--mn-blue-600);
    transform: rotate(45deg) translate(-2px, -2px);
    transition: transform 0.2s var(--mn-ease);
}

.mn-accordion[open] > summary::after {
    transform: rotate(-135deg) translate(-2px, -2px);
}

.mn-accordion > summary:hover {
    background: var(--mn-blue-50);
}

.mn-accordion[open] > summary {
    border-bottom: 1px solid var(--mn-line);
    border-radius: var(--mn-radius) var(--mn-radius) 0 0;
    color: var(--mn-blue-800);
}

.mn-accordion__body {
    padding: 16px 18px 18px;
}

.mn-accordion__body > *:last-child {
    margin-bottom: 0;
}

/* ==========================================================================
   17. Thư viện ảnh, hộp xem ảnh, khung PDF, video
   ========================================================================== */

.mn-gallery {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

@media (min-width: 576px) {
    .mn-gallery {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 992px) {
    .mn-gallery {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.mn-gallery__item,
.mn-gallery > li > a {
    position: relative;
    display: block;
    aspect-ratio: 4 / 3;
    background: var(--mn-blue-50);
    border-radius: var(--mn-radius);
    overflow: hidden;
}

.mn-gallery__item img,
.mn-gallery > li > a img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s var(--mn-ease);
}

.mn-gallery__item:hover img,
.mn-gallery > li > a:hover img {
    transform: scale(1.04);
}

.mn-gallery__caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 22px 12px 8px;
    background: linear-gradient(180deg, rgba(10, 42, 94, 0) 0%, rgba(10, 42, 94, 0.85) 100%);
    color: #fff;
    font-size: var(--mn-text-xs);
    font-weight: 600;
    line-height: 1.35;
}

[data-mn-lightbox] {
    cursor: zoom-in;
}

.mn-lightbox {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 56px 12px 12px;
    background: rgba(7, 23, 52, 0.94);
    color: #fff;
    --mn-focus: var(--mn-yellow-400);
}

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

.mn-lightbox__img {
    display: block;
    max-width: 100%;
    max-height: calc(100vh - 150px);
    width: auto;
    height: auto;
    border-radius: var(--mn-radius-sm);
    background: #fff;
}

.mn-lightbox__caption {
    max-width: 80ch;
    margin: 10px 0 0;
    color: #fff;
    font-size: 1rem;
    text-align: center;
}

.mn-lightbox__counter {
    position: absolute;
    left: 16px;
    top: 14px;
    font-size: var(--mn-text-sm);
    font-weight: 700;
}

.mn-lightbox__btn {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, 0.16);
    border: 2px solid rgba(255, 255, 255, 0.6);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    font-size: 1.25rem;
}

.mn-lightbox__btn:hover {
    background: #fff;
    color: var(--mn-blue-900);
}

.mn-lightbox__close {
    right: 12px;
    top: 6px;
}

.mn-lightbox__prev {
    left: 12px;
    top: 50%;
    margin-top: -24px;
}

.mn-lightbox__next {
    right: 12px;
    top: 50%;
    margin-top: -24px;
}

.mn-lightbox.is-loading .mn-lightbox__img {
    opacity: 0.3;
}

/* Khung xem PDF: đặt lớp mn-pdf lên iframe hoặc lên thẻ bao iframe */
iframe.mn-pdf,
.mn-pdf > iframe {
    display: block;
    width: 100%;
    height: 70vh;
    min-height: 420px;
    background: #fff;
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius);
}

.mn-pdf {
    margin: 0 0 var(--mn-space-5);
}

/* Video / bản đồ nhúng tỉ lệ 16:9 */
.mn-video {
    position: relative;
    aspect-ratio: 16 / 9;
    margin: 0 0 var(--mn-space-5);
    background: var(--mn-blue-900);
    border-radius: var(--mn-radius);
    overflow: hidden;
}

.mn-video > iframe,
.mn-video > video,
.mn-video > embed,
.mn-video > object {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ==========================================================================
   18. Lịch, số liệu
   ========================================================================== */

.mn-calendar {
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-lg);
    overflow: hidden;
}

.mn-calendar__title {
    margin: 0;
    padding: 14px 18px;
    background: var(--mn-blue-700);
    color: #fff;
    font-size: 1.125rem;
    font-weight: 800;
}

.mn-calendar__head,
.mn-calendar__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-calendar__head > * {
    padding: 8px 6px;
    background: var(--mn-blue-50);
    color: var(--mn-blue-800);
    font-size: var(--mn-text-xs);
    font-weight: 800;
    text-align: center;
}

.mn-calendar__day {
    min-height: 104px;
    padding: 6px 8px 8px;
    border-top: 1px solid var(--mn-line);
    border-left: 1px solid var(--mn-line);
    min-width: 0;
}

.mn-calendar__day:nth-child(7n + 1) {
    border-left: 0;
}

.mn-calendar__day.is-out {
    background: var(--mn-bg);
    color: var(--mn-ink-500);
}

.mn-calendar__date {
    display: block;
    font-weight: 800;
    line-height: 1.4;
}

.mn-calendar__dow {
    display: none;
}

.mn-calendar__day.is-today .mn-calendar__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 30px;
    padding: 0 6px;
    background: var(--mn-yellow-400);
    border-radius: var(--mn-radius-pill);
    color: var(--mn-ink-900);
}

.mn-calendar__events {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
}

.mn-calendar__event {
    display: block;
    margin-top: 4px;
    padding: 5px 7px;
    background: var(--mn-blue-50);
    border-left: 4px solid var(--mn-blue-600);
    border-radius: 6px;
    color: var(--mn-ink-900);
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.35;
}

.mn-calendar__event--toan-truong {
    border-left-color: var(--mn-coso-toan-truong);
}

.mn-calendar__event--truong-chinh {
    border-left-color: var(--mn-coso-truong-chinh);
}

.mn-calendar__event--hoa-hong {
    border-left-color: var(--mn-coso-hoa-hong);
    background: var(--mn-pink-50);
}

.mn-calendar__event--20-10 {
    border-left-color: var(--mn-coso-20-10);
    background: var(--mn-orange-50);
}

.mn-calendar__event--7-5 {
    border-left-color: var(--mn-coso-7-5);
    background: var(--mn-red-50);
}

.mn-calendar__event--thanh-binh {
    border-left-color: var(--mn-coso-thanh-binh);
    background: var(--mn-green-50);
}

/* Điện thoại: lịch thành danh sách các ngày có sự kiện */
@media (max-width: 767.98px) {
    .mn-calendar__head {
        display: none;
    }

    .mn-calendar__grid {
        display: block;
    }

    .mn-calendar__day {
        display: none;
        min-height: 0;
        padding: 12px 16px;
        border-left: 0;
    }

    .mn-calendar__day.has-events,
    .mn-calendar__day.is-today {
        display: block;
    }

    .mn-calendar__day.is-out {
        display: none;
    }

    .mn-calendar__dow {
        display: inline;
    }

    .mn-calendar__event {
        display: flex;
        align-items: center;
        min-height: 44px;
        margin-top: 6px;
        padding: 8px 10px;
        font-size: 1rem;
    }
}

/* Số liệu nổi bật */
.mn-stats {
    display: grid;
    gap: var(--mn-gap);
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 18px 20px;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-lg);
    border-bottom: 5px solid var(--mn-yellow-400);
}

.mn-stat__value {
    color: var(--mn-blue-700);
    font-size: clamp(1.75rem, 1.3rem + 2vw, 2.5rem);
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.mn-stat__label {
    color: var(--mn-ink-900);
    font-weight: 700;
    line-height: 1.35;
}

.mn-stat__note {
    color: var(--mn-ink-600);
    font-size: var(--mn-text-xs);
    line-height: 1.4;
}

.mn-stat--green {
    border-bottom-color: var(--mn-green-600);
}

.mn-stat--pink {
    border-bottom-color: var(--mn-pink-600);
}

.mn-stat--blue {
    border-bottom-color: var(--mn-blue-600);
}

/* ==========================================================================
   19. Trang chủ
   ========================================================================== */

.mn-hero {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--mn-space-6);
    padding: clamp(24px, 4vw, 56px);
    background: linear-gradient(135deg, #FFFFFF 0%, var(--mn-blue-50) 55%, var(--mn-yellow-50) 100%);
    border: 1px solid var(--mn-blue-100);
    border-radius: var(--mn-radius-xl);
    overflow: hidden;
    isolation: isolate;
}

/* Mặt trời và đồi cỏ trang trí (không mang nội dung) */
.mn-hero::before {
    content: '';
    position: absolute;
    right: -70px;
    top: -90px;
    z-index: -1;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--mn-yellow-400) 0 34%, rgba(255, 214, 10, 0.35) 35% 52%, rgba(255, 214, 10, 0.14) 53% 70%, rgba(255, 214, 10, 0) 71%);
}

.mn-hero::after {
    content: '';
    position: absolute;
    left: -10%;
    right: -10%;
    bottom: -150px;
    z-index: -1;
    height: 220px;
    border-radius: 50%;
    background: var(--mn-green-100);
    box-shadow: 34vw 34px 0 0 rgba(187, 214, 247, 0.6);
    opacity: 0.7;
}

.mn-hero__body {
    flex: 1 1 0;
    min-width: 0;
}

.mn-hero__kicker {
    margin: 0 0 8px;
    color: var(--mn-green-700);
    font-size: var(--mn-text-sm);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mn-hero__title {
    margin: 0;
    color: var(--mn-blue-800);
    font-size: clamp(1.75rem, 1.1rem + 3vw, 3rem);
    line-height: 1.12;
    letter-spacing: -0.02em;
}

.mn-hero__lead {
    max-width: 60ch;
    margin: 14px 0 0;
    color: var(--mn-ink-700);
    font-size: clamp(1.0625rem, 1rem + 0.4vw, 1.25rem);
}

.mn-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 22px 0 0;
}

.mn-hero__art {
    flex: 0 0 auto;
}

.mn-hero__logo {
    display: block;
    width: clamp(140px, 22vw, 260px);
    height: auto;
    filter: drop-shadow(0 10px 22px rgba(8, 76, 158, 0.18));
}

@media (max-width: 767.98px) {
    .mn-hero {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: var(--mn-space-4);
        border-radius: var(--mn-radius-lg);
    }

    .mn-hero__logo {
        width: 112px;
    }

    .mn-hero::before {
        right: -110px;
        top: -130px;
    }
}

/* Ô truy cập nhanh */
.mn-quick__list {
    display: grid;
    gap: var(--mn-space-4);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Từ 576px: các ô tự chia đều theo số lượng (3-6 ô mỗi hàng tuỳ bề rộng vùng chứa) */
@media (min-width: 576px) {
    .mn-quick__list {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    }
}


.mn-quick__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    height: 100%;
    min-height: 124px;
    padding: 18px 12px;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-sm);
    color: var(--mn-ink-900);
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    transition: transform 0.2s var(--mn-ease), box-shadow 0.2s var(--mn-ease), border-color 0.2s var(--mn-ease);
}

.mn-quick__item:hover,
.mn-quick__item:focus {
    border-color: var(--mn-quick-fg, var(--mn-blue-700));
    box-shadow: var(--mn-shadow);
    color: var(--mn-ink-900);
    text-decoration: none;
    transform: translateY(-2px);
}

.mn-quick__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    background: var(--mn-quick-bg, var(--mn-blue-50));
    border-radius: 50%;
    color: var(--mn-quick-fg, var(--mn-blue-700));
    font-size: 1.5rem;
}

.mn-quick__item--sky {
    --mn-quick-bg: var(--mn-blue-100);
    --mn-quick-fg: var(--mn-blue-800);
}

.mn-quick__item--yellow {
    --mn-quick-bg: var(--mn-yellow-100);
    --mn-quick-fg: #7A5A00;
}

.mn-quick__item--green {
    --mn-quick-bg: var(--mn-green-50);
    --mn-quick-fg: var(--mn-green-700);
}

.mn-quick__item--pink {
    --mn-quick-bg: var(--mn-pink-50);
    --mn-quick-fg: var(--mn-pink-700);
}

.mn-quick__item--red {
    --mn-quick-bg: var(--mn-red-50);
    --mn-quick-fg: var(--mn-red-600);
}

.mn-quick__item--orange {
    --mn-quick-bg: var(--mn-orange-50);
    --mn-quick-fg: var(--mn-orange-700);
}

.mn-quick__item--white {
    --mn-quick-bg: #F3F1EC;
    --mn-quick-fg: var(--mn-ink-700);
}

/* Dải thông báo quan trọng */
.mn-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
    padding: 14px 18px;
    background: var(--mn-yellow-100);
    border: 1px solid var(--mn-yellow-500);
    border-radius: var(--mn-radius-lg);
    color: var(--mn-ink-900);
}

.mn-strip__icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    background: var(--mn-red-600);
    border-radius: 50%;
    color: #fff;
    font-size: 1.25rem;
}

.mn-strip__body {
    flex: 1 1 240px;
    min-width: 0;
}

.mn-strip__body > *:last-child {
    margin-bottom: 0;
}

.mn-strip__label {
    margin: 0 0 2px;
    color: var(--mn-red-700);
    font-size: var(--mn-text-xs);
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

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

.mn-strip__list li + li {
    margin-top: 4px;
}

.mn-strip a:not(.mn-strip__more):not(.mn-btn) {
    color: var(--mn-ink-900);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: rgba(31, 41, 55, 0.4);
}

.mn-strip a:not(.mn-strip__more):not(.mn-btn):hover,
.mn-strip a:not(.mn-strip__more):not(.mn-btn):focus {
    color: var(--mn-blue-800);
}

.mn-strip__meta {
    color: var(--mn-ink-700);
    font-size: var(--mn-text-xs);
    font-weight: 400;
    white-space: nowrap;
}

.mn-strip__more {
    flex: none;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 6px 16px;
    background: #fff;
    border: 2px solid var(--mn-ink-900);
    border-radius: var(--mn-radius-pill);
    color: var(--mn-ink-900);
    text-decoration: none;
}

/* ==========================================================================
   20. Nội dung bài viết
   ========================================================================== */

.mn-prose {
    max-width: 78ch;
    color: var(--mn-ink-900);
    font-size: 1.0625rem;
    line-height: 1.75;
    overflow-wrap: break-word;
}

.mn-prose--wide {
    max-width: none;
}

.mn-prose--compact {
    font-size: 1rem;
    line-height: 1.6;
}

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

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

.mn-prose p {
    margin: 0 0 1.1em !important;
}

.mn-prose h2 {
    margin: 1.6em 0 0.6em;
    color: var(--mn-blue-800);
    font-size: 1.5rem;
}

.mn-prose h3 {
    margin: 1.4em 0 0.5em;
    font-size: 1.25rem;
}

.mn-prose h4,
.mn-prose h5,
.mn-prose h6 {
    margin: 1.2em 0 0.4em;
    font-size: 1.0625rem;
}

.mn-prose a:not(.mn-btn):not(.mn-badge) {
    color: var(--mn-link);
    text-decoration: underline;
}

.mn-prose a:not(.mn-btn):not(.mn-badge):hover,
.mn-prose a:not(.mn-btn):not(.mn-badge):focus {
    color: var(--mn-link-hover);
    text-decoration-thickness: 2px;
}

.mn-prose ul,
.mn-prose ol {
    margin: 0 0 1.1em !important;
    padding-left: 1.6em !important;
}

.mn-prose ul {
    list-style: disc outside !important;
}

.mn-prose ul ul {
    list-style-type: circle !important;
}

.mn-prose ol {
    list-style: decimal outside !important;
}

.mn-prose li {
    margin: 0 0 0.35em !important;
}

.mn-prose li::marker {
    color: var(--mn-blue-600);
    font-weight: 700;
}

.mn-prose img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: var(--mn-radius-sm);
}

.mn-prose figure,
.mn-prose figure:not(.table):not(.media):not(.nv-media) {
    max-width: 100%;
    margin: 1.4em auto;
}

.mn-prose figcaption {
    margin-top: 8px;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
    font-style: italic;
    text-align: center;
}

.mn-prose table {
    width: 100%;
    max-width: 100%;
    margin: 0 0 1.2em;
    border-collapse: collapse;
    background: #fff;
}

.mn-prose th,
.mn-prose td {
    padding: 9px 12px;
    border: 1px solid var(--mn-line);
    vertical-align: top;
}

.mn-prose th {
    background: var(--mn-blue-50);
    color: var(--mn-blue-800);
}

.mn-prose figure.table {
    display: block;
    width: 100%;
    overflow-x: auto;
}

.mn-prose .mn-table-wrap {
    margin-bottom: 1.2em;
}

.mn-prose .mn-table-wrap > table {
    margin: 0;
}

.mn-prose iframe,
.mn-prose video,
.mn-prose embed,
.mn-prose object {
    display: block;
    width: 100%;
    max-width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    margin: 0 0 1.2em;
    border: 0;
    border-radius: var(--mn-radius-sm);
}

.mn-prose audio {
    width: 100%;
}

.mn-prose pre {
    max-width: 100%;
    overflow-x: auto;
    white-space: pre;
    border-radius: var(--mn-radius-sm);
}

.mn-prose hr {
    margin: 1.8em 0;
}

.mn-prose__lead {
    color: var(--mn-ink-700);
    font-size: 1.1875rem;
    font-weight: 600;
    line-height: 1.6;
}

/* ==========================================================================
   21. Mẫu module trong giao diện và block dùng chung
   ========================================================================== */

/* Bài viết (tin tức, trang) */
.mn-article {
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-lg);
    box-shadow: var(--mn-shadow-sm);
    padding: clamp(18px, 3vw, 36px);
}

.mn-article__head {
    margin: 0 0 var(--mn-space-5);
}

.mn-article__title {
    margin: 10px 0 0;
    color: var(--mn-blue-800);
    font-size: clamp(1.625rem, 1.2rem + 1.8vw, 2.25rem);
    line-height: 1.2;
}

.mn-article__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 16px;
    margin: 12px 0 0;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
}

.mn-article__meta .fa {
    color: var(--mn-blue-600);
    margin-right: 4px;
}

.mn-article__tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 16px 0 0;
    padding: 12px 0 0;
    border-top: 1px solid var(--mn-line);
}

.mn-article__figure {
    margin: 0 0 var(--mn-space-5);
}

.mn-article__figure img {
    /* ảnh nhỏ hơn khung thì giữ cỡ thật (không phóng to gây nhoè); width/height trên thẻ img giữ chỗ khi tải */
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 560px;
    margin: 0 auto;
    object-fit: cover;
    border-radius: var(--mn-radius);
}

.mn-article__figure--side {
    float: right;
    width: min(42%, 340px);
    margin: 4px 0 16px 24px;
}

.mn-article__figure figcaption {
    margin-top: 8px;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
    font-style: italic;
    text-align: center;
}

@media (max-width: 575.98px) {
    .mn-article__figure--side {
        float: none;
        width: 100%;
        margin: 0 0 var(--mn-space-4);
    }
}

.mn-article__lead {
    margin: 0 0 var(--mn-space-5);
    color: var(--mn-ink-700);
    font-size: 1.1875rem;
    font-weight: 600;
    line-height: 1.6;
}

.mn-article__lead > *:last-child {
    margin-bottom: 0;
}

.mn-article__foot {
    clear: both;
    margin: var(--mn-space-6) 0 0;
    padding: var(--mn-space-4) 0 0;
    border-top: 1px solid var(--mn-line);
}

.mn-article__foot > * + * {
    margin-top: var(--mn-space-4);
}

.mn-article__source {
    margin: 0;
    color: var(--mn-ink-700);
    text-align: right;
}

.mn-article + * {
    margin-top: var(--mn-space-5);
}

.mn-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-tags a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 4px 14px;
    background: var(--mn-blue-50);
    border-radius: var(--mn-radius-pill);
    color: var(--mn-blue-800);
    font-size: var(--mn-text-sm);
    font-weight: 600;
}

.mn-adminlinks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 8px 0 0 !important;
    position: relative;
    z-index: 2;
}

.mn-adminlinks .btn {
    min-height: 44px;
}

/* Danh sách tin phụ (tiêu đề + ngày) */
.mn-newslist {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-newslist > li {
    position: relative;
    padding: 0 0 0 20px;
}

.mn-newslist > li + li {
    border-top: 1px solid var(--mn-line);
}

.mn-newslist > li::before {
    content: '';
    position: absolute;
    left: 2px;
    top: 1.1em;
    width: 8px;
    height: 8px;
    background: var(--mn-yellow-400);
    border: 2px solid var(--mn-blue-600);
    border-radius: 50%;
}

.mn-newslist a {
    /* phần đệm dọc thuộc về liên kết: vùng chạm cao tối thiểu 44px, hình thức danh sách không đổi */
    display: inline-block;
    padding: 9px 0;
    color: var(--mn-ink-900);
    font-weight: 600;
}

.mn-newslist a:hover,
.mn-newslist a:focus {
    color: var(--mn-blue-700);
}

.mn-newslist__meta {
    display: block;
    margin-top: -9px;
    padding-bottom: 9px;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-xs);
}

.mn-footer .mn-newslist__meta {
    color: #D5E0F0;
}

ol.mn-newslist--ranked {
    counter-reset: mn-rank;
}

ol.mn-newslist--ranked > li {
    padding-left: 40px;
    counter-increment: mn-rank;
}

ol.mn-newslist--ranked > li::before {
    content: counter(mn-rank);
    left: 0;
    top: 9px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--mn-blue-50);
    border: 0;
    color: var(--mn-blue-800);
    font-size: var(--mn-text-xs);
    font-weight: 800;
}

/* Cây chuyên mục */
.mn-cattree,
.mn-cattree ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-cattree ul {
    padding-left: 16px;
}

.mn-cattree > li + li {
    border-top: 1px solid var(--mn-line);
}

.mn-cattree a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 6px 0;
    color: var(--mn-ink-900);
    font-weight: 600;
}

.mn-cattree ul a {
    font-weight: 400;
    min-height: 44px;
}

.mn-cattree a:hover,
.mn-cattree a:focus,
.mn-cattree .is-active > a {
    color: var(--mn-blue-700);
}

/* Danh sách có ảnh nhỏ (block tin của module news đặt ở bất kỳ trang nào) */
.mn-thumblist {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-thumblist__item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 0;
}

.mn-thumblist__item + .mn-thumblist__item {
    border-top: 1px solid var(--mn-line);
}

.mn-thumblist__img {
    flex: none;
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: var(--mn-radius-sm);
    background: var(--mn-blue-50);
}

.mn-thumblist__title {
    /* vùng chạm cao tối thiểu 44px */
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-height: 44px;
    color: var(--mn-ink-900);
    font-weight: 600;
    line-height: 1.4;
}

.mn-thumblist__title:hover,
.mn-thumblist__title:focus {
    color: var(--mn-blue-700);
}

.mn-newscenter {
    display: grid;
    gap: var(--mn-gap);
    grid-template-columns: minmax(0, 1fr);
    margin-bottom: var(--mn-space-5);
}

@media (min-width: 768px) {
    .mn-newscenter {
        grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    }
}

.mn-newscenter__others {
    padding: 6px 18px;
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-lg);
}

.mn-headline {
    margin-bottom: var(--mn-space-5);
}

.mn-card__badges:empty,
.mn-badges:empty,
.mn-card__meta:empty {
    display: none;
}

/* Nút chỉ hoạt động khi có JavaScript */
html:not(.mn-js) button[data-mn-print],
html:not(.mn-js) button[data-mn-share] {
    display: none;
}

/* Bình luận (mẫu dự phòng của module comment) */
#idcomment .panel,
.comment-box .panel {
    box-shadow: none;
}

/* Trang liên hệ */
.mn-contact__grid {
    display: grid;
    gap: var(--mn-space-6);
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
}

@media (min-width: 992px) {
    .mn-contact__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    }
}

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

.mn-dept__list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 5px 0;
}

.mn-dept__list .fa,
.mn-dept__list [class^='icon-'] {
    flex: none;
    width: 22px;
    margin-top: 0.3em;
    color: var(--mn-blue-600);
    text-align: center;
}

.mn-dept__list a {
    /* vùng chạm cao tối thiểu 44px: phần đệm thuộc về liên kết, dòng có liên kết bỏ phần đệm của thẻ li */
    display: inline-block;
    padding: 9px 0;
    font-weight: 600;
}

.mn-dept__list li:has(a) {
    padding: 0;
}

.mn-dept__list li:has(a) > .fa,
.mn-dept__list li:has(a) > [class^='icon-'] {
    margin-top: calc(9px + 0.3em);
}

.mn-form-result {
    margin: 16px 0 0;
}

.mn-form-result:empty {
    display: none;
}

.mn-captcha {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.mn-captcha .form-control {
    width: 140px;
}

.mn-captcha__refresh {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: var(--mn-blue-50);
    border: 0;
    border-radius: 50%;
    color: var(--mn-blue-700);
    cursor: pointer;
    font-size: 1.125rem;
}

/* Trang thành viên (mẫu dự phòng): canh giữa, bo góc */
.mn-mod-users .mn-content .page,
.mn-mod-users .mn-content > .centered {
    max-width: 100%;
}

.mn-mod-users .login-box,
.mn-mod-users .page.panel {
    border-radius: var(--mn-radius-lg);
}

/* css/users.css (bản sao của giao diện mặc định, nạp sau mn.css trên trang thành viên): dùng bộ chọn mạnh hơn */
.mn-body .login-box {
    width: 460px;
    max-width: 100%;
}

.mn-body .login-box .panel {
    margin-top: 0;
    background-color: var(--mn-surface);
}

.mn-body .login-box h2 {
    font-size: 1.5rem;
}

.mn-body .login-box .nv-info {
    margin-bottom: 16px;
}

.mn-body .login-box img.logo {
    max-height: 96px;
    width: auto;
}

.mn-body .login-box--wide {
    width: 560px;
}

/* Trang của thành viên đã đăng nhập (mẫu sao từ giao diện mặc định): vùng chạm 44px, chữ trên ảnh đại diện đủ tương phản */
.mn-body .users-menu > li > a,
.mn-mod-users .nav.navbar-nav > li > a,
.mn-mod-users .nav-tabs > li > a {
    display: flex;
    align-items: center;
    min-height: 44px;
}

.mn-mod-users .mn-content table a {
    display: inline-block;
    padding: 10px 0;
}

.mn-body figure.avatar figcaption {
    background-color: var(--mn-blue-700);
    font-size: 0.75rem;
}

.mn-body figure.avatar img {
    height: auto;
}

/* Nhãn bao quanh ô nhập - không cần id nên dùng được cho biểu mẫu có thể xuất hiện nhiều lần trong một trang:
   <label class="mn-flabel"><span class="mn-flabel__text">Nhãn</span><input class="form-control"></label> */
.mn-flabel {
    display: block;
    margin: 0;
    font-weight: 400;
}

.mn-flabel__text {
    display: block;
    margin: 0 0 6px;
    color: var(--mn-ink-900);
    font-weight: 700;
    line-height: 1.4;
}

/* Biểu mẫu thành viên (modules/users/*.tpl của giao diện): đăng nhập, đăng ký, khôi phục mật khẩu */
.mn-userform {
    text-align: left;
}

.mn-userform__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 22px 0 8px;
}

.mn-userform__alt {
    margin: 4px 0 0;
    text-align: center;
}

.mn-userform__alt a,
.mn-userform__nav a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    font-weight: 700;
}

.mn-userform__nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 22px;
    list-style: none;
    margin: 12px 0 0;
    padding: 10px 0 0;
    border-top: 1px solid var(--mn-line);
}

.mn-userform__choices {
    display: flex;
    flex-wrap: wrap;
    gap: 0 20px;
}

.mn-userform__choices label,
.mn-userform__agree label {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin: 0;
    padding: 0;
    font-weight: 400;
}

.mn-userform__agree {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
}

/* Mã xác nhận có nhãn: ô nhập (kèm nhãn) - ảnh - nút đổi mã, canh theo đáy */
.mn-captcha--labelled {
    align-items: flex-end;
}

.mn-captcha--labelled .mn-flabel {
    flex: 1 1 140px;
    min-width: 0;
}

.mn-captcha--labelled .form-control {
    width: 100%;
}

.mn-captcha--labelled .captchaImg {
    flex: none;
    height: 46px;
    width: auto;
}

/* Cây liên kết của lõi (trang RSS-feeds dùng mẫu dự phòng .tree): mỗi liên kết có vùng chạm cao tối thiểu 44px */
.tree li a {
    display: inline-block;
    padding: 10px 0;
}

/* Tìm kiếm của lõi (modules/seek/*.tpl của giao diện): tiêu đề kết quả là liên kết có vùng chạm 44px */
.mn-seek__title a {
    display: inline-block;
    padding: 10px 0;
    margin: -10px 0;
}

#search-form .form-group > .btn {
    margin: 0 4px 6px;
}

/* ==========================================================================
   22. Trang thông báo/lỗi, chế độ kéo thả block
   ========================================================================== */

.mn-infodie-body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
    background: var(--mn-bg);
}

.mn-infodie {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 16px;
}

.mn-infodie__card {
    position: relative;
    width: 100%;
    max-width: 640px;
    padding: clamp(24px, 5vw, 48px);
    background: var(--mn-surface);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-xl);
    box-shadow: var(--mn-shadow);
    text-align: center;
    overflow: hidden;
}

.mn-infodie__card::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 8px;
    background: linear-gradient(90deg, var(--mn-blue-600) 0 25%, var(--mn-yellow-400) 25% 50%, var(--mn-green-600) 50% 75%, var(--mn-pink-600) 75% 100%);
}

.mn-infodie__card > a {
    display: inline-block;
}

.mn-infodie__logo {
    display: inline-block;
    width: auto;
    height: 112px;
    margin: 4px auto 14px;
}

.mn-infodie__site {
    margin: 0 0 18px;
    color: var(--mn-blue-700);
    font-size: 1.125rem;
    font-weight: 800;
}

.mn-infodie__title {
    margin: 0 0 12px;
    color: var(--mn-ink-900);
    font-size: clamp(1.375rem, 1.1rem + 1.4vw, 1.875rem);
}

.mn-infodie__content {
    margin: 0 0 22px;
    color: var(--mn-ink-700);
    font-size: 1.0625rem;
}

.mn-infodie__search:empty {
    display: none;
}

.mn-infodie__search {
    margin: 0 0 22px;
}

.mn-infodie__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

/* Chế độ kéo thả block của quản trị: vùng trống vẫn phải nhìn thấy để thả block */
.column {
    min-height: 48px;
    border: 2px dashed #ff6600;
    border-radius: var(--mn-radius-sm);
}

.mn-topbar .column,
.mn-brandbar .column,
.mn-navbar .column {
    min-width: 80px;
}

.portlet .tool {
    z-index: 130;
}

/* Thanh công cụ nổi của người quản trị (system/admin_toolbar.tpl của giao diện này): mỗi nút tối thiểu 44x44px,
   tên nút luôn có cho trình đọc màn hình và hiện ra khi rê chuột/di tiêu điểm. Trên điện thoại thanh chuyển xuống góc
   dưới bên trái, xếp ngang, để không che logo và phần đầu nội dung. */
#admintoolbar {
    position: fixed;
    left: 0;
    top: 96px;
    z-index: 10000;
    background: #205FA0;
    border: 1px solid #174A80;
    border-left: 0;
    border-radius: 0 12px 12px 0;
    box-shadow: var(--mn-shadow);
    opacity: 0.7;
    overflow: hidden;
}

#admintoolbar:hover,
#admintoolbar:focus-within {
    opacity: 1;
}

#admintoolbar ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#admintoolbar li + li {
    border-top: 1px solid rgba(0, 0, 0, 0.18);
}

#admintoolbar a {
    display: flex;
    align-items: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0 9px;
    color: #fff;
    font-family: var(--mn-font);
    font-size: 0.875rem;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}

#admintoolbar a:hover,
#admintoolbar a:focus {
    background: #174A80;
    color: #fff;
    text-decoration: none;
}

#admintoolbar a:focus-visible {
    outline-color: var(--mn-yellow-400) !important;
    outline-offset: -3px !important;
}

#admintoolbar .fa {
    flex: none;
    width: 26px;
    font-size: 22px;
    text-align: center;
}

#admintoolbar .fa.fa-object-group {
    font-size: 18px;
}

#admintoolbar span {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

@media (min-width: 576px) {
    #admintoolbar:hover span,
    #admintoolbar:focus-within span {
        position: static;
        width: auto;
        height: auto;
        margin: 0 10px 0 6px;
        overflow: visible;
        clip: auto;
    }
}

@media (max-width: 575.98px) {
    #admintoolbar {
        top: auto;
        bottom: 12px;
        left: 12px;
        border-left: 1px solid #174A80;
        border-radius: 12px;
        opacity: 0.92;
    }

    #admintoolbar ul {
        display: flex;
    }

    #admintoolbar li + li {
        border-top: 0;
        border-left: 1px solid rgba(0, 0, 0, 0.18);
    }

    /* chừa chỗ ở cuối trang để thanh công cụ không che dòng bản quyền */
    body.mn-is-admin .mn-footer__bottom-in {
        padding-bottom: 72px;
    }
}

/* ==========================================================================
   23. Tiện ích
   ========================================================================== */

.mn-text-muted {
    color: var(--mn-ink-600) !important;
}

.mn-text-center {
    text-align: center !important;
}

.mn-text-right {
    text-align: right !important;
}

.mn-nowrap {
    white-space: nowrap !important;
}

.mn-mt-0 {
    margin-top: 0 !important;
}

.mn-mb-0 {
    margin-bottom: 0 !important;
}

.mn-mt {
    margin-top: var(--mn-space-5) !important;
}

.mn-mb {
    margin-bottom: var(--mn-space-5) !important;
}

.mn-clamp-2,
.mn-clamp-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.mn-clamp-2 {
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

.mn-clamp-3 {
    -webkit-line-clamp: 3;
    line-clamp: 3;
}

.mn-show-print {
    display: none !important;
}

.mn-icon-text {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
}

/* Trạng thái rê chuột/tiêu điểm của các thành phần là liên kết:
   quy tắc chung "a:hover, a:focus" (0,1,1) mạnh hơn một lớp đơn (0,1,0), nên cần khai báo lại màu ở đây. */
.mn-badge:hover,
.mn-badge:focus {
    color: var(--mn-blue-800);
}

.mn-badge--coso:hover,
.mn-badge--coso:focus,
.mn-badge--new:hover,
.mn-badge--new:focus {
    color: #fff;
}

.mn-badge--type:hover,
.mn-badge--type:focus {
    color: var(--mn-green-700);
}

.mn-badge--pin:hover,
.mn-badge--pin:focus {
    color: var(--mn-ink-900);
}

.mn-badge--legacy:hover,
.mn-badge--legacy:focus {
    color: #5B4A1E;
}

.mn-section__more:hover,
.mn-section__more:focus {
    color: var(--mn-blue-800);
    text-decoration: underline;
}

.mn-strip__more:hover,
.mn-strip__more:focus {
    background: var(--mn-ink-900);
    color: #fff;
    text-decoration: none;
}

.mn-calendar__event:hover,
.mn-calendar__event:focus {
    color: var(--mn-ink-900);
    text-decoration: underline;
}

.mn-footer .mn-linklist a:hover,
.mn-footer .mn-linklist a:focus {
    color: var(--mn-yellow-400);
}

.mn-tags a:hover,
.mn-tags a:focus {
    background: var(--mn-blue-100);
    color: var(--mn-blue-800);
}

.mn-gallery__item:focus-visible {
    outline-offset: 3px !important;
}

/* Nhãn cơ sở có liên kết do thư viện dùng chung sinh ra - mn75_campus_badge($id, true):
   <a class="mn-badge-link" href="…"><span class="mn-badge mn-badge--coso …">Tên cơ sở</span></a> */
.mn-badge-link {
    display: inline-flex;
    max-width: 100%;
    border-radius: var(--mn-radius-pill);
    text-decoration: none;
}

.mn-badge-link:hover,
.mn-badge-link:focus {
    text-decoration: none;
}

.mn-badge-link:hover > .mn-badge,
.mn-badge-link:focus > .mn-badge {
    box-shadow: 0 0 0 2px var(--mn-yellow-400);
}

/* Vùng chạm tối thiểu 44px cho nhãn và thẻ từ khoá là liên kết (hình thức giữ nguyên) */
a.mn-badge,
.mn-badge-link,
.mn-tags a {
    position: relative;
    overflow: visible;
}

a.mn-badge::after,
.mn-badge-link::after,
.mn-tags a::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 44px;
    transform: translateY(-50%);
}

/* Chế độ kéo thả block: các vùng trong thanh trên cùng xếp ngang, không chiếm cả dòng */
.mn-topbar__blocks > .column,
.mn-brandbar__quick > .column,
.mn-footer__menu > .column {
    flex: 1 1 130px;
    width: auto;
    min-width: 130px;
    min-height: 40px;
}

/* ==========================================================================
   24. In ấn
   ========================================================================== */

@media print {
    @page {
        margin: 16mm 14mm;
    }

    html,
    body,
    body.mn-body {
        background: #fff !important;
        color: #000 !important;
        font-size: 12pt;
        height: auto;
    }

    .mn-skip,
    .mn-noscript,
    .mn-topbar,
    .mn-ribbon,
    .mn-navbar,
    .mn-menu-toggle,
    .mn-brandbar__quick,
    .mn-breadcrumb,
    .mn-split__aside,
    .mn-footer,
    .mn-totop,
    .mn-filter,
    .mn-toolbar,
    .mn-article__tools,
    .mn-adminlinks,
    .mn-btn,
    .btn,
    .pagination,
    .mn-hide-print,
    #admintoolbar,
    #sitemodal,
    .modal,
    .cookie-notice,
    #timeoutsess,
    #tip,
    #ftip,
    iframe,
    video,
    audio {
        display: none !important;
    }

    .mn-show-print {
        display: block !important;
    }

    .mn-brandbar__in {
        padding: 0 0 8pt;
        border-bottom: 1.5pt solid #000;
    }

    .mn-brand__logo {
        height: 48pt;
    }

    .mn-brand__name a,
    .mn-brand__kicker,
    .mn-pagehead__title,
    .mn-article__title,
    .mn-section__title {
        color: #000 !important;
    }

    .mn-main {
        padding: 10pt 0 0;
    }

    .mn-container {
        max-width: none;
        padding: 0;
    }

    .mn-split {
        display: block;
    }

    .mn-card,
    .mn-article,
    .mn-list,
    .mn-notice,
    .mn-accordion,
    .mn-table-wrap,
    .panel {
        border-color: #999 !important;
        box-shadow: none !important;
    }

    .mn-article {
        border: 0;
        padding: 0;
    }

    .mn-card,
    .mn-list__item,
    .mn-accordion,
    .mn-timeline__item,
    tr,
    img,
    figure {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    h1,
    h2,
    h3 {
        break-after: avoid;
        page-break-after: avoid;
    }

    .mn-prose {
        max-width: none;
        font-size: 12pt;
    }

    a {
        color: #000 !important;
        text-decoration: underline;
    }

    /* Bootstrap in địa chỉ sau MỌI liên kết: tắt đi, chỉ giữ cho liên kết ngoài trong nội dung bài viết */
    a[href]::after,
    abbr[title]::after {
        content: none !important;
    }

    .mn-prose a[href^='http']::after {
        content: ' (' attr(href) ')' !important;
        font-size: 10pt;
        font-weight: 400;
        word-break: break-all;
    }

    .mn-table-wrap {
        overflow: visible;
    }

    details.mn-accordion > .mn-accordion__body {
        display: block;
    }

    .mn-badge {
        border: 1pt solid #000 !important;
        background: #fff !important;
        color: #000 !important;
    }

    .mn-tabs__list {
        display: none;
    }

    .mn-tabs__panel[hidden] {
        display: block !important;
    }
}

/* ==========================================================================
   25. Giảm chuyển động, tương phản cao
   ========================================================================== */

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

    .mn-card--link:hover,
    .mn-quick__item:hover,
    .mn-gallery__item:hover img {
        transform: none;
    }
}

@media (forced-colors: active) {
    .mn-btn,
    .btn,
    .mn-badge,
    .mn-card,
    .mn-notice,
    .mn-accordion,
    .mn-list,
    .mn-quick__item,
    .mn-strip,
    .mn-menu-toggle,
    .mn-totop {
        border: 1px solid CanvasText;
    }

    .mn-nav__item.is-active > .mn-nav__link,
    .mn-tabs__tab[aria-selected='true'] {
        border-bottom: 4px solid Highlight;
    }

    .mn-ribbon span,
    .mn-section__title::before,
    .mn-card__heading::before {
        forced-color-adjust: none;
    }
}

@media (prefers-contrast: more) {
    :root {
        --mn-line: #8A8F98;
        --mn-ink-600: #374151;
        --mn-ink-500: #374151;
    }

    a {
        text-decoration: underline;
    }
}

/* ==========================================================================
   26. Bổ sung của giao diện v2 (chỉ THÊM lớp mới; không đổi nghĩa lớp nào ở trên)
   ========================================================================== */

/* Gợi ý định dạng đặt trong nhãn của thanh lọc: "Từ ngày (dd/mm/yyyy)" */
.mn-filter__hint {
    color: var(--mn-ink-600);
    font-weight: 400;
}

/* Ô ngày dd/mm/yyyy ([data-mn-date]): ô chữ + nút mở bộ chọn ngày sẵn có của trình duyệt (mn.js thêm nút khi dùng được) */
.mn-date {
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
}

.mn-date > .form-control {
    flex: 1 1 auto;
    min-width: 0;
}

.mn-date--picker > .form-control {
    padding-right: 54px;
}

.mn-date__btn {
    position: absolute;
    top: 1px;
    right: 1px;
    bottom: 1px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    min-height: 44px;
    padding: 0;
    background: transparent;
    border: 0;
    border-left: 1px solid var(--mn-line);
    border-radius: 0 var(--mn-radius-sm) var(--mn-radius-sm) 0;
    color: var(--mn-blue-700);
    cursor: pointer;
    font-size: 1.0625rem;
}

.mn-date__btn:hover,
.mn-date__btn:focus-visible {
    background: var(--mn-blue-50);
}

.mn-date__native {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 46px;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

/* Trình duyệt không có showPicker(): chính ô ngày trong suốt nhận thao tác chạm (nằm trên nút) */
.mn-date--overlay .mn-date__native {
    pointer-events: auto;
    cursor: pointer;
}

/* Dòng nguồn ("Nguồn: ... — xem bản gốc"): liên kết trong câu có vùng chạm cao 44px mà không đổi chiều cao dòng */
.mn-source a {
    display: inline-block;
    padding: 11px 0;
    margin: -11px 0;
    text-decoration: underline;
}

/* Danh sách tin phụ: nhãn cơ sở / nhãn tư liệu đứng cùng hàng với ngày đăng */
.mn-newslist__meta:empty {
    display: none;
}

.mn-newslist__meta .mn-badge {
    margin: 2px 6px 2px 0;
    vertical-align: middle;
}

.mn-newslist__meta > time {
    margin-right: 4px;
}

/* Danh sách có ảnh nhỏ: phần chữ gồm tiêu đề và hàng nhãn (tuỳ chọn; mẫu chỉ có ảnh + tiêu đề vẫn dùng được) */
.mn-thumblist__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 2px;
    min-width: 0;
}

.mn-thumblist__body > .mn-thumblist__title {
    flex: 0 0 auto;
}

.mn-thumblist__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 6px;
}

.mn-thumblist__badges:empty {
    display: none;
}

/* Biểu mẫu: đoạn về chính sách dữ liệu in ngay trên nút gửi (nội dung do module cấu hình, giao diện không tự đặt) */
.mn-form__policy {
    margin: 0 0 16px;
    padding: 12px 14px;
    background: var(--mn-bg-soft);
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-sm);
    color: var(--mn-ink-700);
    font-size: var(--mn-text-sm);
}

.mn-form__policy > * {
    margin: 0;
}

.mn-form__policy > * + * {
    margin-top: 8px;
}

.mn-form__policy a {
    display: inline-block;
    padding: 11px 0;
    margin: -11px 0;
    color: var(--mn-link);
    font-weight: 600;
    text-decoration: underline;
}

.mn-form__policy a:hover,
.mn-form__policy a:focus {
    color: var(--mn-link-hover);
}

/* Trang thông báo/lỗi: tên loại website phía trên tên trường; các liên kết hữu ích dưới nút "Về trang chủ" */
.mn-infodie__kicker {
    margin: 0 0 2px;
    color: var(--mn-green-700);
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.mn-infodie__kicker:empty {
    display: none;
}

.mn-infodie__nav {
    margin: 22px 0 0;
    padding: 16px 0 0;
    border-top: 1px solid var(--mn-line);
}

.mn-infodie__nav-title {
    margin: 0 0 4px;
    color: var(--mn-ink-600);
    font-size: var(--mn-text-sm);
    font-weight: 700;
}

.mn-infodie__nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 20px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.mn-infodie__nav a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: var(--mn-link);
    font-weight: 600;
}

.mn-infodie__nav a:hover,
.mn-infodie__nav a:focus {
    color: var(--mn-link-hover);
    text-decoration: underline;
}

/* Dòng nguồn của bản in (tên website + địa chỉ trang): ẩn trên màn hình nhờ .mn-show-print */
.mn-print-source {
    margin: 16pt 0 0;
    padding: 6pt 0 0;
    border-top: 0.75pt solid #999;
    color: #000;
    font-size: 9pt;
    word-break: break-all;
}

/* In ấn: bổ sung để mọi bố cục (main, main-right, home, simple, trang thông báo) đều in gọn phần nội dung */
@media print {
    /* block đặt quanh nội dung, công cụ và phần chỉ dùng khi tương tác */
    .mn-zone--top,
    .mn-zone--before,
    .mn-zone--after,
    .mn-zone--bottom,
    .mn-search,
    .mn-date__btn,
    .mn-date__native,
    .mn-captcha__refresh,
    .mn-lightbox,
    .mn-infodie__search,
    .mn-infodie__links,
    .mn-infodie__nav,
    .social-share-container,
    #contactButton,
    #openidResult {
        display: none !important;
    }

    /* nền màu không được in: chữ trắng/nhạt trên nền màu phải chuyển sang chữ đen, có viền */
    .mn-hero,
    .mn-strip,
    .mn-quick__item,
    .mn-section--tint,
    .mn-section--blue,
    .mn-calendar__title,
    .mn-calendar__event,
    .mn-stat,
    .panel-primary > .panel-heading,
    .mn-form__policy {
        background: #fff !important;
        box-shadow: none !important;
        color: #000 !important;
    }

    .mn-hero,
    .mn-strip,
    .mn-quick__item,
    .mn-stat {
        border: 0.75pt solid #999 !important;
    }

    .mn-hero__title,
    .mn-hero__kicker,
    .mn-stat__value,
    .mn-calendar__title,
    .panel-primary > .panel-heading,
    .panel-primary > .panel-heading a {
        color: #000 !important;
    }

    .mn-hero::before,
    .mn-hero::after,
    .mn-infodie__card::before {
        display: none !important;
    }

    /* trang chủ: các vùng xếp nối tiếp, không ngắt giữa một khối nhỏ */
    .mn-home__zone {
        margin: 0 0 12pt;
    }

    .mn-quick__list > li,
    .mn-strip,
    .mn-stat {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    /* bố cục simple (trang in bài viết, hộp thoại) và trang thông báo/lỗi */
    .mn-simple,
    .mn-news-print {
        max-width: none;
        margin: 0;
        padding: 0;
    }

    .mn-infodie-body {
        display: block;
        min-height: 0;
        background: #fff !important;
    }

    .mn-infodie {
        display: block;
        padding: 0;
    }

    .mn-infodie__card {
        max-width: none;
        padding: 0;
        border: 0;
        box-shadow: none;
    }

    /* ảnh không tràn trang; biểu mẫu in viền mảnh */
    img {
        max-width: 100% !important;
    }

    .form-control {
        border: 0.75pt solid #666 !important;
        box-shadow: none !important;
    }

    .mn-print-source a {
        text-decoration: none;
    }
}

/* In ấn (bổ sung v2, đợt 2): biểu mẫu góp ý không in (trang liên hệ in ra để lấy địa chỉ, điện thoại);
   liên kết "xem bản gốc" của dòng nguồn in kèm địa chỉ đầy đủ */
@media print {
    .mn-contact__form,
    .mn-form-result:empty {
        display: none !important;
    }

    .mn-source a[href^='http']::after {
        content: ' (' attr(href) ')' !important;
        font-size: 10pt;
        font-weight: 400;
        word-break: break-all;
    }
}

/* Bảng xếp chồng trên điện thoại: chú thích bảng chiếm trọn chiều ngang (không vỡ mỗi từ một dòng) */
@media (max-width: 639.98px) {
    .mn-table--stack caption {
        display: block;
        width: 100%;
    }
}