/*
 * Theme dgts (PORTAL-DGTS-GIAODIEN), site 8 Trung tâm Dịch vụ Đấu giá tài sản.
 * Lớp giao diện đặt trên bootstrap + style.css của theme daugia (custom.css, slimmenu.css không nạp nữa).
 *
 * Hướng: trang dịch vụ công, cần tin cậy và dễ tra cứu. Một màu nhấn là xanh tư pháp (--dg-accent, lấy từ phù hiệu ngành),
 * nền xám lạnh, chữ xanh đen. Không gradient, không quầng sáng, không chữ nhỏ in hoa trên tiêu đề, không vạch màu cạnh
 * tiêu đề, không nhãn đè ảnh, không chuyển động lặp (trừ dải chữ chạy của đơn vị ở [MESSAGE]).
 * Đổi màu toàn site: sửa các token --dg-* trong :root (sáng) và hai khối tối bên dưới.
 *
 * Quy ước:
 * - Bo góc: --dg-r (thẻ, khối, ảnh lớn) và --dg-r-sm (nút, ô nhập, nhãn, ảnh nhỏ). Không dùng số khác.
 * - Khoảng cách: --dg-gap giữa các thẻ, --dg-section giữa các khu lớn.
 * - Đường kẻ: một màu --dg-line; danh sách chỉ kẻ dưới mỗi dòng, dòng cuối không kẻ.
 * - Trạng thái đấu giá dùng dữ liệu thật (timeauction): sắp diễn ra = màu nhấn, đã diễn ra = xám.
 * - Chuyển động chỉ báo trạng thái (rê chuột, mở menu), tắt hết khi prefers-reduced-motion.
 *
 * Thứ tự: font, token, nền, đầu trang, menu, dải thông báo, đường dẫn, khung trang, khối, trang chủ, lịch đấu giá,
 * chuyên mục tin, cột phải, nội dung module, bootstrap, chân trang, đáp ứng, tối, trợ năng.
 */

/* ---------- Font Be Vietnam Pro (OFL, tự lưu trong ../fonts, không gọi dịch vụ ngoài) ---------- */
@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-vietnamese-400-normal.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-latin-ext-400-normal.woff2") format("woff2");
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-latin-400-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-vietnamese-500-normal.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-latin-ext-500-normal.woff2") format("woff2");
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-latin-500-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-vietnamese-700-normal.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-latin-ext-700-normal.woff2") format("woff2");
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-latin-700-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-vietnamese-800-normal.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-latin-ext-800-normal.woff2") format("woff2");
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Be Vietnam Pro";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/be-vietnam-pro-latin-800-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Merriweather 700 (OFL, chép từ theme hdnd/dbnd2026) cho tiêu đề */
@font-face {
    font-family: "Merriweather";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/merriweather-vietnamese-700-normal.woff2") format("woff2");
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: "Merriweather";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/merriweather-latin-ext-700-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Merriweather";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/merriweather-latin-700-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Token ---------- */
:root {
    --dg-font: "Be Vietnam Pro", "Segoe UI", Roboto, Arial, sans-serif;
    /* Tiêu đề tin, tiêu đề khối: chữ có chân như cổng Bộ Tư pháp (moj.gov.vn dùng Merriweather) */
    --dg-serif: "Merriweather", Georgia, "Times New Roman", serif;

    /* Màu theo nhận diện cổng Bộ Tư pháp: xanh #004999 cho dải đầu/chân trang, chữ menu, tiêu đề;
       đỏ #c62828 chỉ dùng cho dấu đầu dòng danh sách tin */
    --dg-bg: #f4f5f7;
    --dg-surface: #ffffff;
    --dg-surface-2: #eef1f5;
    --dg-line: #dde2e9;
    --dg-ink: #161d29;
    --dg-ink-2: #3d4656;
    --dg-ink-3: #5c6676;
    --dg-accent: #004999;
    --dg-accent-hover: #003a7a;
    --dg-accent-soft: #e6eef8;
    --dg-accent-ink: #ffffff;
    --dg-red: #c62828;
    --dg-ok: #17703f;
    --dg-ok-soft: #e2f2e8;
    --dg-navy: #004999;
    --dg-navy-2: #003a7a;
    --dg-navy-ink: #ffffff;
    --dg-navy-ink-2: #c7d6ea;
    --dg-brand-ink: #ffffff;
    --dg-shadow: 0 1px 2px rgba(0, 47, 99, .06), 0 1px 1px rgba(0, 47, 99, .04);
    --dg-shadow-pop: 0 10px 28px rgba(0, 47, 99, .16);

    --dg-r: 10px;
    --dg-r-sm: 6px;
    --dg-gap: 20px;
    --dg-section: 28px;
    --dg-side: 320px;
    --dg-ease: cubic-bezier(.2, .7, .2, 1);
    --dg-dur: .16s;

    color-scheme: light;
}

/* ---------- Nền ---------- */
html {
    -webkit-text-size-adjust: 100%;
    scroll-padding-top: 16px;
}

body {
    font-family: var(--dg-font);
    font-size: 15px;
    line-height: 1.6;
    color: var(--dg-ink);
    background: var(--dg-bg);
    height: auto;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--dg-font);
    color: var(--dg-ink);
    line-height: 1.35;
}

a,
a:link,
a:active,
a:visited {
    color: var(--dg-accent);
    transition: color var(--dg-dur) var(--dg-ease);
}

a:hover,
a:focus {
    color: var(--dg-accent-hover);
    text-decoration: none;
}

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

:focus-visible {
    outline: 2px solid var(--dg-accent);
    outline-offset: 2px;
}

.wraper {
    width: auto;
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 16px;
}

#body.container {
    width: auto;
    padding: 0;
    margin: 0;
    background: none;
    border: 0;
    box-shadow: none;
}

.sr-only-focusable:focus,
.dg-skip:focus {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 1060;
    width: auto;
    height: auto;
    clip: auto;
    padding: 10px 16px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
}

.dg-skip {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

/* ---------- Đầu trang ---------- */
.dg-topbar {
    background: var(--dg-navy-2);
    color: var(--dg-navy-ink-2);
    font-size: 13px;
}

.dg-topbar__in {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 36px;
}

.dg-topbar__link,
.dg-topbar__link:link,
.dg-topbar__link:visited {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--dg-navy-ink);
    font-weight: 500;
    white-space: nowrap;
}

.dg-topbar__link:hover,
.dg-topbar__link:focus {
    color: var(--dg-navy-ink-2);
    text-decoration: none;
}

.dg-topbar__date {
    margin-left: auto;
    font-variant-numeric: tabular-nums;
}

.dg-themebtn {
    display: inline-grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(232, 238, 247, .28);
    border-radius: var(--dg-r-sm);
    background: transparent;
    color: var(--dg-navy-ink);
    cursor: pointer;
    transition: background-color var(--dg-dur) var(--dg-ease);
}

.dg-themebtn:hover {
    background: rgba(232, 238, 247, .12);
}

.dg-themebtn__light {
    display: none;
}

.dg-header {
    position: relative;
    overflow: hidden;
    background: var(--dg-navy);
    color: var(--dg-navy-ink);
}

/* Nền trống đồng Đông Sơn (cùng hoa văn nền site quiz) lớn, tâm trùng tâm logo: gắn vào thẻ .dg-drum bọc logo
   nên tâm luôn khớp ở mọi cỡ màn hình. trong-dong-mask.webp chỉ giữ nét ở kênh trong suốt nên dùng làm mask,
   màu lấy từ background-color; độ chìm chỉnh ở opacity, độ lớn ở width/height. Phần thừa bị đầu/chân trang cắt. */
.dg-drum {
    position: relative;
    display: block;
    flex: none;
    line-height: 0;
}

.dg-drum::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    width: 560px;
    height: 560px;
    margin: -280px 0 0 -280px;
    pointer-events: none;
    background-color: #ffffff;
    -webkit-mask: url("../images/trong-dong-mask.webp") center / contain no-repeat;
    mask: url("../images/trong-dong-mask.webp") center / contain no-repeat;
    opacity: .3;
}

