h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* --- Icon SVG custom (IconManager) — chuẩn hóa kích thước MudBlazor --- */
.mud-nav-menu .mud-icon-root {
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
    flex-shrink: 0;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.mud-nav-menu .mud-icon-root svg {
    width: 24px !important;
    height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
}

/* --- Tiêu đề trang CRUD (Google Font — icons-and-typography.mdc) --- */
.tsttn-page-title {
    font-family: "Be Vietnam Pro", "Roboto", sans-serif;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0.02em;
    line-height: 1.35;
    color: var(--mud-palette-primary, #594AE2);
}

/* Header app — branding (MainLayout): tiêu đề sạch, chuyên nghiệp, đồng bộ chữ hoa */
.tsttn-appbar-brand {
    font-family: "Be Vietnam Pro", "Roboto", sans-serif;
    font-weight: 700 !important;
    font-style: normal;
    font-size: 1.2rem !important;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    line-height: 1.3;
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.22);
}

/* AppBar: gradient tím tinh tế thay vì nền phẳng */
.mud-appbar {
    background-image: linear-gradient(135deg, #594AE2 0%, #7C6BF2 100%);
}

/* Shared layout utilities (MainLayout + Sub layouts) */
.tsttn-appbar-top {
    z-index: 1301;
}

.tsttn-main-content-padded {
    padding-bottom: 40px;
}

.tsttn-side-drawer {
    background: #ffffff;
    border-right: 1px solid #e2e8f0;
}

.tsttn-app-footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 28px;
    z-index: 1100;
    display: flex;
    align-items: center;
    padding: 0 16px;
}

.tsttn-app-footer--primary {
    background-color: #594AE2;
    color: #ffffff;
    box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.2);
}

/* Shared visual utilities (re-use across main + subweb) */
.tsttn-gradient-primary-surface {
    background-image: linear-gradient(135deg, #594AE2 0%, #7C6BF2 100%);
    color: #ffffff;
}

.tsttn-outline-on-primary {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.55) !important;
    background: rgba(255, 255, 255, 0.08);
}

.tsttn-card-soft {
    background: #ffffff;
    border: 1px solid #dbeafe;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.tsttn-card-soft--hover:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 32px rgba(30, 64, 175, 0.14);
    border-color: #93c5fd;
}

.tsttn-avatar-glow-primary {
    box-shadow: 0 6px 14px rgba(37, 99, 235, 0.28);
}

.tsttn-text-subtle {
    color: #64748b;
}

.tsttn-text-warning {
    color: #b45309;
}

.mud-icon-size-large:not(.led-year-display) svg {
    width: 32px !important;
    height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
}

/* Icon tiêu đề trang CRUD — khung an toàn, emoji Noto không tràn/viền trái */
.tsttn-page-icon.mud-icon-root {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    flex-shrink: 0;
    overflow: visible !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 2px 4px;
    box-sizing: border-box;
}

.tsttn-page-icon.mud-icon-size-large svg,
.tsttn-page-icon svg {
    width: 28px !important;
    height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    display: block;
}

.mud-icon-button .mud-icon-root svg {
    width: 24px !important;
    height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
}

/* Ép icon trên các Button chung */
.mud-button-icon-start svg {
    width: 20px !important;
    height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
}

/* --- Convention grid: tiêu đề cột căn giữa (DxGrid + MudTable) --- */
.tsttn-grid-convention .dxbl-grid-header-content,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-header-content {
    justify-content: center;
    text-align: center;
}

.tsttn-grid-convention .dxbl-grid-header-content > span:first-child,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-header-content > span:first-child {
    text-align: center;
    width: 100%;
}

.tsttn-mud-table-convention .mud-table-head .mud-table-cell {
    text-align: center;
}

/* --- Grid autofill: cột giãn theo nội dung; tràn thì cuộn ngang (DxGrid / DxTreeList) --- */
.dxbl-grid.tsttn-grid-convention,
.dxbl-tree-list.tsttn-grid-convention {
    overflow-x: auto;
}

/* Cây Phòng/Môn/Túi (MudTreeView) — chiều cao tối thiểu ~20 dòng */
.tsttn-phongmon-tree-panel {
    min-height: calc(36px * 20 + 16px);
}

.mud-treeview.tsttn-bo-tri-tree {
    max-height: min(75vh, 800px);
    min-height: calc(36px * 20);
    overflow-y: auto;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--mud-default-borderradius);
    padding: 4px 0;
}

.mud-treeview.tsttn-bo-tri-tree .mud-treeview-item-content {
    min-height: 32px;
}

/* XCDB tab Xử lý — thống kê ngành gọn (panel thu gọn + lưới chi tiết có cuộn) */
.tsttn-xcdb-thongke-panels {
    margin-bottom: 0;
}

.tsttn-xcdb-thongke-grid-wrap {
    overflow: auto;
    max-height: min(240px, 32vh);
}

.dxbl-grid.tsttn-xcdb-thongke-grid .dxbl-grid-table {
    width: 100%;
    min-width: 640px;
    table-layout: fixed;
}

/* Legacy DxTreeList (nếu còn dùng ở màn khác) */
.dxbl-tree-list.tsttn-bo-tri-tree {
    height: min(75vh, 800px);
    min-height: calc(36px * 20 + 44px);
}

/* Điều kiện bổ sung — 2 cột (pattern ThongKeDangNhap: panel max-height + overflow, cây cao hơn panel) */
.tsttn-dkbs-split {
    --tsttn-dkbs-panel-h: min(calc(100vh - 260px), 720px);
    --tsttn-dkbs-tree-h: min(calc(100vh - 200px), 780px);
    align-items: flex-start;
}

.tsttn-dkbs-tree-panel {
    max-height: var(--tsttn-dkbs-panel-h);
    min-height: 480px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}

.tsttn-dkbs-detail-panel {
    height: var(--tsttn-dkbs-panel-h);
    min-height: 480px;
    max-height: var(--tsttn-dkbs-panel-h);
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
}

/* Cây cao hơn panel → panel cuộn dọc nhẹ; DevExpress cuộn dọc/ngang bên trong cây */
.dxbl-tree-list.tsttn-dkbs-tree {
    height: var(--tsttn-dkbs-tree-h) !important;
    min-height: calc(36px * 20 + 44px) !important;
    width: 100% !important;
}

