/* CTMTQG portal - theo Claude Main.dc.html + ctmtqg.dieutra.net */
:root {
    --ct-red: #9F1C1F;
    --ct-red-dark: #6E1214;
    --ct-gold: #E3B341;
    --ct-gold-soft: #FBE7C2;
    --ct-navy: #14365D;
    --ct-page: #F2F4F6;
    --ct-ink: #16202A;
    --ct-muted: #5B6672;
    --ct-line: #E1E6EB;
    --ct-ok: #1E7F4F;
    --ct-warn: #C98A12;
    --ct-bad: #C0392B;
    --ct-radius: 16px;
}



body.ctmt-app {
    background: var(--ct-page);
    color: var(--ct-ink);
    font-family: "Be Vietnam Pro", system-ui, sans-serif;
}
body.ctmt-app a { color: var(--ct-navy); text-decoration: none; }
body.ctmt-app a:hover { color: var(--ct-red); }
/* Nut Bootstrap dang the <a>: tra lai mau chu cua nut (vd. chu trang tren nut do "Tim kiem"), khong theo mau link chung */
body.ctmt-app a.btn { color: var(--bs-btn-color); }
body.ctmt-app a.btn:hover, body.ctmt-app a.btn:focus-visible { color: var(--bs-btn-hover-color); }
body.ctmt-app a.btn:active { color: var(--bs-btn-active-color); }
/* Nut "Tim kiem" trong modal tim kiem: mau do cua cong */
#searchModal .btn-danger {
    --bs-btn-bg: var(--ct-red); --bs-btn-border-color: var(--ct-red);
    --bs-btn-hover-bg: #7A1416; --bs-btn-hover-border-color: #7A1416;
    --bs-btn-active-bg: #6A1012; --bs-btn-active-border-color: #6A1012;
}
body.ctmt-app .num {
    font-family: "Barlow Semi Condensed", "Be Vietnam Pro", sans-serif;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.5px;
}



/* Override style.css green sticky header */
body.ctmt-app .site-header,
body.ctmt-app header.ct-portal-hdr.site-header {
    background: var(--ct-red) !important;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0) !important;
    position: sticky !important;
    top: 0;
    z-index: 1030 !important;
    transition: box-shadow .25s ease;
}
/* Header dính + thu gọn khi cuộn (theo mẫu ctmtqg.dieutra.net) */
body.ctmt-app header.ct-portal-hdr.site-header[data-compact="true"] {
    box-shadow: 0 8px 24px -12px rgba(15, 27, 42, .45) !important;
}
.site-header .ct-portal-nav { position: relative; top: auto; }
.ct-portal-hdr__in { transition: padding .25s ease; }
.ct-portal-hdr__logo { transition: width .25s ease, height .25s ease; }
.ct-portal-hdr__t1, .ct-portal-hdr__t2 { transition: font-size .25s ease, margin .25s ease; }
.ct-portal-hdr[data-compact="true"] .ct-portal-hdr__in { padding-top: 8px; padding-bottom: 8px; }
.ct-portal-hdr[data-compact="true"] .ct-portal-hdr__logo { width: 46px; height: 46px; }
.ct-portal-hdr[data-compact="true"] .ct-portal-hdr__t1 { font-size: 18px; }
.ct-portal-hdr[data-compact="true"] .ct-portal-hdr__t2 { font-size: 12.5px; margin-top: 1px; }
.ct-portal-hdr[data-compact="true"] .ct-portal-hdr__login { min-height: 38px; padding: 0.4rem 1rem; }
@media (max-width: 899px) {
    body.ctmt-app header.ct-portal-hdr.site-header { position: relative !important; }
}
@media (prefers-reduced-motion: reduce) {
    .site-header, .site-header * { transition: none !important; }
}
/* Site.master doGiam(): do chieu cao header day / thu gon, khong chay hieu ung */
.ct-portal-hdr.is-do, .ct-portal-hdr.is-do * { transition: none !important; }
body.ctmt-app .breadcrumb-bar { display: none !important; }
body.ctmt-app .site-header .nav-link {
    color: #2B3743 !important;
}
body.ctmt-app .site-header .nav-link:hover {
    background: transparent !important;
    color: var(--ct-red) !important;
}
body.ctmt-app .main-content > .container-fluid {
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1.5rem !important;
    padding-bottom: 2rem !important;
}