/* Đầu trang: trống đồng lớn hơn, đậm ở gần logo và mờ dần ra tới mép ngoài (mặt nạ tròn giao với hoa văn) */
.dg-header .dg-drum::before {
    width: 760px;
    height: 760px;
    margin: -380px 0 0 -380px;
    opacity: .4;
    -webkit-mask:
        radial-gradient(circle closest-side, #000 0%, #000 22%, rgba(0, 0, 0, .55) 55%, transparent 100%) center / 100% 100% no-repeat,
        url("../images/trong-dong-mask.webp") center / contain no-repeat;
    -webkit-mask-composite: source-in;
    mask:
        radial-gradient(circle closest-side, #000 0%, #000 22%, rgba(0, 0, 0, .55) 55%, transparent 100%) center / 100% 100% no-repeat,
        url("../images/trong-dong-mask.webp") center / contain no-repeat;
    mask-composite: intersect;
    /* quay chậm ngược chiều kim đồng hồ, một vòng 90 giây */
    animation: dg-drum-spin 90s linear infinite;
    will-change: transform;
}

@keyframes dg-drum-spin {
    to { transform: rotate(-360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .dg-header .dg-drum::before {
        animation: none;
        will-change: auto;
    }
}

.dg-drum--foot::before {
    width: 620px;
    height: 620px;
    margin: -310px 0 0 -310px;
    opacity: .2;
}

@media (max-width: 767px) {
    .dg-drum::before,
    .dg-header .dg-drum::before {
        width: 380px;
        height: 380px;
        margin: -190px 0 0 -190px;
    }

    .dg-header .dg-drum::before {
        width: 620px;
        height: 620px;
        margin: -310px 0 0 -310px;
    }

    .dg-drum--foot::before {
        width: 400px;
        height: 400px;
        margin: -200px 0 0 -200px;
    }
}

.dg-header__in {
    position: relative;
    z-index: 1;
}

.dg-header__in {
    display: flex;
    align-items: center;
    gap: 24px;
    min-height: 128px;
    padding-top: 16px;
    padding-bottom: 16px;
}

.dg-brand,
.dg-brand:link,
.dg-brand:visited {
    display: flex;
    align-items: center;
    gap: 18px;
    color: var(--dg-brand-ink);
    text-decoration: none;
    min-width: 0;
}

.dg-brand:hover,
.dg-brand:focus {
    text-decoration: none;
    color: var(--dg-brand-ink);
}

/* Máy tính (>=1024px): cụm logo + tên site + trống đồng nằm đúng giữa đầu trang (ô tìm kiếm không còn ở hàng này). */
@media (min-width: 1024px) {
    .dg-brand {
        margin-left: auto;
        margin-right: auto;
    }
}

/* Tìm kiếm: chỉ một biểu tượng ở góc phải thanh trên cùng; bấm vào mới xổ khung nhập ngay dưới thanh */
.dg-topbar {
    position: relative;
    z-index: 30;
}

.dg-topbar__in {
    position: relative;
}

.dg-searchbtn {
    display: inline-grid;
    place-items: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 1px solid rgba(232, 238, 247, .28);
    border-radius: var(--dg-r-sm);
    background: transparent;
    color: var(--dg-navy-ink);
    cursor: pointer;
    transition: background-color var(--dg-dur) var(--dg-ease);
}

.dg-searchbtn:hover,
.dg-topbar.is-search-open .dg-searchbtn {
    background: rgba(232, 238, 247, .16);
}

.dg-searchbtn__x {
    display: none;
}

.dg-topbar.is-search-open .dg-searchbtn__x {
    display: inline;
}

.dg-topbar.is-search-open .dg-searchbtn__s {
    display: none;
}

.dg-topbar .dg-search {
    display: none;
    position: absolute;
    top: calc(100% + 1px);
    right: 0;
    z-index: 5;
    width: 380px;
    max-width: 100%;
    margin: 0;
    padding: 10px;
    background: var(--dg-navy-2);
    border-radius: 0 0 var(--dg-r-sm) var(--dg-r-sm);
    box-shadow: 0 10px 24px rgba(0, 20, 50, .28);
}

.dg-topbar.is-search-open .dg-search {
    display: flex;
}

@media (max-width: 1023px) {
    .dg-topbar .dg-search {
        left: 0;
        width: auto;
        border-radius: 0;
    }
}

.dg-brand__mark {
    width: 84px;
    height: auto;
    flex: none;
}

.dg-brand__text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.dg-brand__parent {
    margin-bottom: 6px;
    font-size: 16px;
    font-weight: 600;
    color: var(--dg-navy-ink-2);
    line-height: 1.4;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.dg-brand__name {
    /* Viền quanh từng chữ: nét ngoài xanh nhạt vẽ dưới ruột trắng */
    -webkit-text-stroke: 4px #6fa3e8;
    paint-order: stroke fill;
    stroke-linejoin: round;
    font-size: 31px;
    font-weight: 700;
    color: var(--dg-brand-ink);
    line-height: 1.2;
    letter-spacing: .01em;
    text-transform: uppercase;
}

.dg-search {
    position: relative;
    display: flex;
    align-items: stretch;
    margin-left: auto;
    width: 340px;
    max-width: 100%;
}

.dg-search .form-control {
    height: 42px;
    padding: 8px 12px;
    border: 1px solid transparent;
    border-right: 0;
    border-radius: var(--dg-r-sm) 0 0 var(--dg-r-sm);
    /* style.css đặt .headerSearch input nền trắng !important */
    background: var(--dg-surface) !important;
    color: var(--dg-ink);
    font-size: 14px;
    box-shadow: none;
}

.dg-search .form-control::placeholder {
    color: var(--dg-ink-3);
    opacity: 1;
}

.dg-search .form-control:focus {
    border-color: var(--dg-accent);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, .45);
    position: relative;
    z-index: 1;
}

.dg-search .has-error .form-control,
.dg-search.has-error .form-control {
    border-color: #b42318;
}

.dg-search .btn-search {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 42px;
    padding: 0 16px;
    border: 0;
    border-radius: 0 var(--dg-r-sm) var(--dg-r-sm) 0;
    background: var(--dg-navy-2);
    color: var(--dg-navy-ink);
    font-weight: 600;
    font-size: 14px;
    white-space: nowrap;
    transition: background-color var(--dg-dur) var(--dg-ease);
}

.dg-search .btn-search:hover {
    background: #002b5c;
}

.dg-search .btn-search:active {
    transform: translateY(1px);
}

.dg-menubtn {
    display: none;
    align-items: center;
    gap: 8px;
    height: 42px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, .45);
    border-radius: var(--dg-r-sm);
    background: transparent;
    color: var(--dg-navy-ink);
    font-weight: 600;
    font-size: 14px;
}

/* ---------- Menu ---------- */
.dg-nav {
    background: var(--dg-surface);
    border-bottom: 1px solid var(--dg-line);
    box-shadow: var(--dg-shadow);
    position: relative;
    z-index: 30;
}

.dg-menu {
    display: flex;
    flex-wrap: nowrap;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dg-menu > li {
    position: relative;
    display: flex;
    align-items: center;
}

.dg-menu > li > a,
.dg-menu > li > a:link,
.dg-menu > li > a:visited {
    display: block;
    padding: 0 16px;
    line-height: 50px;
    color: var(--dg-accent);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .01em;
    text-transform: uppercase;
    white-space: nowrap;
    text-decoration: none;
    transition: background-color var(--dg-dur) var(--dg-ease);
}

.dg-menu > li:first-child > a {
    padding-left: 0;
}

.dg-menu > li > a:hover,
.dg-menu > li:hover > a,
.dg-menu > li:focus-within > a {
    color: var(--dg-accent-hover);
    text-decoration: none;
    box-shadow: inset 0 -3px 0 var(--dg-line);
}

.dg-menu > li.current > a,
.dg-menu > li.active > a {
    color: var(--dg-accent);
    box-shadow: inset 0 -3px 0 var(--dg-accent);
}

/* Máy tính (>=1024px): các mục menu chia đều hết chiều ngang khung, chữ căn giữa từng mục */
@media (min-width: 1024px) {
    .dg-menu > li {
        flex: 1 1 auto;
    }

    .dg-menu > li > a,
    .dg-menu > li > a:link,
    .dg-menu > li > a:visited {
        flex: 1 1 auto;
        padding-left: 8px;
        padding-right: 8px;
        text-align: center;
    }

    .dg-menu > li:first-child > a {
        padding-left: 8px;
    }
}

@media (min-width: 1024px) and (max-width: 1119px) {
    .dg-nav .dg-menu > li > a,
    .dg-nav .dg-menu > li > a:link,
    .dg-nav .dg-menu > li > a:visited,
    .dg-nav .dg-menu > li:first-child > a {
        padding-left: 3px;
        padding-right: 3px;
        font-size: 11.5px;
        letter-spacing: 0;
    }
}

.dg-menu__toggle {
    display: none;
}

.dg-menu__sub,
.dg-menu__sub ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.dg-menu > li > .dg-menu__sub {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 240px;
    padding: 6px;
    border: 1px solid var(--dg-line);
    border-radius: 0 0 var(--dg-r) var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow-pop);
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px);
    transition: opacity var(--dg-dur) var(--dg-ease), transform var(--dg-dur) var(--dg-ease), visibility 0s linear var(--dg-dur);
}

.dg-menu > li:first-child > .dg-menu__sub {
    left: -16px;
}

.dg-menu > li:hover > .dg-menu__sub,
.dg-menu > li:focus-within > .dg-menu__sub,
.dg-menu > li.is-open > .dg-menu__sub {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition-delay: 0s;
}

.dg-menu__sub a,
.dg-menu__sub a:link,
.dg-menu__sub a:visited {
    display: block;
    padding: 9px 12px;
    border-radius: var(--dg-r-sm);
    color: var(--dg-ink);
    font-size: 14px;
    text-decoration: none;
}

.dg-menu__sub a:hover,
.dg-menu__sub a:focus {
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
    text-decoration: none;
}

.dg-menu__sub ul {
    padding-left: 12px;
}

/* ---------- Dải thông báo ([MESSAGE], nội dung đơn vị) ---------- */
.dg-notice {
    background: var(--dg-surface);
    border-bottom: 1px solid var(--dg-line);
}

.dg-notice .wraper:empty,
.dg-notice:not(:has(a)) {
    display: none;
}

.dg-notice .block-simple-menu-slide {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 42px;
}

.dg-notice .block-simple-menu-slide::before {
    content: "\f0a1";
    font-family: FontAwesome;
    flex: none;
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
    font-size: 14px;
}

.dg-notice .marquee {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    font-size: 14px;
}

.dg-notice .marquee a,
.dg-notice .marquee a:link,
.dg-notice .marquee a:visited {
    color: var(--dg-ink-2);
    font-weight: 500;
    margin-right: 48px;
}

.dg-notice .marquee a:hover {
    color: var(--dg-accent);
}

/* ---------- Đường dẫn ---------- */
.dg-crumbs {
    background: var(--dg-surface);
    border-bottom: 1px solid var(--dg-line);
}

.dg-crumbs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 0;
    margin: 0;
    padding: 10px 0;
    list-style: none;
    font-size: 13px;
}

.dg-crumbs__list li {
    display: inline-flex;
    align-items: center;
    color: var(--dg-ink-3);
}

.dg-crumbs__list li + li::before {
    content: "\f105";
    font-family: FontAwesome;
    margin: 0 10px;
    color: var(--dg-ink-3);
}

.dg-crumbs__list a,
.dg-crumbs__list a:link,
.dg-crumbs__list a:visited {
    color: var(--dg-ink-2);
}

.dg-crumbs__list li:last-child a {
    color: var(--dg-ink);
    font-weight: 500;
}

/* ---------- Khung trang ---------- */
.dg-main {
    padding: var(--dg-section) 0 calc(var(--dg-section) + 8px);
}

.dg-cols {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--dg-side);
    gap: var(--dg-gap);
    align-items: start;
}

.dg-cols--narrow {
    --dg-side: 280px;
}

.dg-cols--left {
    grid-template-columns: var(--dg-side) minmax(0, 1fr);
}

.dg-cols--left .dg-cols__side {
    order: -1;
}

.dg-cols__main,
.dg-cols__side,
.dg-single {
    min-width: 0;
}

.dg-cols__side {
    display: grid;
    gap: var(--dg-gap);
}

.dg-cols__side > .dg-block,
.dg-cols__side > .panel {
    margin-bottom: 0;
}

.dg-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--dg-gap);
}

.dg-pair > div:empty {
    display: none;
}

.dg-pair:not(:has(> div:not(:empty))) {
    display: none;
}

/* ---------- Khối ---------- */
.dg-block,
.dg-main .panel {
    margin-bottom: var(--dg-gap);
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow);
}

.dg-block > .dg-block__title,
.dg-main .panel > .panel-heading,
.dg-main .panel-default > .panel-heading {
    margin: 0;
    padding: 14px 18px;
    border: 0;
    border-bottom: 1px solid var(--dg-line);
    border-radius: var(--dg-r) var(--dg-r) 0 0;
    background: transparent;
    color: var(--dg-accent);
    font-family: var(--dg-serif);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
    text-transform: none;
}

.dg-block > .dg-block__title::before,
.dg-main .panel > .panel-heading::before {
    content: none;
    display: none;
}

.dg-block__title a,
.dg-block__title a:link,
.dg-block__title a:visited,
.dg-main .panel-heading a,
.dg-main .panel-heading a:link,
.dg-main .panel-heading a:visited {
    color: var(--dg-accent);
    text-decoration: none;
}

.dg-block__title a::after {
    content: "\f105";
    font-family: FontAwesome;
    margin-left: 8px;
    color: var(--dg-ink-3);
    font-weight: 400;
    transition: transform var(--dg-dur) var(--dg-ease), color var(--dg-dur) var(--dg-ease);
    display: inline-block;
}

.dg-block__title a:hover,
.dg-main .panel-heading a:hover {
    color: var(--dg-accent);
}

.dg-block__title a:hover::after {
    color: var(--dg-accent);
    transform: translateX(2px);
}

.dg-block > .dg-block__body,
.dg-main .panel > .panel-body {
    padding: 16px 18px;
    background: transparent;
}

.dg-block--soft {
    background: var(--dg-surface);
}

.dg-cols__side .dg-block > .dg-block__title,
.dg-lead__side .dg-block > .dg-block__title {
    border-bottom: 0;
    background: var(--dg-navy);
    color: var(--dg-navy-ink);
    font-size: 15px;
    text-transform: uppercase;
}

.dg-cols__side .dg-block > .dg-block__title a,
.dg-cols__side .dg-block > .dg-block__title a::after,
.dg-lead__side .dg-block > .dg-block__title a,
.dg-lead__side .dg-block > .dg-block__title a::after {
    color: var(--dg-navy-ink);
}

/* bootstrap-theme vẽ gradient, bóng chữ lên nút, tiêu đề panel, cảnh báo: bỏ hết, dùng màu phẳng */
.panel-heading,
.dg-main .panel-heading,
.dg-block > .dg-block__title,
.btn,
.well,
.alert,
.progress,
.progress-bar,
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.list-group-item.active {
    background-image: none !important;
    filter: none;
    text-shadow: none;
}

.dg-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-surface-2);
    color: var(--dg-ink-2);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
    vertical-align: middle;
}

.dg-badge--accent {
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
}

.dg-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 14px;
    margin: 6px 0 0;
    padding: 0;
    list-style: none;
    color: var(--dg-ink-3);
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.dg-meta .fa {
    margin-right: 4px;
}

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

.dg-list > li {
    position: relative;
    padding: 10px 0 10px 14px;
    border-bottom: 1px solid var(--dg-line);
}

.dg-list > li::before {
    content: "";
    position: absolute;
    left: 0;
    top: calc(10px + .62em);
    width: 5px;
    height: 5px;
    background: var(--dg-red);
}

.dg-list > li:first-child::before {
    top: .62em;
}

.dg-list > li:first-child {
    padding-top: 0;
}

.dg-list > li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.dg-list a,
.dg-list a:link,
.dg-list a:visited {
    display: block;
    color: var(--dg-ink);
    font-weight: 500;
    font-size: 15px;
    line-height: 1.45;
}

.dg-list a:hover {
    color: var(--dg-accent);
}

.dg-list__time {
    display: block;
    margin-top: 3px;
    color: var(--dg-ink-3);
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.dg-more,
.dg-more:link,
.dg-more:visited {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    color: var(--dg-accent);
    font-weight: 600;
    font-size: 14px;
}

/* ---------- Trang chủ: khu đầu ---------- */
.dg-lead {
    display: grid;
    grid-template-columns: minmax(0, 1.72fr) minmax(0, 1fr);
    gap: var(--dg-gap);
    margin-bottom: var(--dg-section);
    align-items: stretch;
}

.dg-lead--wide {
    --dg-side: 280px;
}

.dg-lead > div:empty,
.dg-lead > aside:empty {
    display: none;
}

.dg-lead__feature,
.dg-lead__list,
.dg-lead__side {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.dg-lead__side > .dg-block,
.dg-lead__side > .panel {
    flex: 1;
    margin-bottom: 0;
}

.dg-feature {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow);
}

.dg-feature__img {
    display: block;
    flex: 1 1 auto;
    min-height: 240px;
    overflow: hidden;
    background: var(--dg-surface-2);
}

.dg-feature__img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s var(--dg-ease);
}

.dg-feature__img:hover img {
    transform: scale(1.03);
}

.dg-feature__title {
    font-family: var(--dg-serif);
    margin: 0;
    padding: 16px 18px 0;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
}

.dg-feature__title a,
.dg-feature__title a:link,
.dg-feature__title a:visited {
    color: var(--dg-ink);
}

.dg-feature__title a:hover {
    color: var(--dg-accent);
}

.dg-feature__time {
    margin: 8px 0 0;
    padding: 0 18px 18px;
    color: var(--dg-ink-3);
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

/* Slider tin tiêu điểm (bản 3): ảnh lớn 16:9, chữ nằm dưới ảnh (không đè lên ảnh); ảnh chuyển mờ dần;
   dải ảnh nhỏ các tin bên dưới thay cho chấm, tin đang xem có thanh chạy theo thời gian tự chuyển */
.dg-hero {
    --dg-hero-time: 6s;
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow-pop);
}

.dg-hero__stage {
    position: relative;
    flex: 1 1 auto;
}

.dg-hero__track {
    display: grid;
    height: 100%;
}

.dg-hero__slide {
    display: flex;
    grid-area: 1 / 1;
    flex-direction: column;
    min-width: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity .6s var(--dg-ease), visibility 0s linear .6s;
}