.dxbl-tree-list.tsttn-dkbs-tree .dxbl-tree-list-table {
    width: max-content;
    min-width: 100%;
}

.dxbl-tree-list.tsttn-dkbs-tree .dxbl-tree-list-data-cell,
.dxbl-tree-list.tsttn-dkbs-tree .dxbl-tree-list-data-cell .dxbl-tree-list-cell-display-template {
    overflow: visible !important;
    max-width: none !important;
}

.dxbl-tree-list.tsttn-bo-tri-tree .dxbl-tree-list-cell-display-template .mud-chip {
    max-width: 7rem;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-table,
.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-table {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-data-cell,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-header-cell,
.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-data-cell,
.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-header-cell {
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
    max-width: none;
    width: auto !important;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-data-cell .dxbl-grid-cell-display-template,
.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-data-cell .dxbl-tree-list-cell-display-template {
    overflow: visible;
    text-overflow: clip;
}

/* Ô lưới quản trị minh chứng — xuống dòng, căn giữa */
.tsttn-grid-cell-wrap-center {
    white-space: pre-line;
    text-align: center;
    padding: 8px 6px;
    line-height: 1.45;
    width: 100%;
    box-sizing: border-box;
}

.dxbl-grid.tsttn-grid-multiline-row .dxbl-grid-data-row > td {
    vertical-align: middle !important;
}

/* Cho phép click xuyên chip/template để chọn dòng DxGrid */
.tsttn-grid-row-select .tsttn-grid-row-select-pass,
.tsttn-grid-row-select .tsttn-grid-row-select-pass * {
    pointer-events: none;
}

.tsttn-grid-row-select .dxbl-grid-data-cell .tsttn-grid-pdf-btn,
.tsttn-grid-row-select .dxbl-grid-data-cell .tsttn-grid-pdf-btn *,
.tsttn-grid-row-select .tsttn-grid-row-select-pass .tsttn-grid-pdf-btn,
.tsttn-grid-row-select .tsttn-grid-row-select-pass .tsttn-grid-pdf-btn * {
    pointer-events: auto;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

/* Dò điểm XT — ô điểm chuẩn gọn (không viền hộp; gạch nhẹ khi hover/focus) */
.tsttn-do-diem-dc-cell {
    width: 100%;
    min-height: 32px;
    pointer-events: auto;
}

.tsttn-do-diem-dc-field {
    width: 96px !important;
    max-width: 96px !important;
    margin: 0 !important;
}

.tsttn-do-diem-dc-field .mud-input-control,
.tsttn-do-diem-dc-field.mud-input-control {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.tsttn-do-diem-dc-field .mud-input-slot,
.tsttn-do-diem-dc-field input,
.tsttn-do-diem-dc-field .mud-typography {
    text-align: center;
    font-size: 13px !important;
    line-height: 1.25 !important;
    font-weight: 400 !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

.tsttn-do-diem-dc-field .mud-input-adornment,
.tsttn-do-diem-dc-field .mud-button-root {
    font-size: 13px !important;
}

.tsttn-do-diem-dc-field .mud-icon-root {
    font-size: 16px !important;
}

.tsttn-do-diem-dc-field .mud-input {
    border-radius: 4px;
    transition: background-color 0.12s ease, box-shadow 0.12s ease;
}

.tsttn-do-diem-dc-field .mud-input:hover:not(.mud-disabled) {
    background-color: rgba(0, 0, 0, 0.04);
}

.tsttn-do-diem-dc-field .mud-input.mud-focused:not(.mud-disabled) {
    background-color: rgba(95, 54, 141, 0.08);
    box-shadow: inset 0 -2px 0 #5f368d;
}

/* Dò điểm — chỉ tô ô Lệch (không tô cả dòng) */
.tsttn-do-diem-lech {
    display: inline-block;
    min-width: 2.25rem;
    padding: 2px 8px;
    border-radius: 4px;
    text-align: center;
    font-weight: 600;
}

.tsttn-do-diem-lech--under {
    background: #e8f5e9;
    color: #c62828;
}

.tsttn-do-diem-lech--over {
    background: #c62828;
    color: #fff;
}

/* Dò điểm — dòng đang chọn: tím nhẹ (không dùng tô đỏ/xanh cả dòng) */
.mud-dialog .dxbl-grid.tsttn-do-diem-grid.tsttn-grid-row-select .dxbl-grid-selected-row > td:not(.dxbl-grid-empty-cell)::before,
.mud-dialog .dxbl-grid.tsttn-do-diem-grid.tsttn-grid-row-select .dxbl-grid-focused-row > td:not(.dxbl-grid-empty-cell)::before {
    background-color: rgba(95, 54, 141, 0.12) !important;
    opacity: 1 !important;
}

.mud-dialog .dxbl-grid.tsttn-do-diem-grid.tsttn-grid-row-select .dxbl-grid-selected-row > td:first-child,
.mud-dialog .dxbl-grid.tsttn-do-diem-grid.tsttn-grid-row-select .dxbl-grid-focused-row > td:first-child {
    box-shadow: inset 3px 0 0 #5f368d;
}

/* Chặn class tô cả dòng (under/over) nếu còn sót trên lưới dò điểm */
.dxbl-grid.tsttn-do-diem-grid .tsttn-nganh-chi-tieu--under,
.dxbl-grid.tsttn-do-diem-grid .tsttn-nganh-chi-tieu--under td,
.dxbl-grid.tsttn-do-diem-grid .tsttn-nganh-chi-tieu--over,
.dxbl-grid.tsttn-do-diem-grid .tsttn-nganh-chi-tieu--over td {
    background-color: transparent !important;
    color: inherit !important;
}

/* MudTable preview (import Excel) */
.tsttn-mud-table-convention .mud-table-container {
    overflow-x: auto;
}

.tsttn-mud-table-convention .mud-table-root {
    width: max-content;
    min-width: 100%;
    table-layout: auto;
}

.tsttn-mud-table-convention .mud-table-cell {
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
    max-width: none;
}

.tsttn-dsts-col-mapped {
    background-color: rgba(var(--mud-palette-success-rgb), 0.12) !important;
}

/* DxGrid/DxTreeList row select: keep default pointer-events to avoid breaking row focus/select
   on pages that use rich templates (DanhMucTinhThanh, DanhMucHemis, ...). */

/* DxGrid — checkbox/switch bool căn giữa ô */
.tsttn-grid-bool-cell,
.tsttn-perm-checkbox-cell {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 2rem;
}

.tsttn-grid-bool-cell .mud-switch,
.tsttn-grid-bool-cell .mud-button-root,
.tsttn-grid-bool-cell .tsttn-grid-bool-checkbox .mud-button-root,
.tsttn-perm-checkbox .mud-button-root {
    margin: 0;
    padding: 4px;
}

.tsttn-grid-row-select .dxbl-grid-data-cell .tsttn-grid-bool-cell,
.tsttn-grid-row-select .dxbl-grid-data-cell .tsttn-grid-bool-cell * {
    pointer-events: auto;
}

/* DxGrid compact — hàng thấp (Hồ sơ TS, danh mục dày dữ liệu) */
.dxbl-grid.tsttn-grid-compact .dxbl-grid-data-cell,
.dxbl-grid.tsttn-grid-compact .dxbl-grid-header-cell {
    padding: 2px 6px !important;
    font-size: 0.8125rem;
    line-height: 1.2;
}

.dxbl-grid.tsttn-grid-compact .dxbl-grid-header-content {
    min-height: 0;
    padding: 0;
}

.dxbl-grid.tsttn-grid-compact .tsttn-grid-bool-cell {
    min-height: 0;
}

.dxbl-grid.tsttn-grid-compact .tsttn-grid-bool-cell .mud-button-root,
.dxbl-grid.tsttn-grid-compact .tsttn-grid-bool-checkbox .mud-button-root {
    padding: 0;
}

.dxbl-grid.tsttn-grid-compact .mud-icon-button-size-small {
    padding: 2px;
}

.tsttn-perm-grid .dxbl-tree-list-data-cell,
.tsttn-perm-grid .dxbl-grid-data-cell {
    vertical-align: middle !important;
}

.tsttn-perm-split {
    min-height: 62vh;
}

.tsttn-perm-panel {
    min-height: 58vh;
}

/* DxGrid / DxTreeList: dòng chọn/focus nhẹ — blazing-berry mặc định tím đậm + chữ trắng */
.dxbl-grid.tsttn-grid-convention,
.dxbl-tree-list.tsttn-grid-convention {
    --tsttn-grid-row-selected-bg: rgba(95, 54, 141, 0.08);
    --tsttn-grid-row-focused-bg: rgba(95, 54, 141, 0.14);
    --tsttn-grid-row-focused-selected-bg: rgba(95, 54, 141, 0.18);
    --dxbl-grid-focus-color: #212529;
    --dxbl-grid-selection-color: inherit;
    --dxbl-grid-selection-focus-color: #212529;
}

/* MudDialog: tô dòng chọn rõ hơn (overlay dialog dễ làm mất highlight DX mặc định) */
.mud-dialog .dxbl-grid.tsttn-grid-convention.tsttn-grid-row-select .dxbl-grid-selected-row > td:first-child,
.mud-dialog .dxbl-grid.tsttn-grid-convention.tsttn-grid-row-select .dxbl-grid-focused-row > td:first-child,
.mud-dialog .dxbl-tree-list.tsttn-grid-convention.tsttn-grid-row-select .dxbl-tree-list-selected-row > td:first-child,
.mud-dialog .dxbl-tree-list.tsttn-grid-convention.tsttn-grid-row-select .dxbl-tree-list-focused-row > td:first-child {
    box-shadow: inset 4px 0 0 #5f368d;
}

.mud-dialog .dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-selected-row:not(.dxbl-grid-focused-row):not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell)::before,
.mud-dialog .dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-focused-row:not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell)::before,
.mud-dialog .dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-focused-row.dxbl-grid-selected-row:not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell)::before {
    background-color: var(--tsttn-grid-row-focused-selected-bg) !important;
    opacity: 1 !important;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-focused-row:not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
.dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-focused-row.dxbl-grid-selected-row:not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
.dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-selected-row:not(.dxbl-grid-focused-row):not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell) {
    color: #212529 !important;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-selected-row:not(.dxbl-grid-focused-row):not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell)::before,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-table.dxbl-grid-row-hover-enabled > tbody > tr.dxbl-grid-selected-row:not(.dxbl-grid-focused-row):not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge):not(.dxbl-grid-empty-row):hover > td:not(.dxbl-grid-edit-form):not(.dxbl-grid-indent-cell):not(.dxbl-grid-detail-cell):not(.dxbl-grid-empty-data-area):not(.dxbl-grid-empty-cell)::before {
    background-color: var(--tsttn-grid-row-selected-bg) !important;
    opacity: 1 !important;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-focused-row:not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell)::before,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-table.dxbl-grid-row-hover-enabled > tbody > tr.dxbl-grid-focused-row:not(.dxbl-grid-group-row):not(.dxbl-grid-group-footer-row):not(.dxbl-grid-edit-row):not(.dxbl-grid-empty-row):hover > td:not(.dxbl-grid-edit-form):not(.dxbl-grid-indent-cell):not(.dxbl-grid-detail-cell):not(.dxbl-grid-empty-data-area):not(.dxbl-grid-empty-cell)::before {
    background-color: var(--tsttn-grid-row-focused-bg) !important;
    opacity: 1 !important;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-focused-row.dxbl-grid-selected-row:not(.dxbl-grid-touch-selection):not(.dxbl-grid-touch-selection-edge) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell)::before,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-table .dxbl-grid-touch-selection:not(.dxbl-grid-group-row) > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell)::before {
    background-color: var(--tsttn-grid-row-focused-selected-bg) !important;
    opacity: 1 !important;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-focused-row .mud-input-control,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-selected-row .mud-input-control,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-focused-row .mud-input-control input,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-selected-row .mud-input-control input,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-focused-row .mud-input-control textarea,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-selected-row .mud-input-control textarea,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-focused-row .mud-input-slot,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-selected-row .mud-input-slot {
    color: #212529 !important;
    -webkit-text-fill-color: #212529;
}

.dxbl-grid.tsttn-grid-convention .dxbl-grid-focused-row .mud-input-outlined .mud-input-slot,
.dxbl-grid.tsttn-grid-convention .dxbl-grid-selected-row .mud-input-outlined .mud-input-slot {
    background-color: #fff;
}

.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-focused-row > td::before,
.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-selected-row.dxbl-tree-list-focused-row > td::before {
    background-color: var(--tsttn-grid-row-focused-bg) !important;
    opacity: 1 !important;
}

.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-selected-row:not(.dxbl-tree-list-focused-row) > td::before {
    background-color: var(--tsttn-grid-row-selected-bg) !important;
    opacity: 1 !important;
}

.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-focused-row > td,
.dxbl-tree-list.tsttn-grid-convention .dxbl-tree-list-selected-row > td {
    color: #212529 !important;
}

/* LED 7 đoạn — năm tuyển sinh (Web) */
.led-year-display {
    display: inline-block;
    flex-shrink: 0;
    vertical-align: middle;
    line-height: 0;
    overflow: hidden;
}

.led-year-display svg {
    width: 100%;
    height: 100%;
    display: block;
    vertical-align: top;
}

/* --- Trạng thái duyệt: chip + card (flex/grid — không absolute) --- */
.tsttn-trangthai-chip {
    flex-shrink: 0;
    max-width: 100%;
    white-space: nowrap;
}

.tsttn-status-card {
    box-sizing: border-box;
    max-width: 100%;
}

.tsttn-status-card__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.375rem 0.75rem;
}

.tsttn-status-card__main {
    min-width: 0;
}

.tsttn-status-card__main .mud-checkbox {
    width: 100%;
    max-width: 100%;
}

.tsttn-status-card__main .mud-checkbox .mud-typography-body1 {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* --- Operation overlay (CrudPageShell) --- */
.tsttn-operation-overlay {
    border-radius: inherit;
}

/* --- Responsive: mobile / tablet --- */
@media (max-width: 600px) {
    .tsttn-crud-shell .tsttn-page-title {
        font-size: 1.1rem !important;
        line-height: 1.3;
        word-break: break-word;
    }

    .tsttn-crud-shell .d-flex.gap-2.mb-4 {
        flex-wrap: wrap;
        justify-content: center !important;
    }

    .tsttn-crud-shell .mud-button-root {
        min-width: auto;
        flex: 1 1 calc(50% - 8px);
    }

    .tsttn-appbar-brand {
        font-size: 0.95rem !important;
        letter-spacing: 0.3px;
        line-height: 1.2 !important;
    }
}

@media (max-width: 960px) {
    .dxbl-grid.tsttn-grid-convention,
    .dxbl-tree-list.tsttn-grid-convention {
        -webkit-overflow-scrolling: touch;
    }
}

/* Tránh zoom input trên iOS */
@media (max-width: 600px) {
    .mud-input-control input,
    .mud-input-control textarea,
    .mud-select input {
        font-size: 16px !important;
    }
}

/* Tiêu đề vùng trong MudSelect (dòng Disabled) */
.mud-popover .mud-list-item.tsttn-select-group {
    opacity: 1 !important;
    pointer-events: none;
    min-height: 2rem;
    padding-top: 0.55rem;
    padding-bottom: 0.2rem;
    background: var(--mud-palette-background-gray);
    font-weight: 700;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--mud-palette-primary) !important;
}
.mud-popover .mud-list-item.tsttn-select-group .mud-list-item-icon {
    display: none;
}
.mud-popover .mud-list-item.tsttn-select-group .mud-list-item-text,
.mud-popover .mud-list-item.tsttn-select-group .mud-list-item-text * {
    font-weight: 700 !important;
    color: var(--mud-palette-primary) !important;
}

/* Rà soát — Nguồn tuyển: cao bằng TextField Dense Outlined (~40px) */
.tsttn-dnt-field .mud-input.mud-input-outlined .mud-input-slot {
    min-height: 40px !important;
    height: 40px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-inline: 8px !important;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}
.tsttn-dnt-field .tsttn-dnt-field__inner {
    min-height: 0 !important;
    width: 100%;
}
.tsttn-dnt-field .tsttn-dnt-field__text {
    font-weight: 600;
    line-height: 1.2;
    font-size: 1rem;
}
.tsttn-dnt-field--ok .tsttn-dnt-field__text {
    color: var(--mud-palette-success);
}
.tsttn-dnt-field--no .tsttn-dnt-field__text {
    color: var(--mud-palette-error);
}
.tsttn-dnt-field .mud-icon-root {
    font-size: 1.125rem !important;
}
.tsttn-dnt-field .tsttn-dnt-eye {
    height: 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    padding: 0 !important;
    margin: 0;
}
/* XLTS — bộ lọc phạm vi: Trình độ / Hình thức dãn theo nội dung chọn; Đợt nhận phần còn lại (có thể thu) */
.tsttn-xlts-scope-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    align-items: flex-end;
}
.tsttn-xlts-scope-filters__fit {
    flex: 0 0 auto;
    max-width: 100%;
    box-sizing: border-box;
}
.tsttn-xlts-scope-filters__fill {
    flex: 1 1 10rem;
    min-width: min(100%, 10rem);
}
.tsttn-xlts-scope-filters .mud-input-control {
    width: 100%;
}
.tsttn-xlts-scope-filters .mud-select .mud-input-slot,
.tsttn-xlts-scope-filters .mud-input-slot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Combobox lệnh + nút Play/In: hai cột (giống scope-filters __fit/__fill).
   Canh cạnh dưới nút với cạnh dưới ô outlined — không đụng icon mũi tên trong MudSelect. */
.tsttn-lenh-combo-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-end;
    gap: 8px;
    width: 100%;
}
.tsttn-lenh-combo-row__field {
    flex: 1 1 220px;
    min-width: 0;
    max-width: 100%;
}
.tsttn-lenh-combo-row__field > .mud-input-control {
    width: 100%;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.tsttn-lenh-combo-row__field .mud-input-control-helper-container {
    display: none;
}
.tsttn-lenh-combo-row__run {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-end;
    align-self: flex-end;
}
.tsttn-lenh-combo-row__run .mud-tooltip-root {
    display: flex !important;
    align-items: flex-end;
    line-height: 0;
    vertical-align: bottom;
}

/* Combobox phụ lục + nút Thêm: combo nhận phần còn lại (ellipsis), nút luôn trong màn */
.tsttn-phu-luc-select-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-end;
    gap: 8px;
    width: 100%;
    min-width: 0;
}
.tsttn-phu-luc-select-row > .mud-input-control {
    flex: 1 1 0;
    min-width: 0;
    max-width: 100%;
    margin-bottom: 0 !important;
}
.tsttn-phu-luc-select-row .mud-select .mud-select-input,
.tsttn-phu-luc-select-row .mud-select .mud-input-slot {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tsttn-phu-luc-select-row .tsttn-phu-luc-add.mud-button-root {
    flex: 0 0 auto;
    align-self: flex-end;
    margin: 0;
    white-space: nowrap;
}

.tsttn-dnt-field--ok .mud-input.mud-input-outlined:not(:hover):not(.mud-focused) .mud-input-outlined-border {
    border-color: var(--mud-palette-success);
}

/* Rà soát chi tiết — flex tự canh: không cố định số ô/hàng;
   min-width theo nội dung; không đủ chỗ → xuống hàng; ô cùng hàng flex-grow nhận phần dư */
.tsttn-ra-soat-fields {
    --rs-gap: 4px;
    display: flex;
    flex-wrap: wrap;
    gap: var(--rs-gap);
    width: 100%;
    align-items: stretch;
}
.tsttn-ra-soat-field {
    flex: 1 1 auto;
    min-width: 9rem;
    max-width: 100%;
    box-sizing: border-box;
}
.tsttn-ra-soat-field--full {
    flex: 1 1 100%;
    min-width: 100% !important;
    max-width: 100%;
}
.tsttn-ra-soat-field .mud-input-control,
.tsttn-ra-soat-field > .mud-expand-panel {
    width: 100%;
}

.tsttn-dnt-field--no .mud-input.mud-input-outlined:not(:hover):not(.mud-focused) .mud-input-outlined-border {
    border-color: var(--mud-palette-error);
}

/* Đối sánh sơ tuyển — dòng lệch */
.tsttn-doi-sanh-lech > td {
    background-color: color-mix(in srgb, var(--mud-palette-error) 12%, transparent) !important;
}

/* Điều kiện sơ tuyển — cùng kiểu Nguồn tuyển; View trong khung; bung khi dài */
.tsttn-dk-st-field.tsttn-dnt-field .mud-input.mud-input-outlined .mud-input-slot {
    height: auto !important;
    min-height: 40px !important;
}
.tsttn-dk-st-text {
    font-weight: 500;
    line-height: 1.35;
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tsttn-dk-st-text--open {
    white-space: pre-wrap;
    overflow: visible;
    text-overflow: unset;
    word-break: break-word;
}
.tsttn-dk-st-field:not(.tsttn-dk-st-field--open) .mud-input-slot {
    height: 40px !important;
}

.led-year-display__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-family: Consolas, monospace;
    color: #39FF14;
    font-weight: bold;
    font-size: 1.15rem;
    letter-spacing: 0.08em;
    background: #0B1A0B;
    border: 2px solid #1B5E20;
    border-radius: 8px;
    box-sizing: border-box;
}

/* =============================================================
   RESPONSIVE NORMALIZATION — chống tràn ngang toàn WebApp
   (xử lý đúng nguyên nhân, KHÔNG dùng overflow-x:hidden để che lỗi)
   Breakpoint chuẩn (đồng bộ MudBlazor):
     xs <600 · sm 600 · md 960 · lg 1280 · xl 1920
   ============================================================= */

/* 1. Box-sizing nhất quán + chặn trang co giãn vượt viewport */
*, *::before, *::after {
    box-sizing: border-box;
}

html, body {
    max-width: 100%;
}

/* 2. Media (ảnh/video/canvas) không bao giờ rộng hơn khung cha */
img, video, canvas, svg.tsttn-fluid {
    max-width: 100%;
}

img, video {
    height: auto;
}

/* 3. Flex/Grid item co lại đúng cách (min-width:auto của flexbox gây tràn).
   Áp cho các container layout chính của Mud — không đụng grid dữ liệu Dx. */
.mud-main-content,
.mud-container,
.mud-grid-item,
.mud-paper,
.mud-card,
.mud-expand-panel,
.mud-tabs-panels,
.mud-toolbar {
    min-width: 0;
}

/* MudStack hàng ngang: cho phép con co lại để không đẩy tràn */
.mud-stack-row > * {
    min-width: 0;
}

/* 4. Tiêu đề dài: ưu tiên xuống dòng thay vì đẩy tràn bố cục */
.tsttn-page-title,
.mud-card-header-content .mud-typography,
.mud-dialog-title,
.mud-expand-panel-header .mud-typography {
    overflow-wrap: anywhere;
    word-break: break-word;
    min-width: 0;
}

/* Tiện ích: tiêu đề một dòng + ellipsis (kèm title/tooltip để xem đầy đủ) */
.tsttn-ellipsis {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 5. Bảng dữ liệu: cuộn ngang riêng trong khung, không tràn cả trang.
   (Dx grid đã có .tsttn-grid-convention; bổ sung MudTable/MudSimpleTable thuần) */
.mud-table-container,
.mud-simple-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* 6. Toolbar thao tác: luôn cho phép xuống dòng để nút không bị đẩy ra ngoài */
.tsttn-toolbar-actions {
    flex-wrap: wrap;
}

/* Điều kiện bổ sung — hàng 10 slot môn nguồn trong dialog */
.tsttn-dkbs-mon-row {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
    overflow-x: auto;
    padding-bottom: 4px;
}

.tsttn-dkbs-mon-slot {
    flex: 0 0 220px;
    min-width: 220px;
}

/* 7. Dialog/Popup: không vượt quá màn hình, cuộn nội dung khi cần.
   Chỉ giới hạn bề rộng theo viewport trên màn hình nhỏ để không đè width desktop của Mud. */
.mud-dialog {
    max-height: calc(100dvh - 24px);
}

.mud-dialog-content {
    overflow-x: auto;
    overflow-y: auto;
}

/* DevExpress popup (Font, Paragraph…) — luôn trên MudDialog overlay */
body > dxbl-dropdown-dialog,
body > .dxbl-dropdown-dialog,
body > dxbl-flyout-root,
body > .dxbl-flyout-root,
body > dxbl-popup-root,
body > .dxbl-popup-root,
body > dxbl-itemlist-dropdown {
    z-index: 20000 !important;
}

.tsttn-phu-luc-html-editor {
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 4px;
}

/* 8. Vùng an toàn thiết bị (Capacitor / notch / iOS).
   env(safe-area-inset-*) = 0 trên desktop/trình duyệt thường → không đổi layout web. */
@supports (padding: max(0px)) {
    .mud-appbar.mud-appbar-fixed-top {
        padding-top: env(safe-area-inset-top);
        padding-left: max(16px, env(safe-area-inset-left));
        padding-right: max(8px, env(safe-area-inset-right));
    }

    .mud-layout .mud-main-content {
        padding-top: calc(var(--mud-appbar-height, 48px) + env(safe-area-inset-top));
    }

    footer.tsttn-app-footer,
    footer.thisinh-footer {
        padding-bottom: env(safe-area-inset-bottom);
        height: calc(28px + env(safe-area-inset-bottom)) !important;
        box-sizing: content-box;
    }
}

/* 9. Header app (MainLayout + Cổng Thí sinh): 3 vùng — logo trái · tiêu đề giữa · nút phải.
   Hai vùng cạnh chia đều không gian (flex:1 1 0) để tiêu đề LUÔN canh giữa tuyệt đối. */
.tsttn-appbar-zones {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 8px;
}

.tsttn-appbar-side {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.tsttn-appbar-side--left {
    justify-content: flex-start;
}

.tsttn-appbar-side--right {
    justify-content: flex-end;
}

/* Vùng giữa: không co giãn đẩy lệch — giữ tiêu đề ở chính giữa */
.tsttn-appbar-center {
    flex: 0 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* Tiêu đề: thu nhỏ chữ theo khung (clamp) trước, hết cỡ thì cắt chữ (ellipsis) */
.tsttn-appbar-title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    font-size: clamp(0.82rem, 2.6vw, 1.2rem) !important;
    line-height: 1.25 !important;
}

/* Tên người dùng trong vùng phải cũng được phép cắt chữ để không đẩy tiêu đề lệch */
.tsttn-appbar-username {
    min-width: 0;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* 9b. Khung ảnh dùng chung (logo + ảnh thẻ): ảnh nằm gọn trong vùng KÍCH THƯỚC CỐ ĐỊNH,
   flex-shrink:0 nên không bao giờ đẩy/giãn vùng hiển thị dữ liệu bên cạnh. */
.tsttn-img-frame {
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 6px;
    border: 1px solid var(--mud-palette-lines-default, #cbd5e1);
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.tsttn-img-frame > img,
.tsttn-img-frame > .mud-image {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
}

/* Logo: tỉ lệ vuông tối đa 2×2 — giữ trọn ảnh (contain) */
.tsttn-logo-frame {
    width: 64px;
    aspect-ratio: 1 / 1;
}

.tsttn-logo-frame.tsttn-logo-frame--sm {
    width: 36px;
    border-radius: 4px;
}

/* Biến thể không viền/không nền — dùng cho logo trên thanh tiêu đề (appbar) */
.tsttn-img-frame.tsttn-logo-frame--bare {
    border: none;
    background: transparent;
    box-shadow: none;
}

.tsttn-logo-frame > img,
.tsttn-logo-frame > .mud-image {
    object-fit: contain;
}

/* Ảnh thẻ: tỉ lệ tối đa 2×3 — phủ kín khung, canh phần đầu (center top) */
.tsttn-photo-frame {
    width: 96px;
    aspect-ratio: 2 / 3;
}

.tsttn-photo-frame > img,
.tsttn-photo-frame > .mud-image {
    object-fit: cover;
    object-position: center top;
}

/* 10. Đệm padding container hợp lý trên màn hình rất nhỏ */
@media (max-width: 480px) {
    .mud-main-content > .mud-container {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .tsttn-crud-shell .mud-paper.pa-4 {
        padding: 12px !important;
    }
}

/* 11. OTP / ô nhập theo ký tự: co theo khung trên máy nhỏ */
@media (max-width: 380px) {
    .otp-input {
        width: 38px !important;
        height: 46px !important;
        font-size: 1.4rem !important;
    }
}

/* Popup xem PDF Web — một màn: rộng 2/3 viewport, góc phải, không chặn form chính (Modal=false) */
.mud-dialog.tsttn-pdf-preview-dialog {
    width: calc(100vw * 2 / 3);
    max-width: calc(100vw * 2 / 3);
    margin: 12px 16px 0 auto !important;
    pointer-events: auto;
}

.mud-dialog.tsttn-pdf-preview-dialog .mud-dialog-content {
    padding: 8px 12px 4px;
}

.mud-dialog.tsttn-pdf-preview-dialog .tsttn-pdf-viewer-frame-single {
    display: block;
    width: 100%;
    height: min(620px, 65vh);
    border: none;
    background: #525659;
}

/* Không chặn click lên form phía sau */
.mud-overlay.tsttn-pdf-dialog-backdrop {
    background: transparent !important;
    pointer-events: none !important;
}

.mud-dialog-container:has(.tsttn-pdf-preview-dialog) {
    pointer-events: auto;
}

/* Xem trước report Web — iframe PDF inline (không DxReportViewer / SignalR) */
.tsttn-report-pdf-host {
    width: 100%;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 4px;
    overflow: hidden;
    background: #525659;
}

.tsttn-report-pdf-host .tsttn-report-pdf-frame {
    display: block;
    width: 100%;
    height: min(900px, calc(100vh - 220px));
    border: none;
    background: #525659;
}

/* 12. Dialog trên màn hình nhỏ: không vượt quá viewport (đè width desktop của Mud chỉ khi cần) */
@media (max-width: 600px) {
    .mud-dialog {
        max-width: calc(100vw - 16px) !important;
        margin: 8px !important;
    }

    .mud-dialog.tsttn-pdf-preview-dialog {
        width: min(calc(100vw * 2 / 3), calc(100vw - 16px)) !important;
        max-width: min(calc(100vw * 2 / 3), calc(100vw - 16px)) !important;
    }
}

/* Học bạ — bảng điểm sticky header */
.hoc-ba-score-wrap {
    overflow: auto;
    max-height: min(520px, 60vh);
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: 8px;
}

.hoc-ba-score-table {
    width: 100%;
    border-collapse: collapse;
}

.hoc-ba-score-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--mud-palette-background-gray);
    text-align: center;
    padding: 4px 4px;
    font-size: 0.8125rem;
    font-weight: 600;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    vertical-align: middle;
}

.hoc-ba-score-table tbody td {
    padding: 2px 4px;
    font-size: 0.8125rem;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    vertical-align: middle;
}

.hoc-ba-score-table-compact .hoc-ba-score-col-score {
    width: 88px;
}

.hoc-ba-score-table-compact .hoc-ba-score-col-subject {
    min-width: 140px;
}

.hoc-ba-score-cell-compact.mud-input-root,
.hoc-ba-score-cell-compact .mud-input-root {
    margin-top: 0;
    margin-bottom: 0;
}

.hoc-ba-score-cell-compact .mud-input-control-input-container,
.hoc-ba-score-table-compact .hoc-ba-score-col-score .mud-input-control-input-container {
    min-height: 28px;
}

.hoc-ba-score-cell-compact input.mud-input-slot-input,
.hoc-ba-score-table-compact .hoc-ba-score-col-score input.mud-input-slot-input {
    padding: 2px 4px !important;
    font-size: 0.8125rem;
    text-align: center;
}

.hoc-ba-score-table-compact .hoc-ba-kb-hint {
    font-size: 0.625rem;
    margin-top: 1px;
}

.hoc-ba-score-label {
    display: block;
    text-align: center;
    font-size: 0.8125rem;
    line-height: 1.5;
    min-height: 28px;
    padding: 2px 4px;
}

.hoc-ba-score-table .hoc-ba-score-col-stt {
    width: 48px;
    min-width: 48px;
    text-align: center;
}

.hoc-ba-score-table .hoc-ba-score-col-subject {
    text-align: left;
    min-width: 160px;
}

.hoc-ba-score-table .hoc-ba-score-col-score {
    text-align: center;
    width: 120px;
}

.hoc-ba-score-table .hoc-ba-score-col-khonghoc {
    text-align: center;
    width: 72px;
    min-width: 72px;
}

.hoc-ba-row-khong-hoc {
    background-color: rgba(158, 158, 158, 0.08);
}

.hoc-ba-score-table .hoc-ba-score-col-score .mud-input-root {
    margin-left: auto;
    margin-right: auto;
}

.hoc-ba-score-table .hoc-ba-score-col-score .mud-input-control-input-container {
    justify-content: center;
}

.hoc-ba-score-input {
    margin-left: auto;
    margin-right: auto;
}

/* So sánh khai báo cổng (XTT) — gợi ý nhẹ, không thêm cột */
.hoc-ba-row-diff td:first-child {
    box-shadow: inset 3px 0 0 var(--mud-palette-warning);
}

.hoc-ba-score-diff {
    background: rgba(255, 152, 0, 0.12);
}

.hoc-ba-kb-hint {
    font-size: 0.68rem;
    line-height: 1.1;
    color: var(--mud-palette-warning-darken);
    margin-top: 2px;
    white-space: nowrap;
}

.hoc-ba-field-diff .mud-input-outlined-border {
    border-color: var(--mud-palette-warning) !important;
}

.hoc-ba-admin-lop-info .hoc-ba-admin-label,
.hoc-ba-admin-semester .hoc-ba-admin-label {
    font-weight: 600;
    white-space: nowrap;
    width: 1%;
    color: var(--mud-palette-text-secondary);
}

.hoc-ba-admin-semester thead th {
    text-align: center;
    font-weight: 600;
}

.hoc-ba-admin-mon-table .hoc-ba-score-col-warn {
    width: 72px;
    min-width: 72px;
}

.hoc-ba-row-warn {
    background-color: rgba(255, 152, 0, 0.08);
}

.tsttn-stat-card {
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.tsttn-stat-card:hover {
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12);
}

.tsttn-inline-icon {
    display: inline-block;
    vertical-align: middle;
}

/* Menu ngữ cảnh tùy chỉnh (chuột phải trên DxGrid/DxTreeList) */
.tsttn-ctx-menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1300;
}

.tsttn-ctx-menu-panel {
    z-index: 1400;
    min-width: 240px;
}
/* XLTS — ô số trúng tuyển so với chỉ tiêu (lưới ngành) */
.tsttn-tt-cell {
    display: block;
    width: 100%;
    text-align: center;
    padding: 2px 4px;
    border-radius: 2px;
    font-weight: 600;
    line-height: 1.4;
}

.tsttn-tt-cell--under {
    background-color: #c8e6c9;
    color: #c62828;
}

.tsttn-tt-cell--over {
    background-color: #c62828;
    color: #ffffff;
}

/* XLTS — số trúng tuyển (điểm) > số lượng gọi: chữ số lượng gọi đỏ */
.tsttn-sl-goi--vuot-tt {
    color: #c62828;
    font-weight: 700;
}

/* XLTS — chênh lệch lần trước lệch biên (≤90% hoặc ≥110%): chữ đỏ nền trắng */
.tsttn-tt-cell--chenh-lech-alert {
    background-color: #ffffff;
    color: #c62828;
    border: 1px solid #ef9a9a;
}

/* XLTS — dòng ngành thiếu/vượt chỉ tiêu (popup nhập / thống kê điểm chuẩn) */
.tsttn-nganh-chi-tieu--under,
.tsttn-nganh-chi-tieu--under td {
    background-color: #c8e6c9 !important;
    color: #c62828 !important;
}

.tsttn-nganh-chi-tieu--over,
.tsttn-nganh-chi-tieu--over td {
    background-color: #c62828 !important;
    color: #ffffff !important;
}

/* XLTS — kiểm dò điểm chuẩn dự kiến: dòng lệch hệ thống vs tự tính */
.tsttn-diem-chuan-du-kien--lech,
.tsttn-diem-chuan-du-kien--lech td {
    background-color: #c62828 !important;
    color: #ffffff !important;
}

/* XLTS — thống kê KQ XT: dòng tổng lĩnh vực (group) */
.tsttn-thong-ke-kq-tong-c2,
.tsttn-thong-ke-kq-tong-c2 td,
.tsttn-thong-ke-kq-tong-khoi,
.tsttn-thong-ke-kq-tong-khoi td {
    font-weight: 700 !important;
}

/* XLTS — khóa kết quả XT: Đúng (đỏ) / Sai (xanh) */
.tsttn-kq-khoa-true {
    display: inline-block;
    min-width: 3.5rem;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    background-color: #c62828;
    color: #ffffff;
    font-weight: 600;
    text-align: center;
}

.tsttn-kq-khoa-false {
    display: inline-block;
    min-width: 3.5rem;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    background-color: #2e7d32;
    color: #ffffff;
    font-weight: 600;
    text-align: center;
}

/* Hồ sơ TS — bảng NV + nguồn tuyển mặc định / tổ hợp */
.tsttn-nv-nguon-wrap {
    overflow: auto;
    max-width: 100%;
    max-height: min(420px, 52vh);
    border: 1px solid var(--mud-palette-lines-default, #e0e0e0);
    border-radius: 8px;
    background: var(--mud-palette-surface, #fff);
}

.tsttn-nv-nguon-grid {
    --tsttn-grid-row-selected-bg: rgba(95, 54, 141, 0.1);
    --tsttn-nv-border: var(--mud-palette-lines-default, #dee2e6);
    --tsttn-nv-border-strong: rgba(0, 0, 0, 0.22);
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 0.8125rem;
    line-height: 1.2;
    white-space: nowrap;
}

.tsttn-nv-nguon-grid .tsttn-nv-th,
.tsttn-nv-nguon-grid .tsttn-nv-td {
    vertical-align: middle;
    padding: 2px 5px;
    border: 1px solid var(--tsttn-nv-border);
}

.tsttn-nv-nguon-grid thead .tsttn-nv-th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--mud-palette-background-gray, #f5f5f5);
    font-weight: 600;
    text-align: center;
    box-shadow: inset 0 -1px 0 var(--tsttn-nv-border-strong);
    padding: 5px 6px;
    line-height: 1.3;
}

.tsttn-nv-nguon-grid thead tr:first-child .tsttn-nv-th {
    top: 0;
}

.tsttn-nv-nguon-grid thead tr:nth-child(2) .tsttn-nv-th {
    top: 1.85rem;
    font-weight: 500;
    font-size: 0.75rem;
    line-height: 1.35;
    padding: 6px 6px;
    min-height: 1.75rem;
}

.tsttn-nv-nguon-grid .tsttn-nv-nguon-group {
    font-weight: 600;
    letter-spacing: 0.01em;
}

.tsttn-nv-nguon-grid .tsttn-nv-nguon-md {
    background-color: rgba(33, 150, 243, 0.12);
    border-bottom-color: rgba(33, 150, 243, 0.35);
}

.tsttn-nv-nguon-grid .tsttn-nv-nguon-th {
    background-color: rgba(76, 175, 80, 0.12);
    border-bottom-color: rgba(76, 175, 80, 0.35);
}

.tsttn-nv-nguon-grid .tsttn-nv-nguon-bo {
    background-color: rgba(255, 152, 0, 0.14);
    border-bottom-color: rgba(255, 152, 0, 0.35);
}

.tsttn-nv-nguon-grid .tsttn-nv-col-sai-lech {
    min-width: 110px;
}

.tsttn-nv-nguon-grid tbody tr.tsttn-nv-row-sai-lech > .tsttn-nv-td {
    background-color: rgba(244, 67, 54, 0.12) !important;
}

.tsttn-nv-nguon-grid tbody tr.tsttn-nv-row-chua-bo > .tsttn-nv-td {
    background-color: rgba(255, 235, 59, 0.12) !important;
}

.tsttn-nv-nguon-grid .tsttn-nv-border-section {
    border-left: 2px solid var(--tsttn-nv-border-strong) !important;
}

.tsttn-nv-nguon-grid .tsttn-nv-col-total {
    font-weight: 700;
    background-color: rgba(0, 0, 0, 0.03);
}

.tsttn-nv-nguon-grid tbody .tsttn-nv-col-total {
    background-color: rgba(95, 54, 141, 0.04);
}

.tsttn-nv-nguon-grid .tsttn-nv-col-stt {
    min-width: 3.25rem;
}

.tsttn-nv-nguon-grid .tsttn-nv-col-ma {
    min-width: 6.25rem;
}

.tsttn-nv-nguon-grid .tsttn-nv-col-ten {
    min-width: 10rem;
    white-space: normal;
    max-width: 14rem;
    text-align: left;
}

.tsttn-nv-nguon-grid .tsttn-nv-col-flag {
    min-width: 4.25rem;
}

.tsttn-nv-nguon-grid .tsttn-nv-col-ma-pttt {
    min-width: 5.5rem;
}

.tsttn-nv-nguon-grid .tsttn-nv-col-diem-tt {
    min-width: 4.25rem;
}

.tsttn-nv-nguon-grid .tsttn-nv-th-multiline {
    white-space: normal;
    line-height: 1.25;
}

.tsttn-nv-nguon-grid tbody tr:nth-child(even) > .tsttn-nv-td:not(.tsttn-nv-col-total) {
    background-color: rgba(0, 0, 0, 0.015);
}

.tsttn-nv-nguon-grid tbody tr.tsttn-nv-row-selected > .tsttn-nv-td {
    background-color: var(--tsttn-grid-row-selected-bg);
}

.tsttn-nv-nguon-grid tbody tr:hover > .tsttn-nv-td {
    background-color: rgba(95, 54, 141, 0.06);
}

.tsttn-nv-nguon-grid tbody tr.tsttn-nv-row-selected:hover > .tsttn-nv-td {
    background-color: var(--tsttn-grid-row-selected-bg);
}

.tsttn-nv-nguon-grid tbody tr.tsttn-nv-row-selected > .tsttn-nv-col-total {
    background-color: rgba(95, 54, 141, 0.14);
}

.tsttn-nv-nguon-grid .tsttn-grid-bool-cell {
    min-height: 0;
    padding: 0;
}

.tsttn-nv-nguon-grid .tsttn-grid-bool-checkbox .mud-button-root {
    padding: 0;
}

/* PTXT grid — Hồ sơ thí sinh (nhóm cột màu riêng) */
.tsttn-ptxt-grid .tsttn-ptxt-col-ma {
    min-width: 4.5rem;
}

.tsttn-ptxt-grid .tsttn-ptxt-col-ten {
    min-width: 10rem;
    max-width: 14rem;
    white-space: normal;
    text-align: left;
}

.tsttn-ptxt-grid .tsttn-ptxt-group-tohop {
    background-color: rgba(25, 118, 210, 0.1);
}

.tsttn-ptxt-grid .tsttn-ptxt-group-ccnn {
    background-color: rgba(0, 150, 136, 0.1);
}

.tsttn-ptxt-grid .tsttn-ptxt-group-dc {
    background-color: rgba(255, 152, 0, 0.12);
}

.tsttn-ptxt-grid .tsttn-ptxt-group-ut {
    background-color: rgba(156, 39, 176, 0.1);
}

.tsttn-ptxt-grid .tsttn-ptxt-group-dk {
    background-color: rgba(76, 175, 80, 0.1);
}