/* Ngay so lieu cong bo: cot phai cua header, tren nut Dang nhap (Site.master .ct-portal-hdr__phai) */
.ct-portal-hdr__phai { display: flex; flex-direction: column; align-items: flex-end; gap: 0.45rem; margin-left: auto; flex-shrink: 0; }
.ct-hdr-live {
    display: inline-flex; align-items: center; gap: 0.45rem; white-space: nowrap;
    font-size: 0.8125rem; font-weight: 500; color: rgba(255, 255, 255, .88);
}
.ct-portal-hdr[data-compact="true"] .ct-portal-hdr__phai { flex-direction: row; align-items: center; gap: 0.9rem; }
.ct-portal-hdr[data-compact="true"] .ct-hdr-live { font-size: 0.75rem; }
.ct-hdr-live.is-an { display: none; } /* Site.master: bi xuong dong rieng duoi ten chuong trinh */
.ct-live-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #3DDC84;
    display: inline-block;
    animation: ct-pulse 1.6s ease-in-out infinite;
}
@keyframes ct-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.25; }
}



.ct-portal-hdr {
    background: var(--ct-red);
    color: #fff;
    border-bottom: 4px solid var(--ct-gold);
}
/* May tinh: duong vang nam giua khoi do va thanh menu (nhu ctmtqg.dieutra.net); dien thoai an menu nen giu duoi app bar */
@media (min-width: 992px) {
    .ct-portal-hdr { border-bottom: 0; }
    .ct-portal-hdr .ct-portal-nav { border-top: 4px solid var(--ct-gold); }
}
.ct-portal-hdr__in {
    max-width: 1320px;
    margin: 0 auto;
    padding: 1.35rem 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
}
.ct-portal-hdr__brand {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #fff !important;
    text-decoration: none !important;
    min-width: 0;
}
.ct-portal-hdr__logo {
    width: 80px;
    height: 80px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.35));
}
.ct-portal-hdr__t1 {
    display: block;
    font-size: clamp(1.1rem, 2.5vw, 1.625rem);
    font-weight: 800;
    letter-spacing: 0.5px;
    line-height: 1.2;
}
.ct-portal-hdr__t2 {
    display: block;
    font-size: clamp(0.88rem, 1.7vw, 1.0625rem);
    font-weight: 700;
    color: var(--ct-gold-soft);
    margin-top: 0.25rem;
    letter-spacing: 0.3px;
    line-height: 1.35;
}
.ct-portal-hdr__login {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: #fff;
    color: var(--ct-red) !important;
    font-weight: 700;
    font-size: 0.9375rem;
    padding: 0.75rem 1.25rem;
    border-radius: 999px;
    text-decoration: none !important;
    min-height: 44px;
    white-space: nowrap;
    box-sizing: border-box;
}
.ct-portal-hdr__login:hover { background: #fff8ef; color: var(--ct-red-dark) !important; }



.ct-portal-nav {
    background: #fff !important;
    border-bottom: 1px solid #DDE3E9;
    position: sticky;
    top: 0;
    z-index: 1000;
    padding: 0 !important;
}
.ct-portal-nav__in {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.25rem;
    align-items: center;
    justify-content: space-between;
}
/* Menu luon canh trai: style.css dat .site-header-nav flex-end -> khi o loc Nam/Dia ban xuong hang rieng (man hep, zoom) menu bi day sang phai */
.ct-portal-nav .site-header-nav { justify-content: flex-start; }
.ct-portal-nav .navbar-toggler {
    color: var(--ct-red);
    border: 0;
}
.ct-mnav {
    flex-wrap: wrap;
    gap: 0.25rem;
}
.ct-portal-nav .ct-mnav__link,
body.ctmt-app .site-header .ct-mnav__link {
    display: inline-flex !important;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 0.875rem !important;
    min-height: 48px;
    box-sizing: border-box;
    font-weight: 600 !important;
    font-size: 0.9375rem !important;
    color: #2B3743 !important;
    border-bottom: 3px solid transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
}
.ct-portal-nav .ct-mnav__link i { font-size: 1.05rem; }
.ct-portal-nav .ct-mnav__link:hover,
body.ctmt-app .site-header .ct-mnav__link:hover {
    color: var(--ct-red) !important;
    background: transparent !important;
}
.ct-portal-nav .ct-mnav__link.is-on,
body.ctmt-app .site-header .ct-mnav__link.is-on {
    color: var(--ct-red) !important;
    font-weight: 700 !important;
    border-bottom-color: var(--ct-red) !important;
    background: transparent !important;
}
.ct-mnav__bell { position: relative; }
.ct-mnav__badge {
    background: var(--ct-red);
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 700;
    border-radius: 999px;
    padding: 0.05rem 0.45rem;
    line-height: 1.3;
}
.ct-mnav__dd {
    width: 360px;
    max-width: calc(100vw - 32px);
    border: 1px solid var(--ct-line);
    border-radius: 16px;
    box-shadow: 0 18px 40px -12px rgba(15, 27, 42, 0.35);
    padding: 0.85rem;
}
.ct-mnav__dd .dropdown-header {
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.6px;
    color: var(--ct-muted);
}
.ct-mnav__dd .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.55rem 0.65rem;
    border-radius: 10px;
    color: var(--ct-ink);
    white-space: normal;
}
.ct-mnav__dd .dropdown-item:hover { background: #F4F6F8; }
.ct-mnav__dd .dropdown-item small { color: var(--ct-muted); }
.ct-mnav__dot {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    flex-shrink: 0;
}
.ct-portal-nav__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    align-items: center;
    padding: 0.5rem 0;
}
.ct-portal-nav__filters label {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ct-muted);
    margin: 0;
}
.ct-portal-nav .ct-filter__nam,
.ct-portal-nav .ct-filter__tinh {
    height: 40px;
    border: 1px solid #C9D2DB;
    border-radius: 10px;
    padding: 0 0.65rem;
    background: #fff;
    color: var(--ct-ink);
    font-weight: 600;
    font-size: 0.875rem;
}
.ct-portal-nav .ct-filter__tinh { max-width: 180px; }
.ct-portal-nav__filters .ct-filter__nhan { gap: 0; font-size: 1.05rem; color: var(--ct-red); }
/* Phan trang bang quan tri (js/ctmt-phantrang.js), cung kieu Admin/Chat_CauTraLoi.aspx */
.ct-pt-an { display: none !important; }
.ct-pt { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; margin-top: .75rem; padding: .6rem .85rem; background: #fff; border: 1px solid #DEE2E6; border-radius: 8px; }
.ct-pt[hidden] { display: none; }
.ct-pt__trai, .ct-pt__phai { display: flex; align-items: center; gap: .45rem; flex-wrap: wrap; }
.ct-pt__nhan { font-size: .8rem; color: #6C757D; white-space: nowrap; }
.ct-pt__chon { width: auto; min-width: 4.5rem; }
.ct-pt__tin { flex: 1 1 12rem; text-align: center; font-size: .82rem; color: #6C757D; }
.ct-pt .btn:disabled { opacity: .45; pointer-events: none; }
@media (max-width: 768px) {
    .ct-pt { flex-direction: column; align-items: stretch; }
    .ct-pt__trai, .ct-pt__phai { justify-content: center; }
    .ct-pt__tin { order: -1; flex: none; }
}
/* Thanh menu: bo vien focus xanh mac dinh cua Bootstrap; ban phim (focus-visible) dung vien vang cua cong */
body.ctmt-app .site-header .nav-link:focus,
body.ctmt-app .site-header .dropdown-toggle:focus { box-shadow: none !important; outline: none; }
body.ctmt-app .site-header .nav-link:focus-visible { outline: 2px solid var(--ct-gold); outline-offset: -2px; border-radius: 6px; }
/* Man 992-1365px: thu khoang menu de menu (ca ADMIN) va o Dia ban vua mot hang */
@media (min-width: 992px) and (max-width: 1365.98px) {
    .ct-portal-nav .ct-mnav__link,
    body.ctmt-app .site-header .ct-mnav__link { padding-left: 0.7rem !important; padding-right: 0.7rem !important; }
}



.ct-ticker {
    background: #FFF7E6;
    border-bottom: 1px solid #F1DFB8;
    overflow: hidden;
}
.ct-ticker__in {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0.65rem 1.5rem;
    display: flex;
    gap: 1rem;
    align-items: center;
}
.ct-ticker__badge {
    flex-shrink: 0;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #fff;
    background: var(--ct-red);
    border: 0;
    border-radius: 6px;
    padding: 0.25rem 0.65rem;
}
.ct-ticker__track {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 40px), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 40px), transparent 100%);
}
.ct-ticker__move,
.ticker-track {
    display: inline-flex;
    gap: 3rem;
    white-space: nowrap;
    animation: ct-tick 45s linear infinite;
    font-size: 0.875rem;
    font-weight: 500;
    color: #4A3A12;
}
body.ctmt-app .ct-ticker__move > a { color: inherit; text-decoration: none; }
body.ctmt-app .ct-ticker__move > a:hover { color: var(--ct-red); text-decoration: underline; }
.ct-ticker__move > *::before {
    content: "◆";
    color: var(--ct-gold);
    font-size: 0.625rem;
    margin-right: 0.65rem;
}
.ct-ticker__more {
    flex-shrink: 0;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--ct-red) !important;
}
@keyframes ct-tick {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .ct-ticker__move, .ticker-track, .ct-live-dot { animation: none; }
}
/* Giam chuyen dong: doi lan luot tung tin (JS trong vn/Site.master them .is-tung) */
.ct-ticker__move.is-tung { display: block; animation: none; overflow: hidden; text-overflow: ellipsis; }
.ct-ticker__move.is-tung > * { display: none; }
.ct-ticker__move.is-tung > .is-hien { display: inline; }