.dg-hero__slide.is-active {
    z-index: 1;
    opacity: 1;
    visibility: visible;
    transition: opacity .6s var(--dg-ease), visibility 0s;
}

.dg-hero__img,
.dg-hero__img:link {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--dg-surface-2);
}

.dg-hero__img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.04);
    transition: transform 1.4s var(--dg-ease);
}

.dg-hero__slide.is-active .dg-hero__img img {
    transform: none;
}

.dg-hero__slide.is-active .dg-hero__img:hover img {
    transform: scale(1.02);
    transition-duration: .5s;
}

/* Tiêu đề phủ lên phần dưới của ảnh; nền tối dần từ đáy giữ chữ trắng đọc được trên mọi ảnh */
.dg-hero__slide {
    position: relative;
}

.dg-hero__body {
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 64px 24px 20px;
    background: linear-gradient(to top, rgba(0, 12, 30, .86) 0%, rgba(0, 12, 30, .6) 55%, rgba(0, 12, 30, 0) 100%);
    pointer-events: none;
    opacity: 0;
    transition: opacity .15s linear;
}

.dg-hero__body a {
    pointer-events: auto;
}

/* Tin không có ảnh: khung nền xanh đậm, chữ vẫn trắng */
.dg-hero__slide:not(:has(.dg-hero__img)) .dg-hero__body {
    position: static;
    padding: 24px;
    background: #003a7a;
}

/* Chữ tin cũ tắt ngay, chữ tin mới hiện sau khi ảnh bắt đầu chuyển, để hai tiêu đề không chồng nhau */
.dg-hero__slide.is-active .dg-hero__body {
    opacity: 1;
    transition: opacity .3s var(--dg-ease) .2s;
}

.dg-hero__img,
.dg-hero__img:link {
    margin-top: auto;
}

.dg-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 14px;
    margin: 0 0 8px;
    color: rgba(255, 255, 255, .86);
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.dg-hero__cat,
.dg-hero__cat:link,
.dg-hero__cat:visited {
    color: #ffffff;
    font-weight: 700;
}

.dg-hero__cat:hover {
    color: #bcd7ff;
}

.dg-hero__time {
    white-space: nowrap;
}

.dg-hero__title {
    margin: 0;
    font-family: var(--dg-serif);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.38;
    text-wrap: balance;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .45);
}

.dg-hero__title a,
.dg-hero__title a:link,
.dg-hero__title a:visited {
    color: #ffffff;
    text-decoration: none;
}

.dg-hero__title a:hover {
    color: #bcd7ff;
}

/* Nút trước/sau phủ đúng vùng ảnh: chỉ nút bấm nhận chuột */
.dg-hero__nav {
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    aspect-ratio: 16 / 9;
    padding: 0 14px;
    pointer-events: none;
}

.dg-hero__arrow {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    color: #004999;
    font-size: 26px;
    line-height: 1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
    cursor: pointer;
    pointer-events: auto;
    opacity: 0;
    transform: scale(.9);
    transition: opacity var(--dg-dur) var(--dg-ease), transform var(--dg-dur) var(--dg-ease), background-color var(--dg-dur) var(--dg-ease), color var(--dg-dur) var(--dg-ease);
}

.dg-hero:hover .dg-hero__arrow,
.dg-hero__arrow:focus-visible {
    opacity: 1;
    transform: none;
}

.dg-hero__arrow:hover {
    background: #004999;
    color: #ffffff;
}

.dg-hero__arrow:active {
    transform: scale(.94);
}

/* Dải ảnh nhỏ: ba tin một lượt, cuộn ngang khi nhiều hơn */
.dg-hero__rail {
    display: grid;
    grid-auto-columns: calc((100% - 20px) / 3);
    grid-auto-flow: column;
    gap: 10px;
    padding: 12px 14px 14px;
    overflow-x: auto;
    border-top: 1px solid var(--dg-line);
    background: var(--dg-surface-2);
    scroll-snap-type: x mandatory;
    scroll-padding: 0 14px;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
}

.dg-hero__rail::-webkit-scrollbar {
    display: none;
}

.dg-hero__thumb {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 8px;
    overflow: hidden;
    border: 1px solid transparent;
    border-radius: calc(var(--dg-r) - 2px);
    background: transparent;
    color: var(--dg-ink-2);
    font: inherit;
    text-align: left;
    cursor: pointer;
    scroll-snap-align: start;
    transition: background-color var(--dg-dur) var(--dg-ease), border-color var(--dg-dur) var(--dg-ease), color var(--dg-dur) var(--dg-ease);
}

.dg-hero__thumb:hover {
    background: var(--dg-surface);
    color: var(--dg-ink);
}

.dg-hero__thumb[aria-current="true"] {
    border-color: var(--dg-line);
    background: var(--dg-surface);
    color: var(--dg-ink);
    box-shadow: var(--dg-shadow);
}

.dg-hero__thumb:focus-visible {
    outline: 2px solid var(--dg-accent);
    outline-offset: 1px;
}

.dg-hero__thumbimg {
    flex: none;
    width: 76px;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 6px;
    background: var(--dg-line);
}

.dg-hero__thumbimg img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .72;
    transition: opacity var(--dg-dur) var(--dg-ease);
}

.dg-hero__thumb:hover .dg-hero__thumbimg img,
.dg-hero__thumb[aria-current="true"] .dg-hero__thumbimg img {
    opacity: 1;
}

.dg-hero__thumbtitle {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    min-width: 0;
    overflow: hidden;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
}

/* Thanh thời gian ở mép trên ô đang xem; JS chuyển tin khi thanh chạy hết */
.dg-hero__bar {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: transparent;
    pointer-events: none;
}

.dg-hero__bar::after {
    content: "";
    display: block;
    height: 100%;
    background: var(--dg-accent);
    transform: scaleX(0);
    transform-origin: left center;
}

.dg-hero__thumb[aria-current="true"] .dg-hero__bar {
    background: var(--dg-line);
}

.dg-hero.is-playing .dg-hero__thumb[aria-current="true"] .dg-hero__bar::after {
    animation: dg-hero-bar var(--dg-hero-time) linear forwards;
}

.dg-hero.is-paused .dg-hero__thumb[aria-current="true"] .dg-hero__bar::after {
    animation-play-state: paused;
}

/* Không tự chuyển (giảm chuyển động): thanh đầy, chỉ để đánh dấu tin đang xem */
.dg-hero:not(.is-playing) .dg-hero__thumb[aria-current="true"] .dg-hero__bar::after {
    transform: none;
}

@keyframes dg-hero-bar {
    from {
        transform: scaleX(0);
    }
    to {
        transform: scaleX(1);
    }
}

@media (hover: none) {
    .dg-hero__arrow {
        opacity: 1;
        width: 38px;
        height: 38px;
        font-size: 22px;
        transform: none;
    }
}

@media (max-width: 767px) {
    .dg-hero__body {
        padding: 44px 16px 14px;
    }

    .dg-hero__title {
        font-size: 17px;
        -webkit-line-clamp: 2;
    }

    .dg-hero__meta {
        margin-bottom: 4px;
        font-size: 12px;
    }

    .dg-hero__rail {
        grid-auto-columns: 74%;
        padding: 10px 12px 12px;
        scroll-padding: 0 12px;
    }

    .dg-hero__thumbimg {
        width: 64px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dg-hero__slide,
    .dg-hero__slide.is-active,
    .dg-hero__img img {
        transition: none;
    }

    .dg-hero__img img {
        transform: none;
    }
}

/* Banner sự kiện trong tháng (khối global.event_banner, vị trí [HOME_EVENT] trên khu đầu trang chủ).
   Khung cố định 4:1 (≤1199px: 3:1, ≤767px: 3:2); ảnh ngang (kind wide) phủ kín, ảnh poster (kind poster) đặt giữa khung trên bản mờ của chính ảnh. */
.dg-eventslot {
    margin-bottom: var(--dg-section);
}

.dg-eventslot:not(:has(*)) {
    display: none;
}

.dg-eventslot .dg-event {
    margin-bottom: 0;
}

/* Khối nằm cùng cột với các khối khác (vd [RIGHT_TOP]) cách khối kế tiếp đúng một khoảng giữa các khối của trang */
.dg-event {
    margin-bottom: var(--dg-section);
    position: relative;
    overflow: hidden;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface-2);
    box-shadow: var(--dg-shadow-pop);
}

.dg-event__track {
    display: grid;
    aspect-ratio: 4 / 1;
}

@media (max-width: 1199px) {
    .dg-event__track {
        aspect-ratio: 3 / 1;
    }
}

.dg-event__slide {
    position: relative;
    grid-area: 1 / 1;
    margin: 0;
    overflow: hidden;
    background: #0b2a52;
    opacity: 0;
    visibility: hidden;
    transition: opacity .6s var(--dg-ease), visibility 0s linear .6s;
}

.dg-event__slide.is-active {
    opacity: 1;
    visibility: visible;
    transition: opacity .6s var(--dg-ease), visibility 0s;
}

.dg-event__slide--poster::before {
    content: "";
    position: absolute;
    inset: -40px;
    background: var(--bg) center / cover no-repeat;
    filter: blur(26px) saturate(1.15) brightness(.9);
}

.dg-event__a {
    position: absolute;
    inset: 0;
    display: block;
}

.dg-event__slide img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.dg-event__slide--wide img {
    object-fit: cover;
}

.dg-event__arrow {
    position: absolute;
    z-index: 2;
    top: 50%;
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    margin-top: -22px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    color: #004999;
    font-size: 26px;
    line-height: 1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--dg-dur) var(--dg-ease), background-color var(--dg-dur) var(--dg-ease), color var(--dg-dur) var(--dg-ease);
}

.dg-event__arrow--prev {
    left: 14px;
}

.dg-event__arrow--next {
    right: 14px;
}

.dg-event:hover .dg-event__arrow,
.dg-event__arrow:focus-visible {
    opacity: 1;
}

.dg-event__arrow:hover {
    background: #004999;
    color: #ffffff;
}

.dg-event__dots {
    position: absolute;
    z-index: 2;
    left: 50%;
    bottom: 12px;
    display: flex;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(0, 0, 0, .45);
    transform: translateX(-50%);
}

.dg-event__dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, .6);
    cursor: pointer;
    transition: width var(--dg-dur) var(--dg-ease), background-color var(--dg-dur) var(--dg-ease);
}

.dg-event__dot[aria-current="true"] {
    width: 22px;
    background: #ffffff;
}

@media (hover: none) {
    .dg-event__arrow {
        opacity: 1;
        width: 36px;
        height: 36px;
        margin-top: -18px;
        font-size: 22px;
    }
}

@media (max-width: 767px) {
    /* Điện thoại: khung cao theo ảnh. Ảnh ngang giữ nguyên tỉ lệ (không cắt chữ), poster giữ khung 3:2;
       phần thừa (khi có nhiều banner khác tỉ lệ) là bản mờ của ảnh */
    .dg-event__track {
        aspect-ratio: auto;
    }

    .dg-event__slide--poster {
        aspect-ratio: 3 / 2;
    }

    .dg-event__slide--wide {
        display: flex;
        align-items: center;
    }

    .dg-event__slide--wide::before {
        content: "";
        position: absolute;
        inset: -40px;
        background: var(--bg) center / cover no-repeat;
        filter: blur(26px) saturate(1.15) brightness(.9);
    }

    .dg-event__slide--wide .dg-event__a,
    .dg-event__slide--wide > img {
        position: relative;
        inset: auto;
        width: 100%;
    }

    .dg-event__slide--wide img {
        position: relative;
        inset: auto;
        height: auto;
        object-fit: contain;
    }

    .dg-event__arrow--prev {
        left: 8px;
    }

    .dg-event__arrow--next {
        right: 8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dg-event__slide,
    .dg-event__slide.is-active {
        transition: none;
    }
}

/* Khu đầu trang chủ: slide tin + tab tin là MỘT khung viền liền, ngăn nhau bằng một đường kẻ */
.dg-lead {
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow-pop);
}

.dg-lead .dg-hero {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* Khoảng đệm đều 16px: ảnh cách mép khung, đường kẻ giữa, dải ảnh nhỏ và nhau cùng một khoảng */
.dg-lead .dg-hero {
    gap: 16px;
    padding: 16px;
}

.dg-lead .dg-hero__stage {
    display: flex;
}

.dg-lead .dg-hero__track {
    flex: 1 1 auto;
    height: auto;
}

.dg-lead .dg-hero__img,
.dg-lead .dg-hero__img:link {
    flex: 1 1 auto;
    min-height: 300px;
    margin-top: 0;
    aspect-ratio: auto;
    border-radius: 8px;
}

.dg-lead .dg-hero__body {
    border-radius: 0 0 8px 8px;
}

.dg-lead .dg-hero__nav {
    top: 0;
    aspect-ratio: auto;
    padding: 0 12px;
}

.dg-lead .dg-hero__rail {
    padding: 0;
    border-top: 0;
    background: transparent;
    scroll-padding: 0;
}

.dg-lead .dg-hero__thumb {
    background: var(--dg-surface-2);
}

.dg-lead .dg-hero__thumb:hover,
.dg-lead .dg-hero__thumb[aria-current="true"] {
    background: var(--dg-surface);
    border-color: var(--dg-accent);
}

.dg-lead__list {
    border-left: 1px solid var(--dg-line);
}

.dg-lead .dg-tabs {
    height: 100%;
}

.dg-main .dg-lead .dg-tabs > .nav-tabs {
    gap: 0;
    border-bottom: 1px solid var(--dg-line);
    background: var(--dg-surface-2);
}

.dg-main .dg-lead .dg-tabs > .nav-tabs > li {
    margin: 0 0 -1px;
}

.dg-main .dg-lead .dg-tabs > .nav-tabs > li > a,
.dg-main .dg-lead .dg-tabs > .nav-tabs > li > a:link,
.dg-main .dg-lead .dg-tabs > .nav-tabs > li > a:visited {
    padding: 14px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--dg-ink-2);
}

.dg-main .dg-lead .dg-tabs > .nav-tabs > li > a:hover,
.dg-main .dg-lead .dg-tabs > .nav-tabs > li > a:focus {
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
}

.dg-main .dg-lead .dg-tabs > .nav-tabs > li.active > a,
.dg-main .dg-lead .dg-tabs > .nav-tabs > li.active > a:hover,
.dg-main .dg-lead .dg-tabs > .nav-tabs > li.active > a:focus {
    border: 0;
    border-bottom: 3px solid var(--dg-accent);
    background: var(--dg-surface);
    color: var(--dg-accent);
}

.dg-lead .dg-tabs .tab-content {
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

@media (max-width: 767px) {
    .dg-lead__list {
        border-left: 0;
        border-top: 1px solid var(--dg-line);
    }

    .dg-lead .dg-hero {
        gap: 12px;
        padding: 12px;
    }

    .dg-lead .dg-hero__img,
    .dg-lead .dg-hero__img:link {
        flex: none;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .dg-lead .dg-hero__rail {
        padding: 0;
        scroll-padding: 0;
    }
}

.dg-tabs {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.dg-main .dg-tabs > .nav-tabs {
    gap: 6px;
    padding: 0;
    border-bottom: 0;
}

.dg-main .dg-tabs > .nav-tabs > li {
    flex: 1 1 0;
    margin: 0;
}

.dg-main .dg-tabs > .nav-tabs > li > a,
.dg-main .dg-tabs > .nav-tabs > li > a:link,
.dg-main .dg-tabs > .nav-tabs > li > a:visited {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 14px;
    border: 1px solid var(--dg-line);
    border-bottom: 0;
    border-radius: var(--dg-r) var(--dg-r) 0 0;
    background: var(--dg-surface-2);
    color: var(--dg-ink-2);
    font-size: 15px;
    font-weight: 700;
    text-align: center;
}

.dg-main .dg-tabs > .nav-tabs > li > a::before {
    content: "\f1ea";
    font-family: FontAwesome;
    font-weight: 400;
}

.dg-main .dg-tabs > .nav-tabs > li + li > a::before {
    content: "\f005";
}

.dg-main .dg-tabs > .nav-tabs > li > a:hover,
.dg-main .dg-tabs > .nav-tabs > li > a:focus {
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
}

.dg-main .dg-tabs > .nav-tabs > li.active > a,
.dg-main .dg-tabs > .nav-tabs > li.active > a:hover,
.dg-main .dg-tabs > .nav-tabs > li.active > a:focus {
    border: 1px solid var(--dg-accent);
    border-bottom: 0;
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
}

.dg-tabs .tab-content {
    flex: 1;
    padding: 6px 18px 12px;
    border: 1px solid var(--dg-line);
    border-top: 3px solid var(--dg-accent);
    border-radius: 0 0 var(--dg-r) var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow);
}

.dg-tabs .tab-content > div {
    height: auto !important;
    max-height: none;
    overflow: visible;
    padding: 0;
    border: 0;
}

.dg-tabs .dg-list > li {
    padding-top: 12px;
    padding-bottom: 12px;
}

.dg-tabs .dg-list > li:first-child::before {
    top: calc(12px + .62em);
}

.dg-tabs .dg-list > li:last-child {
    border-bottom: 0;
}

/* Thanh tab dùng chung: trang chủ, ảnh, module */
.dg-main .nav-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0 4px;
    margin: 0;
    padding: 0 12px;
    border-bottom: 1px solid var(--dg-line);
    background: transparent;
}

.dg-main .nav-tabs::before,
.dg-main .nav-tabs::after {
    content: none;
}

.dg-main .nav-tabs > li {
    float: none;
    margin: 0 0 -1px;
}

.dg-main .nav-tabs > li > a,
.dg-main .nav-tabs > li > a:link,
.dg-main .nav-tabs > li > a:visited {
    margin: 0;
    padding: 12px 8px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    color: var(--dg-ink-3);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

.dg-main .nav-tabs > li > a:hover,
.dg-main .nav-tabs > li > a:focus {
    background: transparent;
    color: var(--dg-ink);
    border-bottom-color: var(--dg-line);
}

.dg-main .nav-tabs > li.active > a,
.dg-main .nav-tabs > li.active > a:hover,
.dg-main .nav-tabs > li.active > a:focus {
    border: 0;
    border-bottom: 2px solid var(--dg-accent);
    background: transparent;
    color: var(--dg-accent);
}

/* Văn bản mới (laws): dải thẻ ngang ở trang chủ, mỗi thẻ có ô biểu tượng tài liệu, số hiệu, trích yếu, ngày ban hành */
.dg-laws {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dg-laws__item {
    position: relative;
    display: flex;
    gap: 12px;
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    transition: border-color var(--dg-dur) var(--dg-ease), box-shadow var(--dg-dur) var(--dg-ease), transform var(--dg-dur) var(--dg-ease);
}

.dg-laws__item:hover {
    border-color: color-mix(in srgb, var(--dg-accent) 40%, var(--dg-line));
    box-shadow: var(--dg-shadow-pop);
    transform: translateY(-2px);
}

.dg-laws__icon {
    display: grid;
    flex: none;
    place-items: center;
    width: 42px;
    height: 50px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
    font-size: 22px;
}

.dg-laws__body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.dg-laws__code {
    align-self: flex-start;
    padding: 1px 8px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
    font-size: 12.5px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.dg-laws__code:empty {
    display: none;
}

.dg-laws__link,
.dg-laws__link:link,
.dg-laws__link:visited {
    color: var(--dg-ink);
    text-decoration: none;
}

/* Cả thẻ bấm được nhờ lớp phủ của liên kết */
.dg-laws__link::after {
    content: "";
    position: absolute;
    inset: 0;
}

.dg-laws__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.45;
}

.dg-laws__item:hover .dg-laws__title {
    color: var(--dg-accent);
}

.dg-laws__date {
    margin-top: auto;
    white-space: nowrap;
    color: var(--dg-ink-3);
    font-size: 12.5px;
}

/* Tiêu đề hai khu trang chủ: lịch đấu giá (lớn nhất) và văn bản mới, có ô biểu tượng */
.dg-docs {
    margin-bottom: var(--dg-section);
}

.dg-docs:empty {
    display: none;
}

.dg-docs > .dg-block {
    margin-bottom: 0;
}

.dg-docs > .dg-block > .dg-block__title {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 22px;
    font-size: 19px;
}

.dg-docs > .dg-block > .dg-block__title::before {
    content: "\f15c";
    display: inline-grid;
    flex: none;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
    font-family: FontAwesome;
    font-size: 17px;
    font-weight: 400;
}

.dg-docs > .dg-block > .dg-block__body {
    padding: 18px 22px 22px;
}

/* ---------- Trang chủ: [HOME_FULL] và lịch đấu giá ---------- */
.dg-homefull {
    margin-bottom: var(--dg-section);
}

.dg-homefull:empty {
    display: none;
}

.dg-homefull > .dg-block:last-child {
    margin-bottom: 0;
}

.dg-homefull .nv-block-banners,
.dg-cols__main > .nv-block-banners {
    margin-bottom: var(--dg-gap);
}

.dg-main .nv-block-banners img {
    border-radius: var(--dg-r);
}

/* Lịch đấu giá: thẻ phiên (khối trang chủ và trang danh sách dùng chung). Trạng thái lấy từ timeto/timeform/timeauction:
   open = đang nhận hồ sơ (xanh lá: còn nộp được hồ sơ), upcoming/soon = chờ phiên (xanh nhấn), past = xám.
   Hình minh họa: ảnh thật của phiên nếu có, không thì biểu tượng theo loại tài sản (auction_info.php đoán từ tiêu đề);
   mỗi loại một sắc (--k) pha nhạt với --dg-surface nên tự đổi theo nền tối. */
.dg-auctionbox [hidden] {
    display: none !important;
}

.dg-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    width: fit-content;
    max-width: 100%;
    margin: 0 0 18px;
    padding: 5px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface-2);
}

.dg-filter__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 8px 14px;
    border: 1px solid transparent;
    border-radius: var(--dg-r-sm);
    background: transparent;
    color: var(--dg-ink-2);
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color var(--dg-dur) var(--dg-ease), color var(--dg-dur) var(--dg-ease), box-shadow var(--dg-dur) var(--dg-ease);
}

.dg-filter__btn .fa {
    font-size: 15px;
}

.dg-filter__btn:hover {
    background: var(--dg-surface);
    color: var(--dg-accent);
}

.dg-filter__btn:active {
    transform: translateY(1px);
}

.dg-filter__btn.is-active {
    border-color: var(--dg-line);
    background: var(--dg-surface);
    color: var(--dg-accent);
    box-shadow: var(--dg-shadow);
}

.dg-filter__btn--open.is-active,
.dg-filter__btn--open:hover {
    color: var(--dg-ok);
}

.dg-filter__n {
    min-width: 24px;
    padding: 0 6px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-line);
    color: var(--dg-ink-2);
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.dg-filter__btn.is-active .dg-filter__n {
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
}

.dg-filter__btn--open.is-active .dg-filter__n {
    background: var(--dg-ok);
    color: var(--dg-accent-ink);
}

.dg-filter__empty {
    margin: 0;
    padding: 18px;
    border: 1px dashed var(--dg-line);
    border-radius: var(--dg-r);
    color: var(--dg-ink-3);
    text-align: center;
}

.dg-auctions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dg-auction {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow);
    transition: box-shadow var(--dg-dur) var(--dg-ease), transform var(--dg-dur) var(--dg-ease), border-color var(--dg-dur) var(--dg-ease);
}

.dg-auction:hover {
    border-color: color-mix(in srgb, var(--dg-accent) 35%, var(--dg-line));
    box-shadow: var(--dg-shadow-pop);
    transform: translateY(-2px);
}