/* Chi khoi noi dung trang chu (vn/Default.aspx), khong ap cho body.ct-home (Site.Master gan class nay vao body trang chu) */
div.ct-home {
    max-width: 1320px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    padding-bottom: 1.5rem;
}
.ct-home-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    align-items: stretch;
}
.ct-home-row > .ct-gn,
.ct-home-row > .ct-map {
    flex: 1 1 520px;
    min-width: 0;
}



.ct-kpi {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}
.ct-kpi__card {
    border-radius: var(--ct-radius);
    padding: 1.05rem 1.15rem;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    border: 1px solid transparent;
}
.ct-kpi__card .num {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    flex: 0 0 auto;
}
.ct-kpi__card .lbl {
    font-size: 0.92rem;
    font-weight: 500;
    color: #4A5260;
    line-height: 1.3;
    min-width: 0;
}
.ct-kpi__card--blue {
    background: linear-gradient(135deg, #EAF2FC 0%, #F7FAFE 100%);
    border-color: #D6E4F5;
    border-left: 4px solid #2F6FC0;
}
.ct-kpi__card--blue .num { color: #14365D; }
.ct-kpi__card--green {
    background: linear-gradient(135deg, #E9F5EE 0%, #F7FBF8 100%);
    border-color: #D3EADC;
    border-left: 4px solid #2E8B57;
}
.ct-kpi__card--green .num { color: #1C5E3D; }
.ct-kpi__card--gold {
    background: linear-gradient(135deg, #FBF3E2 0%, #FEFBF4 100%);
    border-color: #F0E2C2;
    border-left: 4px solid #C98A12;
}
.ct-kpi__card--gold .num { color: #7A4E08; }
.ct-kpi__card--purple {
    background: linear-gradient(135deg, #F3EDF8 0%, #FBF9FD 100%);
    border-color: #E4D8EF;
    border-left: 4px solid #8E5BB5;
}
.ct-kpi__card--purple .num { color: #5B2D7A; }



.ct-sec__head {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem 1.5rem;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 0.85rem;
}
.ct-sec__head h2 {
    margin: 0;
    font-size: 1.4rem;
    font-weight: 800;
}
/* Link "Xem chi tiết" cạnh tiêu đề mục: dạng nút viên thuốc, mũi tên trượt khi hover */
body.ctmt-app a.ct-sec__more {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-left: 0.6rem;
    padding: 0.3rem 0.8rem;
    vertical-align: middle;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--ct-red);
    background: #FDF1F1;
    border: 1px solid #F1D3D4;
    border-radius: 999px;
    white-space: nowrap;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
body.ctmt-app a.ct-sec__more span { transition: transform .15s ease; }
body.ctmt-app a.ct-sec__more:hover,
body.ctmt-app a.ct-sec__more:focus-visible {
    color: #fff;
    background: var(--ct-red);
    border-color: var(--ct-red);
}
body.ctmt-app a.ct-sec__more:hover span { transform: translateX(3px); }
.ct-sec__lead {
    margin: 0.25rem 0 0;
    font-size: 0.88rem;
    color: var(--ct-muted);
}
.ct-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    font-size: 0.82rem;
    color: #3A4652;
}
.ct-legend i {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    display: inline-block;
    margin-right: 0.35rem;
    vertical-align: -1px;
}
.ct-legend__ok i { background: var(--ct-ok); }
.ct-legend__mid i { background: var(--ct-warn); }
.ct-legend__bad i { background: var(--ct-bad); }



/* The linh vuc dang bang gon (Default.aspx.vb TheLv, DongChiTieu): uu tien thay nhieu so lieu tren mot man hinh */
.ct-lv-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr));
    gap: 0.65rem;
}
.ct-lv {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 0.6rem 0.75rem 0.3rem;
    border: 1px solid color-mix(in srgb, var(--lv) 20%, transparent);
    border-top: 3px solid var(--lv);
    border-radius: 10px;
    background: #FFFFFF;
    text-decoration: none !important;
    color: inherit !important;
    transition: box-shadow .15s ease, border-color .15s ease;
}
.ct-lv:hover { border-color: var(--lv); box-shadow: 0 6px 16px -10px var(--lv); }
.ct-lv__top { display: flex; gap: 0.5rem; align-items: center; padding-bottom: 0.4rem; }
.ct-lv__ico {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--lv) 12%, #FFFFFF);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--lv);
    font-size: 0.95rem;
    flex-shrink: 0;
}
.ct-lv__dau { flex: 1; min-width: 0; }
.ct-lv__dong1 { display: flex; align-items: center; gap: 0.3rem; min-width: 0; }
.ct-lv__title { flex: 1 1 auto; min-width: 0; margin: 0; font-size: 0.95rem; font-weight: 800; line-height: 1.2; color: var(--lv); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-lv__meta { font-size: 0.7rem; line-height: 1.25; color: var(--ct-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-lv__badge { flex: none; font-size: 0.65rem; font-weight: 700; line-height: 1.3; padding: 0.1rem 0.4rem; border-radius: 999px; white-space: nowrap; }
.ct-lv__badge--ok { background: #E8F6EE; color: #1C5E3D; }
.ct-lv__badge--mid { background: #FBF0D9; color: #7A5208; }
.ct-lv__badge--bad { background: #FBECEC; color: #8B1E1A; }
.ct-lv__pv { flex: 0 1 auto; min-width: 0; font-size: 0.65rem; font-weight: 700; line-height: 1.3; padding: 0.1rem 0.4rem; border-radius: 999px; background: #F2F4F7; color: #5F6B77; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-lv__pv--tinh { background: #FCEDEA; color: var(--ct-red); }
.ct-lv__mui { flex: none; font-size: 0.7rem; color: var(--lv); }
/* Moi chi tieu mot dong: ten + muc tieu ben trai, so + so ky truoc ben phai */
.ct-lv__ct {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 0.6rem;
    padding: 0.28rem 0;
    border-top: 1px solid #EEF1F4;
}
.ct-lv__ct .name { grid-row: 1 / span 2; display: flex; align-items: flex-start; gap: 0.35rem; font-size: 0.78rem; font-weight: 600; line-height: 1.25; }
.ct-lv__ct .name > span:last-child { min-width: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.ct-lv__ct .name small { font-size: 0.7rem; font-weight: 500; color: var(--ct-muted); }
.ct-lv__so { max-width: 9.5rem; text-align: right; color: var(--lv); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.1; }
.ct-lv__so .num { font-size: 1.05rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.ct-lv__so .unit { font-size: 0.72rem; font-weight: 700; }
.ct-lv__ct--1 .ct-lv__so .num { font-size: 1.3rem; }
.ct-lv__ss { max-width: 12rem; text-align: right; font-size: 0.68rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-lv__rong { padding: 0.5rem 0; font-size: 0.8rem; color: var(--ct-muted); }
/* Tang / giam so ky truoc: mau theo tot / xau, khong dung mau linh vuc (Default.aspx.vb ChenhLechHtml) */
.ct-lv__delta--tot { color: var(--ct-ok); font-weight: 700; }
.ct-lv__delta--kem { color: var(--ct-bad); font-weight: 700; }
.ct-lv__delta--td { color: #5F6B77; font-weight: 700; }
.ct-legend__td i { background: #9AA5B1; }
/* So thu tu quan tam 1-2-3 truoc ten chi tieu (so 1 to dac) */
.ct-lv__stt { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1rem; height: 1rem; margin-top: 0.03rem;
    border-radius: 50%; border: 1px solid var(--lv, #14365D); color: var(--lv, #14365D); background: #fff;
    font-size: 0.62rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.ct-lv__stt--1 { background: var(--lv, #14365D); color: #fff; }
/* Pham vi so lieu: Ca nuoc / Tinh dang loc (Default.aspx.vb PhamViHtml) */
.ct-pham-vi { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; padding: 5px 12px; border-radius: 999px; background: #EEF1F4; color: #3B4652; font-size: 13px; }
.ct-pham-vi b { color: var(--ct-ink); }
.ct-pham-vi--tinh { background: #FCEDEA; color: var(--ct-red); border: 1.5px solid var(--ct-red); font-size: 14px; padding: 6px 6px 6px 14px; }
.ct-pham-vi--tinh b { color: var(--ct-red); font-size: 15px; }
body.ctmt-app .ct-pham-vi--tinh a { display: inline-flex; align-items: center; gap: 4px; margin-left: 4px; padding: 3px 10px; border-radius: 999px; background: var(--ct-red); color: #FFFFFF; font-size: 12px; font-weight: 700; }
body.ctmt-app .ct-pham-vi--tinh a:hover { background: #7A1416; color: #FFFFFF; }



.ct-gn {
    background: #fff;
    border: 1px solid #E2E7EC;
    border-radius: 18px;
    padding: 1.15rem 1.2rem 1rem;
}
.ct-gn__summary {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: 1rem;
    margin-bottom: 1rem;
}
.ct-gn__big .num {
    font-size: 2.8rem;
    font-weight: 700;
    color: var(--ct-ok);
    line-height: 1;
}
.ct-gn__sub { color: var(--ct-muted); font-size: 0.9rem; margin-top: 0.35rem; }
.ct-gn__expect {
    background: #F7F9FB;
    border-radius: 12px;
    padding: 0.85rem 1rem;
}
.ct-gn__expect strong { font-size: 1.4rem; }
.ct-gn table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}
.ct-gn th, .ct-gn td {
    padding: 0.55rem 0.4rem;
    border-bottom: 1px solid #EEF2F6;
    text-align: left;
}
.ct-gn th { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ct-muted); }
.ct-gn .bar-cell { min-width: 140px; }
.ct-gn .bar {
    position: relative;
    height: 10px;
    border-radius: 999px;
    background: #EDF0F3;
    overflow: hidden;
}
.ct-gn .bar > i {
    position: absolute;
    top: 0; bottom: 0;
    width: 2px;
    background: #16202A;
    z-index: 2;
}
.ct-gn .bar > span {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: var(--ct-ok);
}
.ct-gn__note { margin: 0.75rem 0 0; font-size: 0.8rem; color: var(--ct-muted); }



.ct-quick {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}
.ct-quick a {
    --q: #9F1C1F;
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 44px;
    background: linear-gradient(135deg, #FCEEEC 0%, #FFFAF9 100%);
    border: 1px solid #F2D9D5;
    border-radius: 16px;
    padding: 18px;
    text-decoration: none !important;
    color: var(--ct-ink) !important;
    transition: transform .15s ease, box-shadow .15s ease;
}
.ct-quick a:nth-child(2) { --q: #9A6A0C; background: linear-gradient(135deg, #FBF3E1 0%, #FFFCF5 100%); border-color: #F0E3C4; }
.ct-quick a:nth-child(3) { --q: #1F5FAF; background: linear-gradient(135deg, #EAF1FB 0%, #F8FBFE 100%); border-color: #D6E3F4; }
.ct-quick a:hover { transform: translateY(-2px); box-shadow: 0 10px 22px -12px rgba(15, 27, 42, .45); }
.ct-quick .ct-quick__ico {
    width: 46px; height: 46px; border-radius: 12px; background: #fff; color: var(--q);
    box-shadow: 0 4px 12px -6px var(--q);
    display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 22px;
    margin: 0;
}
.ct-quick strong { display: block; font-size: 16px; font-weight: 800; }
.ct-quick span span { display: block; font-size: 12px; color: var(--ct-muted); margin-top: 2px; }
@media (prefers-reduced-motion: reduce) { .ct-quick a { transition: none; } .ct-quick a:hover { transform: none; } }



.ct-login-page {
    max-width: 1100px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 1.5rem;
    align-items: start;
}
.ct-login-hero {
    background: linear-gradient(140deg, #14365D 0%, #0B1A2C 100%);
    color: #fff;
    border-radius: 18px;
    padding: 1.75rem 1.5rem;
}
.ct-login-hero .eyebrow {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    background: rgba(255,255,255,0.14);
    border-radius: 999px;
    padding: 0.25rem 0.65rem;
    margin-bottom: 0.85rem;
}
.ct-login-hero h1 { font-size: 1.55rem; font-weight: 800; line-height: 1.3; margin: 0 0 0.75rem; }
.ct-login-hero p { opacity: 0.92; margin-bottom: 1rem; }
.ct-login-hero ul { margin: 0; padding-left: 1.1rem; }
.ct-login-hero li { margin-bottom: 0.45rem; }
.ct-login-box {
    background: #fff;
    border: 1px solid #E2E7EC;
    border-radius: 18px;
    padding: 1.5rem 1.35rem;
}
.ct-login-box h2 { font-size: 1.25rem; font-weight: 800; margin-bottom: 0.35rem; }
/* Trang dang nhap gon: chi o dang nhap, giua theo chieu ngang */
.ct-login-page--gon { display: block; max-width: 440px; margin: 2.5rem auto; }
.ct-login-page--gon .ct-login-box { padding: 1.75rem 1.5rem; box-shadow: 0 10px 30px rgba(15, 27, 42, .08); }
.ct-admin-hub .stat-card,
.ct-admin-hub .admin-card {
    border-radius: 14px;
    border: 1px solid #E2E7EC;
    background: #fff;
}
.ct-admin-hub .stat-value { color: var(--ct-ok); font-weight: 800; font-size: 1.6rem; }



@media (max-width: 900px) {
    .ct-portal-hdr__logo { width: 56px; height: 56px; }
    .ct-portal-hdr__in { padding: 1rem; }
    .ct-gn__summary { grid-template-columns: 1fr; }
    .ct-login-page { grid-template-columns: 1fr; }
    .ct-portal-nav__filters { width: 100%; }
    .ct-portal-nav__in { padding: 0 1rem; }
    .ct-ticker__in { padding: 0.55rem 1rem; }
    .ct-mnav__link span { font-size: 0.85rem; }
}
@media (max-width: 576px) {
    .ct-portal-hdr__login span { display: none; }
    .ct-ticker__more { display: none; }
}


/* O nhap khoa API (khong phai mat khau nguoi dung): che ky tu bang CSS */
.ct-an-khoa { -webkit-text-security: disc; text-security: disc; }

/* Trang chu: "Dang xem" + chon dia ban cung hang (vn/Default.aspx.vb) */
.ct-pham-vi-hang { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: 8px; }
.ct-pham-vi-hang .ct-pham-vi { margin-top: 0; }
.ct-pham-vi__loc { display: inline-flex; align-items: center; gap: 6px; }
.ct-pham-vi__loc .ct-filter__nhan { display: inline-flex; align-items: center; gap: 4px; margin: 0; font-size: 13px; font-weight: 600; color: var(--ct-red); white-space: nowrap; }
.ct-pham-vi__loc .ct-chon, .ct-pham-vi__loc > select { width: 230px; max-width: 100%; }
.ct-pham-vi__loc .ct-filter__tinh { height: 34px; padding: 0 2rem 0 .75rem; border: 1px solid #C9D2DB; border-radius: 999px; background-color: #fff;
    background-image: var(--bs-form-select-bg-img); background-repeat: no-repeat; background-position: right .7rem center; background-size: 14px 10px;
    color: var(--ct-ink); font-weight: 600; font-size: 13.5px; line-height: 32px; }
@media (max-width: 575.98px) {
    .ct-pham-vi__loc { flex: 1 1 100%; }
    .ct-pham-vi__loc .ct-chon, .ct-pham-vi__loc > select { flex: 1; width: auto; }
    .ct-pham-vi__loc .ct-filter__tinh { height: 40px; font-size: 15px; }
}



/* ===== Mau giao dien trang chu (CtmtMauGiaoDien, Module40) ===== */
.ct-home-row > * { flex: 1 1 520px; min-width: 0; }
/* Bang gioi thieu chuong trinh */
.ct-gt {
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(90% 120% at 100% 0%, rgba(122, 32, 120, .55) 0%, transparent 60%),
        linear-gradient(120deg, var(--ct-red-dark) 0%, var(--ct-red) 45%, #5A1640 100%);
    box-shadow: 0 14px 34px -18px rgba(110, 18, 20, .65);
}
.ct-gt__in { padding: 1.6rem 1.8rem 1.7rem; }
.ct-gt__nhan { margin: 0 0 .35rem; font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #F6C66B; }
.ct-gt__tieu-de { margin: 0 0 .6rem; font-size: clamp(1.25rem, 2.4vw, 1.9rem); font-weight: 800; line-height: 1.25; color: #fff; }
.ct-gt__mo-ta { margin: 0 0 1.2rem; font-size: .95rem; line-height: 1.55; color: rgba(255, 255, 255, .88); max-width: 72rem; }
.ct-gt__so { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .8rem; }
.ct-gt__o {
    display: flex; flex-direction: column; gap: .3rem; padding: .8rem .95rem; border-radius: 14px;
    background: rgba(255, 255, 255, .1); border: 1px solid rgba(246, 198, 107, .45);
}
.ct-gt__num { font-size: 1.6rem; font-weight: 800; line-height: 1; color: #F6C66B; white-space: nowrap; }
.ct-gt__lbl { font-size: .8rem; line-height: 1.35; color: rgba(255, 255, 255, .9); }
/* The chu de */
.ct-chude { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: -0.6rem; }
.ct-chude a {
    display: inline-flex; align-items: center; min-height: 36px; padding: .35rem .95rem; border-radius: 999px;
    background: #fff; border: 1px solid #E2E7EC; color: var(--ct-ink) !important; font-size: .85rem; font-weight: 600;
    text-decoration: none !important; transition: border-color .15s ease, background .15s ease;
}
.ct-chude a:hover { border-color: var(--ct-red); background: #FCEEEC; color: var(--ct-red) !important; }
/* Ban do nhung theo dia phuong */
.ct-bdn { display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; border: 1px solid #1E4D63; background: #EEF3F6; min-height: 460px; }
.ct-bdn__head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem 1.1rem; background: #1E4D63; color: #fff; }
.ct-bdn__head h2 { margin: 0; font-size: 1.15rem; font-weight: 700; color: #fff; }
.ct-bdn__head h2 span { font-weight: 500; font-size: .9rem; opacity: .85; }
.ct-bdn__head a { color: #fff !important; font-size: .85rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.ct-bdn__head a:hover { text-decoration: underline; }
.ct-bdn__frame { flex: 1 1 auto; width: 100%; min-height: 420px; border: 0; display: block; background: #EEF3F6; }
/* Dong "Giao dien: ..." dau vung noi dung trang chu: moi mau mot link, nut sao chep link (CtmtMauGiaoDien.VeDongMau) */
.ct-mau-dong { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .4rem .5rem; margin: 0 0 -.85rem; font-size: .82rem; color: var(--ct-muted); text-align: center; }
.ct-mau-dong i { line-height: 1; }
.ct-mau-dong__nhan i { margin-right: .35rem; }
.ct-mau-dong__ql { margin-left: .25rem; }
.ct-mau-chip { display: inline-flex; align-items: stretch; min-height: 30px; background: #fff; border: 1px solid #D5DDE5; border-radius: 999px; overflow: hidden; }
.ct-mau-chip__lk { display: inline-flex; align-items: center; padding: .15rem .5rem .15rem .6rem; color: inherit; text-decoration: none; }
a.ct-mau-chip__lk:hover { color: #1B6B2A; background: #F1F7F2; }
.ct-mau-chip__chep { display: inline-flex; align-items: center; justify-content: center; width: 26px; padding: 0; border: 0; border-left: 1px solid #D5DDE5; background: transparent; color: inherit; font-size: 1rem; cursor: pointer; }
.ct-mau-chip__chep:hover { color: #1B6B2A; background: #F1F7F2; }
.ct-mau-chip__chep.is-xong { color: #fff; background: #1B6B2A; }
.ct-mau-chip.is-chon { border-color: #1B6B2A; background: #E8F5E9; color: #14501F; font-weight: 700; }
.ct-mau-chip.is-chon .ct-mau-chip__chep { border-left-color: #A9CFB0; }
.ct-mau-dong--xem i { margin-right: .35rem; }
@media (pointer: coarse) { .ct-mau-chip { min-height: 38px; } .ct-mau-chip__chep { width: 38px; } }
/* Man hep: mot hang vuot ngang de khong day so lieu xuong */
@media (max-width: 767.98px) {
    .ct-mau-dong { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
    .ct-mau-dong::-webkit-scrollbar { display: none; }
    .ct-mau-dong > * { flex: 0 0 auto; }
}
.ct-mau-dong--xem { color: #9A6A0C; font-weight: 600; }
@media (max-width: 575.98px) {
    .ct-gt__in { padding: 1.15rem 1rem 1.2rem; }
    .ct-gt__so { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ct-gt__num { font-size: 1.3rem; }
    .ct-chude { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .25rem; scrollbar-width: none; }
    .ct-chude a { flex: 0 0 auto; }
    .ct-bdn, .ct-bdn__frame { min-height: 360px; }
}
@media (prefers-reduced-motion: reduce) { .ct-chude a { transition: none; } }

/* Muc chon mau trong sheet dien thoai (CtmtMauGiaoDien.VeSheet) */
.ct-mgd__muc > i { flex: 0 0 auto; font-size: 1.05rem; color: #1B6B2A; visibility: hidden; }
.ct-mgd__muc.is-chon { background: #E8F5E9; font-weight: 700; }
.ct-mgd__muc.is-chon > i { visibility: visible; }
.ct-mgd__muc span small { display: block; font-weight: 400; font-size: .75rem; }

/* Menu may tinh: cac muc Tim kiem, Giao dien, Cai dat, Thong bao co chu tu 1200px (Site.Master d-xl-inline) - thu hep khoang dem de vua mot hang (ca khi co muc ADMIN) */
@media (min-width: 1200px) {
    .ct-portal-nav .ct-mnav__link,
    body.ctmt-app .site-header .ct-mnav__link { padding-left: .55rem !important; padding-right: .55rem !important; gap: .35rem; font-size: .9rem !important; }
}

/* Menu tai khoan (ADMIN, mega 1080px): neo vao khung thanh menu, khong vao muc ADMIN.
   Khi muc ADMIN xuong hang thu hai (nam ben trai), menu van can mep phai khung va nam gon trong man hinh. */
@media (min-width: 992px) {
    .ct-portal-nav__in { position: relative; }
    /* Content/style.css dat .site-header .navbar-nav .nav-item.user-nav-dropdown relative - can do uu tien cao hon */
    .site-header .ct-portal-nav .navbar-nav .nav-item.user-nav-dropdown { position: static; }
    .site-header .ct-portal-nav .navbar-nav .dropdown-menu.admin-user-menu {
        right: 1.5rem; left: auto; max-width: calc(100% - 3rem);
    }
}

/* Da dang nhap (co muc tai khoan) ma man hinh 1200-1299px: 4 muc Tim kiem, Giao dien, Cai dat, Thong bao chi hien icon de menu giu mot hang */
@media (min-width: 1200px) and (max-width: 1299.98px) {
    .ct-mnav:has(.user-nav-dropdown) .ct-mnav__chu { display: none !important; }
}