.dg-kind--land { --k: #2f5fa7; }
.dg-kind--tree { --k: #2e7a50; }
.dg-kind--vehicle { --k: #4a5a75; }
.dg-kind--machine { --k: #8a6a2c; }
.dg-kind--share { --k: #5b4fa0; }
.dg-kind--house { --k: #9a4f3c; }
.dg-kind--other { --k: #004999; }

.dg-auction__media,
.dg-auction__media:link,
.dg-auction__media:visited {
    position: relative;
    display: block;
    height: 132px;
    overflow: hidden;
    background: color-mix(in srgb, var(--k, var(--dg-accent)) 12%, var(--dg-surface));
}

.dg-auction__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .3s var(--dg-ease);
}

.dg-auction:hover .dg-auction__media img {
    transform: scale(1.03);
}

.dg-auction__art {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: color-mix(in srgb, var(--k, var(--dg-accent)) 80%, var(--dg-ink));
    font-size: 58px;
}

.dg-auction__art .fa {
    transition: transform .3s var(--dg-ease);
}

.dg-auction:hover .dg-auction__art .fa {
    transform: scale(1.06);
}

.dg-auction--past .dg-auction__media {
    filter: saturate(.55);
}

.dg-auction__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
    padding: 14px 16px 16px;
}

.dg-auction__tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
}

.dg-auction__kind {
    color: var(--dg-ink-3);
    font-size: 12.5px;
    font-weight: 500;
}

.dg-auction__kind .fa {
    margin-right: 3px;
    color: color-mix(in srgb, var(--k, var(--dg-accent)) 80%, var(--dg-ink));
}

.dg-auction__title,
.dg-auction__title:link,
.dg-auction__title:visited {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    color: var(--dg-ink);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.45;
}

.dg-auction__title:hover {
    color: var(--dg-accent);
    text-decoration: none;
}

.dg-state {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 9px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-surface-2);
    color: var(--dg-ink-3);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
}

.dg-state--open {
    background: var(--dg-ok-soft);
    color: var(--dg-ok);
}

.dg-state--open::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
}

.dg-state--upcoming,
.dg-state--soon {
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
}

.dg-facts {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    margin: auto 0 0;
    padding: 12px 0 0;
    border-top: 1px solid var(--dg-line);
}

.dg-facts > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.dg-facts > .dg-facts__full {
    display: block;
    margin-bottom: 2px;
}

.dg-facts:empty {
    display: none;
}

.dg-facts__full {
    grid-column: 1 / -1;
}

.dg-facts dt {
    color: var(--dg-ink-3);
    font-size: 12px;
    font-weight: 500;
}

.dg-facts dd {
    margin: 1px 0 0;
    color: var(--dg-ink);
    font-size: 13.5px;
    font-weight: 600;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.dg-facts dt {
    white-space: nowrap;
}

.dg-facts .dg-facts__price {
    color: var(--dg-accent);
    font-size: 18px;
    white-space: normal;
    font-weight: 700;
    line-height: 1.3;
}

.dg-count {
    margin: 0;
    padding: 8px 10px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
    font-size: 13px;
}

.dg-auction--open .dg-count {
    background: var(--dg-ok-soft);
    color: var(--dg-ok);
}

.dg-count__left {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.dg-auction__admin {
    margin: 0;
    font-size: 13px;
}

.dg-pagetitle {
    font-family: var(--dg-serif);
    margin: 0 0 16px;
    color: var(--dg-ink);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.3;
}

.dg-pager {
    margin-top: var(--dg-gap);
    text-align: center;
}

/* Trang chủ: lịch đấu giá là khu nổi bật nhất, tiêu đề lớn kèm biểu tượng búa */
.dg-homefull .dg-block:has(.dg-auctionbox) {
    border-color: color-mix(in srgb, var(--dg-accent) 28%, var(--dg-line));
    box-shadow: var(--dg-shadow-pop);
}

.dg-homefull .dg-block:has(.dg-auctionbox) > .dg-block__title {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 24px;
    font-size: 23px;
}

.dg-homefull .dg-block:has(.dg-auctionbox) > .dg-block__title::before {
    content: "\f0e3";
    display: inline-grid;
    flex: none;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
    font-family: FontAwesome;
    font-size: 21px;
    font-weight: 400;
}

.dg-homefull .dg-block:has(.dg-auctionbox) > .dg-block__body {
    padding: 20px 24px 24px;
}

@media (max-width: 1199px) {
    .dg-auctions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1023px) {
    .dg-auctions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    .dg-auctions {
        grid-template-columns: minmax(0, 1fr);
    }

    .dg-homefull .dg-block:has(.dg-auctionbox) > .dg-block__title {
        padding: 14px 16px;
        font-size: 19px;
    }

    .dg-homefull .dg-block:has(.dg-auctionbox) > .dg-block__title::before {
        width: 38px;
        height: 38px;
        font-size: 18px;
    }

    .dg-homefull .dg-block:has(.dg-auctionbox) > .dg-block__body {
        padding: 16px;
    }

    .dg-filter {
        width: 100%;
    }

    .dg-filter__btn {
        flex: 1 1 auto;
        justify-content: center;
        padding: 8px 10px;
    }
}

/* ---------- Trang chủ: khối Thông báo đấu giá (thiết kế lại) ----------
   Dải tiêu đề xanh tư pháp; mỗi phiên là một thẻ: ô ngày (màu theo trạng thái), tiêu đề, giá khởi điểm cỡ lớn,
   đồng hồ đếm ngược chia ô ngày/giờ/phút (dgts.js), nút xem chi tiết. Chỉ áp dụng cho .dg-auctionbox--home,
   trang danh sách và chi tiết vẫn dùng thẻ cũ ở trên. */
.dg-homefull .dg-block:has(.dg-auctionbox--home) {
    overflow: hidden;
    border-color: var(--dg-navy);
}

.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title {
    padding: 18px 24px;
    border-bottom: 0;
    border-radius: 0;
    background: var(--dg-navy);
    color: var(--dg-navy-ink);
    font-size: 24px;
}

.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title::before {
    width: 48px;
    height: 48px;
    background: color-mix(in srgb, var(--dg-navy-ink) 16%, transparent);
    color: var(--dg-navy-ink);
    font-size: 22px;
}

.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title a,
.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title a:link,
.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title a:visited {
    color: var(--dg-navy-ink);
}

.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title a::after {
    color: var(--dg-navy-ink-2);
}

.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title a:hover {
    color: var(--dg-navy-ink-2);
}

.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__body {
    padding: 22px 24px 26px;
}

/* Ba tab kiểu thẻ hồ sơ, mỗi tab một màu theo nội dung (Tất cả = xanh, Đang nhận hồ sơ = xanh lá, Sắp đấu giá = hổ phách,
   Đã đấu giá = xám). Tab đang chọn nối liền vào khung nội dung: khung đổi sang màu của tab, tab đè lên đường viền trên của khung. */
.dg-auctionbox--home {
    --tc: var(--dg-accent);
}

.dg-auctionbox--home:has(.dg-filter__btn--open.is-active) { --tc: var(--dg-ok); }
.dg-auctionbox--home:has(.dg-filter__btn--upcoming.is-active) { --tc: #b26a00; }
.dg-auctionbox--home:has(.dg-filter__btn--past.is-active) { --tc: var(--dg-ink-3); }

.dg-auctionbox--home .dg-filter {
    position: relative;
    z-index: 1;
    flex-wrap: nowrap;
    gap: 6px;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.dg-auctionbox--home .dg-filter__btn {
    --bc: var(--dg-accent);
    position: relative;
    flex: 0 1 auto;
    min-height: 54px;
    padding: 12px 22px;
    border: 2px solid color-mix(in srgb, var(--bc) 30%, transparent);
    border-top: 4px solid var(--bc);
    border-bottom: 0;
    border-radius: 12px 12px 0 0;
    background: color-mix(in srgb, var(--bc) 9%, var(--dg-surface));
    color: var(--bc);
    font-size: 15px;
    box-shadow: none;
    white-space: normal;
    text-align: left;
}

.dg-auctionbox--home .dg-filter__btn--open { --bc: var(--dg-ok); }
.dg-auctionbox--home .dg-filter__btn--upcoming { --bc: #b26a00; }
.dg-auctionbox--home .dg-filter__btn--past { --bc: var(--dg-ink-3); }

.dg-auctionbox--home .dg-filter__btn .fa {
    font-size: 17px;
}

.dg-auctionbox--home .dg-filter__btn:hover {
    background: color-mix(in srgb, var(--bc) 17%, var(--dg-surface));
    color: var(--bc);
}

.dg-auctionbox--home .dg-filter__btn.is-active,
.dg-auctionbox--home .dg-filter__btn.is-active:hover {
    z-index: 2;
    margin-bottom: -2px;
    padding-bottom: 14px;
    border-color: var(--bc);
    border-top-width: 4px;
    border-bottom: 0;
    background: var(--dg-surface);
    box-shadow: none;
}

.dg-auctionbox--home .dg-filter__n,
.dg-auctionbox--home .dg-filter__btn--open .dg-filter__n,
.dg-auctionbox--home .dg-filter__btn--open.is-active .dg-filter__n {
    background: color-mix(in srgb, var(--bc) 18%, transparent);
    color: var(--bc);
    font-weight: 700;
}

.dg-auctionbox--home .dg-filter__btn.is-active .dg-filter__n,
.dg-auctionbox--home .dg-filter__btn--open.is-active .dg-filter__n {
    background: var(--bc);
    color: var(--dg-accent-ink);
}

.dg-auctionbox__panel {
    padding: 22px;
    border: 2px solid var(--tc);
    border-radius: 0 14px 14px 14px;
    background: var(--dg-surface);
}

@media (max-width: 767px) {
    .dg-auctionbox--home .dg-filter {
        gap: 4px;
    }

    .dg-auctionbox--home .dg-filter__btn {
        flex: 1 1 0;
        flex-direction: column;
        justify-content: center;
        gap: 4px;
        min-height: 0;
        padding: 10px 6px;
        font-size: 13px;
        text-align: center;
    }

    .dg-auctionbox--home .dg-filter__btn.is-active,
    .dg-auctionbox--home .dg-filter__btn.is-active:hover {
        padding-bottom: 12px;
    }

    .dg-auctionbox__panel {
        padding: 14px;
        border-radius: 0 12px 12px 12px;
    }
}

/* Trang chủ: 3 phiên một hàng (mặc định lấy 6 phiên = 2 hàng); ≤1023px 2 cột, ≤575px 1 cột */
.dg-auctionbox--home .dg-auctions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

@media (max-width: 1023px) {
    .dg-auctionbox--home .dg-auctions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    .dg-auctionbox--home .dg-auctions {
        grid-template-columns: minmax(0, 1fr);
    }
}

.dg-auctionbox--home .dg-auction {
    --dc: var(--dg-accent);
    border-radius: 12px;
    box-shadow: none;
}

.dg-auctionbox--home .dg-auction--open { --dc: var(--dg-ok); }
.dg-auctionbox--home .dg-auction--past { --dc: var(--dg-ink-3); }

.dg-auctionbox--home .dg-auction:hover {
    border-color: var(--dc);
    box-shadow: var(--dg-shadow-pop);
    transform: translateY(-3px);
}

/* Ảnh thật của phiên (nếu có) hiện ở đầu thẻ; không có ảnh thì bỏ hẳn vùng hình minh họa */
.dg-auctionbox--home .dg-auction__media:not(:has(img:not([hidden]))) {
    display: none;
}

.dg-auctionbox--home .dg-auction__media {
    height: 150px;
}

.dg-auctionbox--home .dg-auction__body {
    gap: 14px;
    padding: 18px;
}

.dg-auctionbox--home .dg-auction__head {
    display: flex;
    align-items: center;
    gap: 14px;
}

.dg-date {
    display: flex;
    flex: none;
    flex-direction: column;
    width: 76px;
    overflow: hidden;
    border: 1px solid var(--dc);
    border-radius: 10px;
    background: color-mix(in srgb, var(--dc) 10%, var(--dg-surface));
    color: var(--dc);
    text-align: center;
    line-height: 1;
}

.dg-date__day {
    display: block;
    padding: 9px 0 7px;
    background: var(--dc);
    color: var(--dg-accent-ink);
    font-size: 30px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.dg-date__month {
    display: block;
    padding: 6px 0 7px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.dg-auctionbox--home .dg-auction__tags {
    flex: 1 1 auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    min-width: 0;
}

.dg-auctionbox--home .dg-state {
    font-size: 12.5px;
}

.dg-auctionbox--home .dg-state--past {
    background: var(--dg-surface-2);
    color: var(--dg-ink-3);
}

.dg-auction__time {
    color: var(--dg-ink);
    font-size: 13.5px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.dg-auction__time .fa,
.dg-deadline .fa {
    margin-right: 4px;
    color: var(--dg-ink-3);
}

.dg-auctionbox--home .dg-auction__kind {
    font-size: 12.5px;
}

.dg-auctionbox--home .dg-auction__title,
.dg-auctionbox--home .dg-auction__title:link,
.dg-auctionbox--home .dg-auction__title:visited {
    font-size: 16px;
    line-height: 1.45;
}

.dg-price {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--dg-surface-2);
}

.dg-price__label {
    color: var(--dg-ink-3);
    font-size: 12.5px;
    font-weight: 500;
}

.dg-price__value {
    color: var(--dg-accent);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.25;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.dg-auction--past .dg-price__value {
    color: var(--dg-ink-2);
}

.dg-price__unit {
    font-size: inherit;
    font-weight: 500;
}

.dg-deadline {
    margin: 0;
    color: var(--dg-ink-2);
    font-size: 13px;
    white-space: nowrap;
}

.dg-deadline strong {
    color: var(--dg-ink);
    font-variant-numeric: tabular-nums;
}

.dg-auctionbox--home .dg-count {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px;
    border-radius: 10px;
    font-size: 13px;
}

.dg-count__label {
    font-weight: 500;
}

.dg-count__cells {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.dg-count__cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 7px 4px 6px;
    border-radius: 8px;
    background: var(--dg-surface);
    color: var(--dg-ink);
    line-height: 1.1;
}

.dg-count__cell b {
    font-size: 24px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.dg-count__cell i {
    color: var(--dg-ink-3);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
}

.dg-auction__more,
.dg-auction__more:link,
.dg-auction__more:visited {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--dg-line);
    color: var(--dg-accent);
    font-size: 14px;
    font-weight: 600;
}

.dg-auction__more .fa {
    transition: transform var(--dg-dur) var(--dg-ease);
}

.dg-auction:hover .dg-auction__more .fa {
    transform: translateX(4px);
}

.dg-auction:hover .dg-auction__more {
    color: var(--dg-accent-hover);
}

@media (max-width: 575px) {
    .dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title {
        padding: 14px 16px;
        font-size: 20px;
    }

    .dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title::before {
        width: 40px;
        height: 40px;
        font-size: 19px;
    }

    .dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__body {
        padding: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dg-auctionbox--home .dg-auction:hover {
        transform: none;
    }

    .dg-auction:hover .dg-auction__more .fa {
        transform: none;
    }
}

.dg-related {
    margin-top: var(--dg-section);
    padding: 20px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
}

.dg-related__title {
    font-family: var(--dg-serif);
    margin: 0 0 8px;
    color: var(--dg-ink);
    font-size: 18px;
    font-weight: 700;
}

/* Chi tiết phiên đấu giá (dau-gia detail.tpl) */
.dg-ad {
    margin-bottom: var(--dg-gap);
    padding: 24px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow);
}

.dg-ad__title {
    font-family: var(--dg-serif);
    margin: 0 0 20px;
    color: var(--dg-ink);
    font-size: 24px;
    font-weight: 700;
    line-height: 1.35;
    text-wrap: pretty;
}

.dg-ad__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.dg-ad .dg-slide img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    height: auto;
    border-radius: var(--dg-r);
    background: var(--dg-surface-2);
    object-fit: cover;
}

.dg-ad .dg-thumbs {
    margin-top: 10px;
}

.dg-ad .dg-thumb img {
    display: block;
    width: 100%;
    height: 60px;
    border-radius: var(--dg-r-sm);
    object-fit: cover;
    cursor: pointer;
    opacity: .7;
}

.dg-ad .dg-thumbs .synced .dg-thumb img {
    outline: 2px solid var(--dg-accent);
    outline-offset: -2px;
    opacity: 1;
}

.dg-ad__info [hidden] {
    display: none !important;
}

.dg-ad__price {
    margin: 4px 0 0;
    padding: 14px 16px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent-soft);
}

.dg-ad__label {
    display: block;
    color: var(--dg-ink-2);
    font-size: 13px;
    font-weight: 500;
}

.dg-ad__amount {
    display: block;
    color: var(--dg-accent);
    font-size: 26px;
    font-weight: 700;
    line-height: 1.25;
    font-variant-numeric: tabular-nums;
}

.dg-ad__count {
    margin-top: 12px;
    font-size: 14px;
}

.dg-ad__facts {
    margin: 16px 0 0;
}

.dg-ad__facts > div {
    display: grid;
    grid-template-columns: minmax(0, 11em) minmax(0, 1fr);
    gap: 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--dg-line);
}

.dg-ad__facts > div:last-child {
    border-bottom: 0;
}

.dg-ad__facts > div:has(dd:empty) {
    display: none;
}

.dg-ad__facts dt {
    color: var(--dg-ink-3);
    font-size: 14px;
    font-weight: 500;
}

.dg-ad__facts dd {
    margin: 0;
    color: var(--dg-ink);
    font-size: 14px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* ---------- Chuyên mục tin (news viewcat_two_column) ---------- */
.dg-catgrid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--dg-gap);
    margin-bottom: var(--dg-gap);
}

.dg-catgrid__full {
    grid-column: 1 / -1;
}

.dg-catgrid__full:empty {
    display: none;
}

.dg-catbox {
    display: flex;
    flex-direction: column;
    padding: 16px 18px 18px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow);
}

.dg-catbox {
    transition: border-color var(--dg-dur) var(--dg-ease), box-shadow var(--dg-dur) var(--dg-ease);
}

.dg-catbox:hover {
    border-color: color-mix(in srgb, var(--dg-accent) 35%, var(--dg-line));
    box-shadow: var(--dg-shadow-pop);
}

/* Tiêu đề chuyên mục: dải nền nhạt cùng sắc nhấn, ô biểu tượng theo nội dung chuyên mục (data-cat = alias) */
.dg-catbox__title {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: var(--dg-serif);
    margin: -16px -18px 16px;
    padding: 12px 18px;
    border-bottom: 1px solid color-mix(in srgb, var(--dg-accent) 18%, var(--dg-line));
    border-radius: var(--dg-r) var(--dg-r) 0 0;
    background: color-mix(in srgb, var(--dg-accent) 6%, var(--dg-surface));
    font-size: 17px;
    font-weight: 700;
    line-height: 1.35;
}

.dg-catbox__title::before {
    content: "\f07c";
    display: inline-grid;
    flex: none;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
    font-family: FontAwesome;
    font-size: 17px;
    font-weight: 400;
}

.dg-catbox[data-cat="thong-bao-ket-qua-dau-gia"] .dg-catbox__title::before { content: "\f0e3"; }
.dg-catbox[data-cat="tin-hoat-dong"] .dg-catbox__title::before { content: "\f1ea"; }
.dg-catbox[data-cat="hoi-dap-phap-luat"] .dg-catbox__title::before { content: "\f059"; }
.dg-catbox[data-cat="tiep-nhan-phan-anh"] .dg-catbox__title::before { content: "\f086"; }
.dg-catbox[data-cat="pho-bien-phap-luat"] .dg-catbox__title::before { content: "\f24e"; }
.dg-catbox[data-cat="mau-bieu"] .dg-catbox__title::before { content: "\f0f6"; }
.dg-catbox[data-cat="bao-cao-thong-ke"] .dg-catbox__title::before { content: "\f080"; }

.dg-catbox__title a,
.dg-catbox__title a:link,
.dg-catbox__title a:visited {
    color: var(--dg-accent);
}

.dg-catbox__title a:hover {
    color: var(--dg-accent);
}

.dg-catbox__lead {
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    gap: 14px;
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--dg-line);
}

.dg-catbox__lead:not(:has(.dg-catbox__img)) {
    grid-template-columns: minmax(0, 1fr);
}

.dg-catbox__img {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--dg-r-sm);
    background: var(--dg-surface-2);
}

.dg-catbox__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dg-catbox__headline {
    font-family: var(--dg-serif);
    margin: 0;
    font-size: 15.5px;
    font-weight: 600;
    line-height: 1.45;
}

.dg-catbox__headline a,
.dg-catbox__headline a:link,
.dg-catbox__headline a:visited {
    color: var(--dg-ink);
}

.dg-catbox__headline a:hover {
    color: var(--dg-accent);
}

.dg-catbox .dg-list {
    flex: 1;
}

.dg-catbox .dg-list a {
    font-size: 14.5px;
    font-weight: 400;
    color: var(--dg-ink-2);
}

.dg-catbox .dg-list a:hover {
    color: var(--dg-accent);
}

.dg-catbox .dg-list:empty {
    display: none;
}

.dg-catbox .dg-more {
    margin-top: auto;
    padding-top: 14px;
    align-self: flex-start;
}

.dg-catintro,
.dg-catlead {
    margin-bottom: var(--dg-gap);
    padding: 18px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
}

.dg-catintro__title {
    font-family: var(--dg-serif);
    margin: 0 0 8px;
    font-size: 22px;
    font-weight: 700;
}

.dg-catintro__img {
    float: left;
    margin: 0 16px 8px 0;
    border-radius: var(--dg-r-sm);
}

.dg-story {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 18px;
    margin-bottom: 16px;
}

.dg-story:not(:has(.dg-story__img)) {
    grid-template-columns: minmax(0, 1fr);
}

.dg-story__img {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--dg-r-sm);
}

.dg-story__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dg-story__title {
    font-family: var(--dg-serif);
    margin: 0;
    font-size: 19px;
    font-weight: 700;
}

.dg-story__title a,
.dg-story__title a:link,
.dg-story__title a:visited {
    color: var(--dg-ink);
}

.dg-story__text {
    margin-top: 8px;
    color: var(--dg-ink-2);
}

/* ---------- Ảnh hoạt động (photos block_album_tab_new) ---------- */
.block_album_tab_new .tab-content > .tab-pane {
    padding: 16px 0 0 !important;
}

.block_album_tab_new .tab-content .row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
}

.block_album_tab_new .tab-content .row::before,
.block_album_tab_new .tab-content .row::after {
    content: none;
}

.block_album_tab_new .tab-content .row > div {
    width: auto;
    float: none;
    padding: 0;
    margin: 0 !important;
}

.block_album_tab_new .tab-content a {
    display: block;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: var(--dg-r-sm);
    background: var(--dg-surface-2);
}

.block_album_tab_new .tab-content img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s var(--dg-ease);
}

.block_album_tab_new .tab-content a:hover img {
    transform: scale(1.04);
}

.block_album_tab_new > .nav-tabs {
    padding: 0;
}

/* ---------- Cột phải ---------- */
.dg-cols__side select,
.dg-main select.form-control {
    width: 100%;
    height: 42px;
    padding: 8px 10px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r-sm);
    background-color: var(--dg-surface);
    color: var(--dg-ink);
    font-size: 14px;
}

.dg-main .zing-clip-big {
    position: relative;
    overflow: hidden;
    border-radius: var(--dg-r-sm);
    background: var(--dg-surface-2);
}

.dg-main .zing-clip-big img,
.dg-main .zing-clip-small img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.dg-main .zing-clip-big .icon,
.dg-main .zing-clip-small .icon {
    display: none;
}

.dg-main .zing-clip-big-h1,
.dg-main .zing-clip-small h1 {
    height: auto;
    margin: 8px 0 14px;
    padding: 0;
    background: none;
    font-size: 14.5px !important;
    font-weight: 600;
    line-height: 1.45;
}

.dg-main .zing-clip-small h1 {
    margin-bottom: 0;
    font-size: 13.5px !important;
}

.dg-main .zing-clip-big-h1 a,
.dg-main .zing-clip-small h1 a {
    color: var(--dg-ink) !important;
    font-weight: 600;
}

.dg-main .zing-clip-big-h1 a:hover,
.dg-main .zing-clip-small h1 a:hover {
    color: var(--dg-accent) !important;
}

.dg-main .zing-clip-small .img {
    height: auto;
}

.dg-main .zing-clip-small .img img {
    min-height: 0;
}

.dg-main .zing-clip-small a.img {
    display: block;
    overflow: hidden;
    border-radius: var(--dg-r-sm);
}

.widget-right-menu .ssmenu,
.dg-cols__side .ssmenu {
    margin: 0;
    padding: 0;
    list-style: none;
}

.dg-cols__side ul.ssmenu > li,
.widget-right-menu .ssmenu li {
    padding: 0;
    border-bottom: 1px solid var(--dg-line);
}

.dg-cols__side ul.ssmenu > li:last-child {
    border-bottom: 0;
}

.dg-cols__side ul.ssmenu > li::before {
    content: none;
}

.dg-cols__side ul.ssmenu a,
.dg-cols__side ul.ssmenu a:link,
.dg-cols__side ul.ssmenu a:visited {
    display: block;
    padding: 10px 0;
    color: var(--dg-ink);
    font-weight: 500;
}

.dg-cols__side ul.ssmenu a:hover {
    color: var(--dg-accent);
}

/* Danh mục metisMenu trong khối cột phải: bỏ khung panel lồng trong khối */
.dg-block__body > .metismenu.panel {
    margin: 0;
    border: 0;
    background: none;
    box-shadow: none;
}

/* ---------- Nội dung module ---------- */
.dg-main h1 {
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -.01em;
}

.dg-main .news_column .panel-body h1,
.dg-main .news-detail h1,
.dg-main .detail h1,
.dg-main h1.title {
    font-size: 26px;
    line-height: 1.35;
}

.dg-main .bodytext,
.dg-main #news-bodyhtml,
.dg-main .news-content {
    font-size: 16px;
    line-height: 1.75;
    color: var(--dg-ink);
}

.dg-main .bodytext img,
.dg-main #news-bodyhtml img {
    border-radius: var(--dg-r-sm);
}

.dg-main .bodytext table,
.dg-main #news-bodyhtml table {
    max-width: 100%;
}

.dg-main .text-muted {
    color: var(--dg-ink-3);
}

.dg-main .hometext {
    color: var(--dg-ink-2);
    font-weight: 500;
}

.dg-main .news_column .panel-body h3,
.dg-main .news_column h3 {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.45;
}

.dg-main .news_column h3 a,
.dg-main .news_column h3 a:link,
.dg-main .news_column h3 a:visited {
    color: var(--dg-ink);
}

.dg-main .news_column h3 a:hover {
    color: var(--dg-accent);
}

.dg-main .imghome,
.dg-main .img-thumbnail {
    border-radius: var(--dg-r-sm);
    border-color: var(--dg-line);
    background: var(--dg-surface);
}

.dg-main .related li,
.dg-main .list-items li {
    border-color: var(--dg-line);
}

.dg-main .icon_new {
    display: none;
}

/* ---------- Bootstrap: nút, ô nhập, bảng, phân trang ---------- */
.btn {
    border-radius: var(--dg-r-sm);
    font-weight: 600;
    transition: background-color var(--dg-dur) var(--dg-ease), border-color var(--dg-dur) var(--dg-ease), color var(--dg-dur) var(--dg-ease);
}

.btn:active,
.btn.active {
    transform: translateY(1px);
    box-shadow: none;
}

.btn-primary,
.btn-primary:link,
.btn-primary:visited {
    border-color: var(--dg-accent);
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    border-color: var(--dg-accent-hover);
    background: var(--dg-accent-hover);
    color: var(--dg-accent-ink);
}

.btn-default {
    border-color: var(--dg-line);
    background: var(--dg-surface);
    color: var(--dg-ink);
}

.btn-default:hover,
.btn-default:focus {
    border-color: var(--dg-ink-3);
    background: var(--dg-surface-2);
    color: var(--dg-ink);
}

.form-control {
    border-color: var(--dg-line);
    border-radius: var(--dg-r-sm);
    background-color: var(--dg-surface);
    color: var(--dg-ink);
    box-shadow: none;
}

.form-control:focus {
    border-color: var(--dg-accent);
    box-shadow: 0 0 0 3px var(--dg-accent-soft);
}

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

.dg-main label,
.dg-main .control-label {
    color: var(--dg-ink);
    font-weight: 600;
}

.input-group-addon {
    border-color: var(--dg-line);
    background: var(--dg-surface-2);
    color: var(--dg-ink-2);
}

.dg-main .table {
    color: var(--dg-ink);
}

.dg-main .table > thead > tr > th {
    border-bottom: 1px solid var(--dg-line);
    background: var(--dg-surface-2);
    color: var(--dg-ink);
    font-weight: 600;
}

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

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

.dg-main .table-hover > tbody > tr:hover {
    background: var(--dg-accent-soft);
}

.pagination > li > a,
.pagination > li > span {
    margin: 0 2px;
    border-color: var(--dg-line);
    border-radius: var(--dg-r-sm) !important;
    background: var(--dg-surface);
    color: var(--dg-ink);
}

.pagination > li > a:hover,
.pagination > li > a:focus {
    border-color: var(--dg-accent);
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
    border-color: var(--dg-accent);
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
}

.alert {
    border-radius: var(--dg-r);
}

.alert-info {
    border-color: #c4d4ec;
    background: var(--dg-accent-soft);
    color: var(--dg-ink);
}

.well,
.list-group-item {
    border-color: var(--dg-line);
    background: var(--dg-surface);
    color: var(--dg-ink);
}

.well {
    border-radius: var(--dg-r);
    box-shadow: none;
}

.dropdown-menu {
    border-color: var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow-pop);
}

.dropdown-menu > li > a {
    color: var(--dg-ink);
}

.dropdown-menu > li > a:hover {
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
}

.modal-content {
    border-color: var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    color: var(--dg-ink);
}

/* ---------- Thống kê truy cập: dải ngang ngay trên chân trang ---------- */
.dg-stats {
    border-top: 1px solid var(--dg-line);
    background: var(--dg-surface);
}

.dg-stats__in {
    display: flex;
    align-items: center;
    gap: 28px;
    padding-top: 18px;
    padding-bottom: 18px;
}

.dg-stats__title {
    display: flex;
    flex: none;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: var(--dg-accent);
    font-family: var(--dg-serif);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.35;
}

.dg-stats__icon {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
    font-family: var(--dg-font);
    font-size: 18px;
}

.dg-stats__body {
    flex: 1 1 auto;
    min-width: 0;
}

.dg-counter {
    display: grid;
    grid-auto-columns: minmax(0, 1fr);
    grid-auto-flow: column;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dg-counter__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 12px;
    align-items: center;
    padding: 4px 20px;
    border-left: 1px solid var(--dg-line);
}

.dg-counter__icon {
    display: grid;
    grid-row: 1 / 3;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
    font-size: 16px;
}

.dg-counter__num {
    color: var(--dg-ink);
    font-size: 21px;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.dg-counter__label {
    color: var(--dg-ink-3);
    font-size: 13px;
    line-height: 1.35;
}

/* ---------- Chân trang ---------- */
.dg-footer {
    position: relative;
    overflow: hidden;
    background: var(--dg-navy);
    color: var(--dg-navy-ink-2);
    font-size: 14px;
    line-height: 1.65;
}

.dg-footer > .wraper,
.dg-footer__bar {
    position: relative;
    z-index: 1;
}

.dg-footer__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, .85fr);
    gap: 36px;
    padding: 40px 0 36px;
}

.dg-footer__brand {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    min-width: 0;
}

.dg-footer__mark {
    flex: none;
    width: 52px;
    height: auto;
}

.dg-footer__brand p {
    margin: 0;
}

.dg-footer__parent {
    color: var(--dg-navy-ink-2);
    font-size: 13.5px;
}

.dg-footer__name {
    margin-top: 4px !important;
    color: var(--dg-navy-ink);
    font-family: var(--dg-serif);
    font-size: 17px;
    font-weight: 700;
    line-height: 1.45;
    text-transform: uppercase;
}

.dg-footer__resp {
    margin-top: 12px !important;
    font-size: 13.5px;
}

.dg-footer__head {
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, .16);
    color: var(--dg-navy-ink);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
}

.dg-footer__list {
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dg-footer__list li {
    display: flex;
    gap: 10px;
    min-width: 0;
}

.dg-footer__list .fa {
    flex: none;
    width: 16px;
    margin-top: 4px;
    color: var(--dg-navy-ink);
    text-align: center;
}

.dg-footer__links li::before {
    content: "\f105";
    flex: none;
    color: var(--dg-navy-ink-2);
    font-family: FontAwesome;
}

.dg-footer a,
.dg-footer a:link,
.dg-footer a:visited {
    color: var(--dg-navy-ink);
    text-decoration: none;
    overflow-wrap: anywhere;
}

.dg-footer a:hover {
    color: var(--dg-navy-ink-2);
    text-decoration: none;
}

.dg-footer__bar {
    background: var(--dg-navy-2);
    font-size: 13px;
}

.dg-footer__bar-in {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 16px;
    min-height: 48px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.dg-footer .theme-change {
    display: inline-flex;
    gap: 6px;
}

.dg-footer .theme-change a,
.dg-footer .theme-change span {
    display: inline-grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(232, 238, 247, .28);
    border-radius: var(--dg-r-sm);
    color: var(--dg-navy-ink);
    text-decoration: none;
}

@media (max-width: 1199px) {
    .dg-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px 36px;
    }

    .dg-stats__in {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }

    .dg-counter__item:first-child {
        border-left: 0;
        padding-left: 0;
    }
}

@media (max-width: 767px) {
    .dg-counter {
        grid-auto-flow: row;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .dg-counter__item,
    .dg-counter__item:first-child {
        padding: 10px 12px;
        border: 1px solid var(--dg-line);
        border-radius: var(--dg-r-sm);
    }

    .dg-counter__num {
        font-size: 18px;
    }

    .dg-footer__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;
        padding: 28px 0;
    }
}

.dg-totop,
.dg-totop:link,
.dg-totop:visited {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 40;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r-sm);
    background: var(--dg-surface);
    color: var(--dg-accent);
    box-shadow: var(--dg-shadow-pop);
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: opacity var(--dg-dur) var(--dg-ease), transform var(--dg-dur) var(--dg-ease), visibility 0s linear var(--dg-dur);
    text-decoration: none;
}

.dg-totop.is-visible {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition-delay: 0s;
}

.dg-totop:hover {
    background: var(--dg-accent);
    border-color: var(--dg-accent);
    color: var(--dg-accent-ink);
}

/* Trang chủ: cột phải chỉ còn "Liên kết site" (video, ảnh đã chuyển xuống [HOME_MEDIA]) nên chuyên mục dùng cả bề rộng,
   3 cột; khối cột phải thành dải ngang bên dưới (tiêu đề trái, nội dung phải) */
.dg-home .dg-cols {
    grid-template-columns: minmax(0, 1fr);
}

.dg-home .dg-catgrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dg-home .dg-cols__side {
    display: flex;
    flex-wrap: wrap;
    gap: var(--dg-gap);
    margin-bottom: var(--dg-gap);
}

.dg-home .dg-cols__side:empty {
    display: none;
}

.dg-home .dg-cols__side > .dg-block {
    display: flex;
    flex: 1 1 360px;
    align-items: stretch;
    margin-bottom: 0;
    overflow: hidden;
}

.dg-home .dg-cols__side > .dg-block > .dg-block__title {
    display: flex;
    flex: none;
    align-items: center;
    border-radius: var(--dg-r) 0 0 var(--dg-r);
}

.dg-home .dg-cols__side > .dg-block > .dg-block__body {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    min-width: 0;
}

/* ---------- Trang chủ: Hình ảnh – Video ([HOME_MEDIA]) ---------- */
.dg-homemedia {
    margin-bottom: var(--dg-section);
}

.dg-homemedia:empty {
    display: none;
}

/* Đầu mục có ô biểu tượng, dùng cho khu ảnh, video */
.dg-sechead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.dg-sechead__title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: var(--dg-accent);
    font-family: var(--dg-serif);
    font-size: 19px;
    font-weight: 700;
    line-height: 1.35;
}

.dg-sechead__icon {
    display: inline-grid;
    flex: none;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: var(--dg-r-sm);
    background: var(--dg-accent-soft);
    color: var(--dg-accent);
    font-family: var(--dg-font);
    font-size: 17px;
}

.dg-sechead__more,
.dg-sechead__more:link,
.dg-sechead__more:visited {
    flex: none;
    color: var(--dg-accent);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

.dg-sechead__more::after {
    content: "\f105";
    margin-left: 6px;
    font-family: FontAwesome;
}

.dg-sechead__more {
    transition: color var(--dg-dur) var(--dg-ease);
}

.dg-sechead__more:hover {
    color: var(--dg-accent-hover);
    text-decoration: none;
}

.dg-media {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: var(--dg-gap);
}

.dg-media__pane {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 18px 20px 20px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r);
    background: var(--dg-surface);
    box-shadow: var(--dg-shadow);
}

.dg-player__screen {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: var(--dg-r-sm);
    background: #0b1626;
}

.dg-player__screen video,
.dg-player__screen iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: #0b1626;
}

.dg-player__msg {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    margin: 0;
    padding: 24px;
    background: #0b1626;
    color: #dbe5f2;
    font-size: 14.5px;
    line-height: 1.6;
    text-align: center;
}

.dg-player__cover {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    border: 0;
    background: #0b1626 center / cover no-repeat;
    color: #ffffff;
    font-size: 30px;
    cursor: pointer;
}

.dg-player__cover .fa {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    padding-left: 5px;
    border-radius: 50%;
    background: #004999;
    transition: transform var(--dg-dur) var(--dg-ease);
}

.dg-player__cover:hover .fa {
    transform: scale(1.06);
}

.dg-playlist {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 10px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}

.dg-playlist__item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    height: 100%;
    padding: 10px 12px;
    border: 1px solid var(--dg-line);
    border-radius: var(--dg-r-sm);
    background: var(--dg-surface);
    color: var(--dg-ink);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color var(--dg-dur) var(--dg-ease), background-color var(--dg-dur) var(--dg-ease);
}

.dg-playlist__item:hover {
    border-color: var(--dg-accent);
}

.dg-playlist__item[aria-current="true"] {
    border-color: var(--dg-accent);
    background: var(--dg-accent-soft);
}

.dg-playlist__icon {
    display: grid;
    flex: none;
    place-items: center;
    width: 30px;
    height: 30px;
    padding-left: 2px;
    border-radius: 50%;
    background: var(--dg-accent);
    color: var(--dg-accent-ink);
    font-size: 12px;
}

.dg-playlist__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.dg-playlist__title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.4;
}

.dg-playlist__item[aria-current="true"] .dg-playlist__title {
    color: var(--dg-accent);
}

.dg-playlist__date {
    color: var(--dg-ink-3);
    font-size: 12px;
}

/* Lưới ảnh: ảnh đầu lớn chiếm 2x2 ô */
.dg-gallery {
    display: grid;
    flex: 1 1 auto;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: minmax(96px, 1fr);
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.dg-gallery__item:first-child {
    grid-column: span 2;
    grid-row: span 2;
}

.dg-gallery__link,
.dg-gallery__link:link {
    display: block;
    height: 100%;
    overflow: hidden;
    border-radius: var(--dg-r-sm);
    background: var(--dg-surface-2);
}

.dg-gallery__link img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s var(--dg-ease);
}

.dg-gallery__link:hover img {
    transform: scale(1.05);
}

.dg-gallery__link:focus-visible {
    outline: 3px solid var(--dg-accent);
    outline-offset: 2px;
}

/* Hộp xem ảnh lớn */
.dg-lightbox {
    width: 100vw;
    max-width: none;
    height: 100dvh;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

.dg-lightbox::backdrop {
    background: rgba(5, 12, 22, .9);
}

.dg-lightbox__fig {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    height: 100%;
    margin: 0;
    padding: 56px 72px 24px;
}

.dg-lightbox__img {
    max-width: 100%;
    max-height: calc(100dvh - 120px);
    border-radius: var(--dg-r-sm);
    object-fit: contain;
}

.dg-lightbox__cap {
    color: #e6edf6;
    font-size: 14px;
    text-align: center;
}

.dg-lightbox__btn {
    position: fixed;
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    color: #ffffff;
    font-size: 26px;
    cursor: pointer;
    transition: background-color var(--dg-dur) var(--dg-ease);
}

.dg-lightbox__btn:hover,
.dg-lightbox__btn:focus-visible {
    background: rgba(255, 255, 255, .28);
}

.dg-lightbox__close {
    top: 14px;
    right: 14px;
    font-size: 20px;
}

.dg-lightbox__prev {
    top: 50%;
    left: 14px;
    transform: translateY(-50%);
}

.dg-lightbox__next {
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
}

.dg-lightbox--single .dg-lightbox__prev,
.dg-lightbox--single .dg-lightbox__next {
    display: none;
}

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

@media (max-width: 575px) {
    .dg-media__pane {
        padding: 14px;
    }

    .dg-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dg-gallery__item:first-child {
        grid-row: span 1;
    }

    .dg-lightbox__fig {
        padding: 56px 12px 72px;
    }

    .dg-lightbox__prev,
    .dg-lightbox__next {
        top: auto;
        bottom: 14px;
        transform: none;
    }
}

@media (max-width: 1199px) {
    .dg-home .dg-catgrid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .dg-home .dg-catgrid {
        grid-template-columns: minmax(0, 1fr);
    }

    .dg-home .dg-cols__side > .dg-block {
        flex-direction: column;
    }

    .dg-home .dg-cols__side > .dg-block > .dg-block__title {
        border-radius: var(--dg-r) var(--dg-r) 0 0;
    }
}

/* ---------- Đáp ứng ---------- */
@media (max-width: 1199px) {
    .dg-lead {
        grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    }

    .dg-laws {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dg-brand__name {
        font-size: 27px;
    }

    .dg-menu > li > a,
    .dg-menu > li > a:link,
    .dg-menu > li > a:visited {
        padding: 0 11px;
        font-size: 14px;
    }
}

@media (max-width: 1023px) {
    .dg-header__in {
        min-height: 92px;
        gap: 12px;
        flex-wrap: wrap;
    }

    .dg-brand__mark {
        width: 62px;
    }

    .dg-brand__parent {
        font-size: 14px;
    }

    .dg-brand__name {
        -webkit-text-stroke-width: 3.5px;
        font-size: 23px;
    }

    .dg-menubtn {
        display: inline-flex;
        margin-left: auto;
    }

    .dg-search {
        order: 3;
        width: 100%;
        margin-left: 0;
    }

    .dg-nav {
        display: none;
    }

    .dg-nav.is-open {
        display: block;
    }

    .dg-menu {
        flex-direction: column;
        padding: 6px 0 10px;
    }

    .dg-menu > li {
        flex-wrap: wrap;
        border-bottom: 1px solid var(--dg-line);
    }

    .dg-menu > li:last-child {
        border-bottom: 0;
    }

    .dg-menu > li > a,
    .dg-menu > li > a:link,
    .dg-menu > li > a:visited,
    .dg-menu > li:first-child > a {
        flex: 1;
        padding: 0;
        line-height: 48px;
        font-size: 15px;
    }

    .dg-menu > li.current > a,
    .dg-menu > li.active > a {
        box-shadow: none;
        text-decoration: underline;
        text-underline-offset: 6px;
    }

    .dg-menu__toggle {
        display: inline-grid;
        place-items: center;
        width: 44px;
        height: 44px;
        border: 0;
        border-radius: var(--dg-r-sm);
        background: transparent;
        color: var(--dg-accent);
        font-size: 18px;
    }

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

    .dg-menu > li > .dg-menu__sub,
    .dg-menu > li:first-child > .dg-menu__sub {
        position: static;
        display: none;
        flex-basis: 100%;
        min-width: 0;
        margin: 0 0 10px;
        padding: 4px;
        border: 0;
        border-radius: var(--dg-r-sm);
        background: var(--dg-surface-2);
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        transition: none;
    }

    .dg-menu > li:hover > .dg-menu__sub,
    .dg-menu > li:focus-within > .dg-menu__sub {
        display: none;
    }

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

    .dg-menu__sub a,
    .dg-menu__sub a:link,
    .dg-menu__sub a:visited {
        color: var(--dg-ink);
        padding: 11px 12px;
    }

    .dg-menu__sub a:hover,
    .dg-menu__sub a:focus {
        background: var(--dg-accent-soft);
        color: var(--dg-accent);
    }

    .dg-cols,
    .dg-cols--left {
        grid-template-columns: minmax(0, 1fr);
    }

    .dg-cols--left .dg-cols__side {
        order: 0;
    }

    .dg-cols__side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 767px) {
    :root {
        --dg-gap: 16px;
        --dg-section: 20px;
    }

    body {
        font-size: 15px;
    }

    .dg-topbar a.dg-topbar__mail,
    .dg-topbar__date {
        display: none;
    }

    .dg-topbar__in > .dg-topbar__link:first-child {
        margin-right: auto;
    }

    .dg-header__in {
        padding-top: 10px;
        padding-bottom: 12px;
    }

    .dg-brand {
        gap: 10px;
        flex: 1;
    }

    .dg-brand__mark {
        width: 50px;
    }

    .dg-brand__parent {
        font-size: 12.5px;
    }

    .dg-brand__name {
        -webkit-text-stroke-width: 3px;
        font-size: 18px;
    }

    .dg-brand__parent {
        margin-bottom: 3px;
    }

    .dg-menubtn span {
        display: none;
    }

    .dg-menubtn {
        width: 42px;
        justify-content: center;
        padding: 0;
    }

    .dg-search__btntext {
        display: none;
    }

    .dg-lead,
    .dg-pair,
    .dg-catgrid,
    .dg-cols__side,
    .dg-laws {
        grid-template-columns: minmax(0, 1fr);
    }

    .dg-feature__title {
        font-size: 18px;
    }

    .dg-story {
        grid-template-columns: minmax(0, 1fr);
    }

    .dg-catbox__lead {
        grid-template-columns: 104px minmax(0, 1fr);
    }

    .block_album_tab_new .tab-content .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dg-block > .dg-block__title,
    .dg-main .panel > .panel-heading,
    .dg-catbox__title {
        font-size: 16px;
    }

    .dg-main h1,
    .dg-main .news_column .panel-body h1,
    .dg-main h1.title {
        font-size: 22px;
    }

    .dg-notice .block-simple-menu-slide {
        min-height: 40px;
    }
}

@media (max-width: 991px) {
    .dg-ad__grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 767px) {
    .dg-ad {
        padding: 16px;
    }

    .dg-ad__title {
        font-size: 20px;
    }

    .dg-ad__amount {
        font-size: 22px;
    }

    .dg-ad__facts > div {
        grid-template-columns: minmax(0, 1fr);
        gap: 2px;
    }
}

/* ---------- Nền tối ---------- */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --dg-bg: #0c121c;
        --dg-surface: #131b28;
        --dg-surface-2: #1b2535;
        --dg-line: #29354a;
        --dg-ink: #e5eaf2;
        --dg-ink-2: #bcc6d4;
        --dg-ink-3: #97a3b6;
        --dg-accent: #86b2f0;
        --dg-accent-hover: #a9c8f5;
        --dg-accent-soft: #1a2a44;
        --dg-accent-ink: #0c121c;
        --dg-navy: #0f2340;
        --dg-brand-ink: var(--dg-ink);
        --dg-red: #ef8b8b;
        --dg-ok: #74d39c;
        --dg-ok-soft: #15301f;
        --dg-navy-2: #0a1a31;
        --dg-shadow: 0 1px 2px rgba(0, 0, 0, .3);
        --dg-shadow-pop: 0 12px 30px rgba(0, 0, 0, .45);
        color-scheme: dark;
    }
}

:root[data-theme="dark"] {
    --dg-bg: #0c121c;
    --dg-surface: #131b28;
    --dg-surface-2: #1b2535;
    --dg-line: #29354a;
    --dg-ink: #e5eaf2;
    --dg-ink-2: #bcc6d4;
    --dg-ink-3: #97a3b6;
    --dg-accent: #86b2f0;
    --dg-accent-hover: #a9c8f5;
    --dg-accent-soft: #1a2a44;
    --dg-accent-ink: #0c121c;
    --dg-navy: #0f2340;
    --dg-brand-ink: var(--dg-ink);
    --dg-red: #ef8b8b;
    --dg-ok: #74d39c;
    --dg-ok-soft: #15301f;
    --dg-navy-2: #0a1a31;
    --dg-shadow: 0 1px 2px rgba(0, 0, 0, .3);
    --dg-shadow-pop: 0 12px 30px rgba(0, 0, 0, .45);
    color-scheme: dark;
}

/* Biểu tượng nút sáng/tối theo nền đang dùng */
:root[data-theme="dark"] .dg-themebtn__dark {
    display: none;
}

:root[data-theme="dark"] .dg-themebtn__light {
    display: inline;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .dg-themebtn__dark {
        display: none;
    }

    :root:not([data-theme="light"]) .dg-themebtn__light {
        display: inline;
    }
}

/* Phần nền trắng cố định trong style.css, news.css, module: theo token khi tối */
.dg-main .panel-body,
.dg-main .well,
.dg-main .tab-content,
.dg-main .news_column .panel,
.dg-main .detail,
.dg-main .bodytext,
.dg-main table {
    background-color: transparent;
}

.dg-main,
.dg-main p,
.dg-main li,
.dg-main td,
.dg-main th,
.dg-main .text-justify {
    color: inherit;
}

/* ---------- Trợ năng ---------- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition-duration: 0s !important;
        animation-duration: 0s !important;
        scroll-behavior: auto !important;
    }

    .dg-feature__img:hover img,
    .block_album_tab_new .tab-content a:hover img {
        transform: none;
    }
}

@media print {
    .dg-topbar,
    .dg-nav,
    .dg-notice,
    .dg-search,
    .dg-menubtn,
    .dg-totop,
    .dg-cols__side,
    .dg-stats,
    .dg-homemedia {
        display: none !important;
    }

    .dg-cols {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* ---------- Rà soát dấu hiệu thiết kế AI (PORTAL-DGTS-RASOAT-AI, 04/11/2026) ----------
   Đặt cuối tệp để đè các quy tắc phía trên; bản trước khi sửa: .tiepnoi/goc/PORTAL-DGTS-RASOAT-AI/dgts.css */

/* 1. Bỏ ô vuông nền màu chứa icon trước tiêu đề các khối: tiêu đề chỉ còn chữ */
.dg-sechead__icon,
.dg-stats__icon,
.dg-catbox__title::before,
.dg-docs > .dg-block > .dg-block__title::before,
.dg-homefull .dg-block:has(.dg-auctionbox) > .dg-block__title::before,
.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__title::before {
    content: none;
    display: none;
}

/* 2. Thẻ phiên trang chủ: bỏ ô lịch ngày lớn (ngày giờ đấu giá đã có ở dòng bên dưới), trạng thái là chữ màu
   không nền không chấm, thời gian còn lại là một dòng chữ thay cho ba ô số */
.dg-auctionbox--home .dg-date {
    display: none;
}

.dg-auctionbox--home .dg-state,
.dg-auctionbox--home .dg-state--past {
    padding: 0;
    background: none;
    font-size: 13px;
}

.dg-auctionbox--home .dg-state::before {
    content: none;
    display: none;
}

.dg-auctionbox--home .dg-count {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 6px;
    padding: 0;
    background: none;
    color: var(--dg-ink-2);
}

.dg-auctionbox--home .dg-count__left {
    color: var(--dg-ink);
    font-variant-numeric: tabular-nums;
}

/* 3. Thống kê truy cập: một dòng chữ "nhãn số", ngăn bằng vạch mảnh, không icon tròn */
.dg-counter {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 0;
}

.dg-counter__item,
.dg-counter__item:first-child {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    padding: 0 14px;
    border: 0;
    border-left: 1px solid var(--dg-line);
    border-radius: 0;
}

.dg-counter__item:first-child {
    padding-left: 0;
    border-left: 0;
}

.dg-counter__num,
.dg-counter__label {
    font-size: 14px;
    line-height: 1.5;
}

.dg-counter__num {
    font-weight: 700;
}

/* 4. Thẻ không nổi lên khi rê chuột: chỉ đổi màu viền */
.dg-laws__item:hover,
.dg-auction:hover,
.dg-auctionbox--home .dg-auction:hover {
    box-shadow: none;
    transform: none;
}

@media (max-width: 767px) {
    .dg-counter {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px 16px;
    }

    .dg-counter__item,
    .dg-counter__item:first-child {
        padding: 0;
        border: 0;
    }
}

@media (max-width: 767px) {
    .dg-counter__item,
    .dg-counter__item:first-child {
        flex-wrap: wrap;
        gap: 0 6px;
        min-width: 0;
    }
}

/* ---------- Cân đối khối Thông báo đấu giá trang chủ (04/11/2026) ----------
   Đầu thẻ: trạng thái + loại tài sản cùng một hàng, giờ đấu giá hàng riêng cỡ chữ rõ hơn;
   hạn nộp hồ sơ và thời gian còn lại gộp thành một cụm, không lặp chữ "Hạn nộp hồ sơ";
   lề trên/dưới trong khối bằng nhau. */
.dg-homefull .dg-block:has(.dg-auctionbox--home) > .dg-block__body {
    padding-top: 24px;
    padding-bottom: 24px;
}

.dg-auctionbox--home .dg-auction__body {
    gap: 12px;
}

.dg-auctionbox--home .dg-auction__tags {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 14px;
}

.dg-auctionbox--home .dg-auction__time {
    flex: 1 0 100%;
    margin-top: 2px;
    font-size: 14px;
}

.dg-auctionbox--home .dg-deadline {
    margin-top: 2px;
}

.dg-auctionbox--home .dg-auction--open .dg-count__label {
    display: none;
}

.dg-auctionbox--home .dg-auction--open .dg-count {
    margin-top: -8px;
    padding-left: 18px;
}

.dg-auctionbox--home .dg-auction--open .dg-count__left {
    color: var(--dg-ok);
    font-weight: 600;
}

.dg-auctionbox--home .dg-auction--open .dg-count__left::before {
    content: "còn ";
    font-weight: 400;
}

/* ---------- Màu nền thẻ phiên theo trạng thái (04/11/2026) ----------
   Đang nhận hồ sơ: nền xanh lá rất nhạt, viền xanh lá nhạt; Đã đấu giá: nền xám, chữ dịu hơn.
   Ô giá khởi điểm để nền trắng (surface) cho nổi trên nền thẻ. Tự theo nền tối vì dùng biến màu. */
.dg-auctionbox--home .dg-auction--open {
    border-color: color-mix(in srgb, var(--dg-ok) 45%, var(--dg-line));
    background: color-mix(in srgb, var(--dg-ok) 14%, var(--dg-surface));
}

.dg-auctionbox--home .dg-auction--past {
    border-color: var(--dg-line);
    background: var(--dg-surface-2);
}

.dg-auctionbox--home .dg-auction--open .dg-price,
.dg-auctionbox--home .dg-auction--past .dg-price {
    background: var(--dg-surface);
}

.dg-auctionbox--home .dg-auction--open .dg-auction__more {
    border-top-color: color-mix(in srgb, var(--dg-ok) 32%, var(--dg-line));
}

.dg-auctionbox--home .dg-auction--past .dg-auction__title,
.dg-auctionbox--home .dg-auction--past .dg-auction__title:link,
.dg-auctionbox--home .dg-auction--past .dg-auction__title:visited {
    color: var(--dg-ink-2);
}

.dg-auctionbox--home .dg-auction--past .dg-auction__media img {
    filter: grayscale(.6);
}
