/* THAMDINHSO.VN — bảng màu & thành phần dùng chung cho site công khai */

@font-face {
    font-family: 'Inter';
    src: url('/fonts/Inter-v20-vietnamese-300-700.woff2') format('woff2');
    font-weight: 300 700;
    font-style: normal;
    font-display: swap;
    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: 'Inter';
    src: url('/fonts/Inter-v20-latin-300-700.woff2') format('woff2');
    font-weight: 300 700;
    font-style: normal;
    font-display: swap;
}

:root {
    --tds-cream: #F7F3E9;
    --tds-cream-soft: #FBF9F3;
    --tds-navy: #16213E;
    --tds-navy-deep: #0F1830;
    --tds-navy-soft: #1E2C4F;
    --tds-gold: #C9962C;
    --tds-gold-dark: #A97C22;
    --tds-ink: #2B2B26;
    --tds-muted: #6B6A63;
    --tds-line: rgba(22, 33, 62, 0.10);
}

body {
    font-family: 'Plus Jakarta Sans', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--tds-ink);
    background-color: #fff;
}

.form-control::placeholder,
.form-control::-webkit-input-placeholder,
textarea::placeholder {
    color: var(--tds-muted);
    font-weight: 400;
    font-size: .9rem;
    opacity: 1;
}

/* Checkbox/radio dùng màu navy thay vì xanh dương mặc định của Bootstrap */
.form-check-input:checked {
    background-color: var(--tds-navy);
    border-color: var(--tds-navy);
}
.form-check-input:focus {
    border-color: var(--tds-navy);
    box-shadow: 0 0 0 .25rem rgba(22, 33, 62, .15);
}

/* Thẻ chọn "Loại tài sản số" khi được chọn (trang Nộp hồ sơ) */
.tds-category-pick-active {
    border-color: var(--tds-navy) !important;
    background-color: var(--tds-cream);
}

/* ===== Trang Nộp hồ sơ — form card theo từng bước ===== */
.tds-breadcrumb {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .8rem;
    color: var(--tds-muted);
    flex-wrap: wrap;
}
.tds-breadcrumb a { color: var(--tds-muted); font-weight: 500; }
.tds-breadcrumb a:hover { color: var(--tds-gold-dark); }
.tds-breadcrumb span { color: var(--tds-navy); font-weight: 600; }
.tds-breadcrumb i { font-size: .6rem; }

.tds-form-card {
    background: #fff;
    border: 1px solid var(--tds-line);
    border-radius: 1.25rem;
    overflow: hidden;
    box-shadow: 0 4px 24px -16px rgba(22, 33, 62, .12);
}
.tds-form-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--tds-line);
    background: var(--tds-cream-soft);
}
.tds-form-card-body { padding: 1.5rem; }
.tds-step-badge {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--tds-navy);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: .9rem;
    flex-shrink: 0;
}
.tds-required-pill {
    background: #fff3da;
    color: #a3730a;
    border: 1px solid rgba(201, 150, 44, .35);
    border-radius: 999px;
    padding: .3rem .75rem;
    font-size: .7rem;
    font-weight: 700;
    white-space: nowrap;
}
.tds-field-label-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .35rem;
}
.tds-field-label-row .form-label {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    color: var(--tds-navy);
}
.tds-char-counter {
    font-size: .7rem;
    color: var(--tds-muted);
    flex-shrink: 0;
}
.tds-char-counter-warn { color: #dc3545; font-weight: 600; }
.tds-input-icon { position: relative; }
.tds-input-icon i {
    position: absolute;
    top: 50%;
    left: .9rem;
    transform: translateY(-50%);
    color: var(--tds-muted);
    font-size: .95rem;
    pointer-events: none;
}
.tds-input-icon .form-control { padding-left: 2.5rem; }

.tds-category-pick-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .35rem;
    padding: 1rem .75rem;
    border: 1px solid var(--tds-line);
    border-radius: .9rem;
    height: 100%;
    transition: border-color .15s ease, background-color .15s ease, transform .15s ease;
}
.tds-category-pick-label:hover { transform: translateY(-2px); border-color: var(--tds-gold); }
.tds-category-pick-icon {
    width: 40px;
    height: 40px;
    border-radius: .65rem;
    background: var(--tds-cream);
    color: var(--tds-gold-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    overflow: hidden;
}
.tds-category-pick-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}
.tds-category-pick-name { font-size: .85rem; font-weight: 700; color: var(--tds-navy); }
.tds-category-pick-sub { font-size: .68rem; color: var(--tds-muted); }

/* ===== Định nghĩa loại tài sản số (admin soạn trong Quản lý loại tài sản số) ===== */

/* Nút (i) ở góc thẻ loại tài sản — chỉ hiện với loại đã có định nghĩa */
.tds-category-pick-label { position: relative; }
.tds-category-info-btn {
    position: absolute;
    top: .35rem;
    right: .35rem;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--tds-muted);
    font-size: .85rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .15s ease, color .15s ease;
}
.tds-category-info-btn:hover,
.tds-category-info-btn:focus-visible {
    background: var(--tds-cream);
    color: var(--tds-gold-dark);
    outline: none;
}

/* Khung định nghĩa hiện ngay dưới lưới chọn loại tài sản */
.tds-category-def {
    border: 1px solid var(--tds-line);
    border-left: 3px solid var(--tds-gold);
    border-radius: .75rem;
    background: var(--tds-cream-soft);
    padding: .75rem .9rem;
    margin-bottom: .75rem;
}
.tds-category-def-head {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .78rem;
    color: var(--tds-muted);
    margin-bottom: .4rem;
}
.tds-category-def-head i { color: var(--tds-gold-dark); }
.tds-category-def-head strong { color: var(--tds-navy); }
.tds-category-def-expand {
    margin-left: auto;
    border: 0;
    background: transparent;
    padding: 0;
    font-size: .76rem;
    font-weight: 600;
    color: var(--tds-gold-dark);
    text-decoration: underline;
}
/* Định nghĩa dài vẫn giữ khung gọn, phần dư cuộn trong khung hoặc mở modal xem đầy đủ */
.tds-category-def-body {
    font-size: .84rem;
    color: var(--tds-ink);
    max-height: 9rem;
    overflow-y: auto;
}

/* Nội dung HTML do CKEditor sinh ra: ghì lại cỡ chữ/khoảng cách cho khớp giao diện site */
.tds-category-def-body > *:last-child,
.tds-category-def-rich > *:last-child { margin-bottom: 0; }
.tds-category-def-body p,
.tds-category-def-rich p { margin-bottom: .5rem; }
.tds-category-def-body ul,
.tds-category-def-body ol,
.tds-category-def-rich ul,
.tds-category-def-rich ol { margin-bottom: .5rem; padding-left: 1.25rem; }
.tds-category-def-body img,
.tds-category-def-rich img { max-width: 100%; height: auto; }
.tds-category-def-body table,
.tds-category-def-rich table { max-width: 100%; }
.tds-category-def-body strong,
.tds-category-def-rich strong { color: var(--tds-navy); }

/* Modal "Xem đầy đủ" định nghĩa — thay giao diện mặc định của Bootstrap bằng tông kem/navy của site */
.tds-def-modal .modal-dialog { max-width: 34rem; }
.tds-def-modal .modal-content {
    position: relative;
    border: 0;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 1.5rem 3.5rem rgba(15, 24, 48, .25);
}
/* Dải vàng mảnh chạy trên đỉnh modal */
.tds-def-modal .modal-content::before {
    content: "";
    flex: 0 0 4px;
    background: linear-gradient(90deg, var(--tds-gold) 0%, var(--tds-gold-dark) 100%);
}
.tds-def-modal-head {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1.05rem 3rem 1rem 1.25rem;
    background: linear-gradient(180deg, var(--tds-cream) 0%, var(--tds-cream-soft) 100%);
    border-bottom: 1px solid var(--tds-line);
}
.tds-def-modal-icon {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: .7rem;
    background: #fff;
    border: 1px solid var(--tds-line);
    color: var(--tds-gold-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    overflow: hidden;
}
.tds-def-modal-icon img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.tds-def-modal-eyebrow {
    display: block;
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--tds-gold-dark);
    margin-bottom: .1rem;
}
.tds-def-modal-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--tds-navy);
}
.tds-def-modal-close {
    position: absolute;
    top: 1rem;
    right: .9rem;
    z-index: 2;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .7);
    color: var(--tds-muted);
    font-size: .75rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color .15s ease, color .15s ease;
}
.tds-def-modal-close:hover,
.tds-def-modal-close:focus-visible {
    background: #fff;
    color: var(--tds-navy);
    outline: none;
}
.tds-def-modal .modal-body {
    padding: 1.15rem 1.25rem;
    font-size: .9rem;
    line-height: 1.7;
    color: var(--tds-ink);
}
/* Gạch đầu dòng trong định nghĩa dùng chấm vàng cho đỡ khô */
.tds-def-modal .modal-body ul { list-style: none; padding-left: 0; }
.tds-def-modal .modal-body ul > li {
    position: relative;
    padding-left: 1.1rem;
    margin-bottom: .35rem;
}
.tds-def-modal .modal-body ul > li::before {
    content: "";
    position: absolute;
    left: .15rem;
    top: .6em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--tds-gold);
}
.tds-def-modal-foot {
    display: flex;
    justify-content: flex-end;
    padding: .8rem 1.25rem;
    border-top: 1px solid var(--tds-line);
    background: var(--tds-cream-soft);
}

.tds-trust-line {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: .76rem;
    color: var(--tds-muted);
    margin-bottom: .4rem;
}
.tds-trust-line i { color: var(--tds-gold-dark); }

/* Dropzone chọn ảnh (trang Nộp hồ sơ) */
.tds-upload-dropzone {
    border: 2px dashed var(--tds-line);
    border-radius: 1rem;
    padding: 2rem 1.5rem;
    text-align: center;
    cursor: pointer;
    background: var(--tds-cream-soft);
    transition: border-color .15s ease, background-color .15s ease;
}
.tds-upload-dropzone:hover,
.tds-upload-dropzone.is-dragover {
    border-color: var(--tds-gold);
    background: var(--tds-cream);
}
.tds-upload-dropzone #uploadPlaceholder i {
    font-size: 2rem;
    color: var(--tds-gold-dark);
    display: block;
    margin-bottom: .5rem;
}
.tds-upload-preview-img {
    max-height: 160px;
    max-width: 100%;
    border-radius: .75rem;
    margin-bottom: .75rem;
    box-shadow: 0 8px 20px -10px rgba(22, 33, 62, .25);
}
.tds-upload-file-info {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    max-width: 100%;
}
.tds-upload-filename {
    font-size: .85rem;
    color: var(--tds-ink);
    font-weight: 600;
    margin-bottom: 0;
    word-break: break-all;
}
.tds-upload-remove-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid rgba(220, 53, 69, .35);
    background: #fff;
    color: #dc3545;
    font-size: .7rem;
    line-height: 1;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.tds-upload-remove-btn:hover {
    background: #dc3545;
    border-color: #dc3545;
    color: #fff;
}

/* Tiêu chí thẩm định & phí (trang Nộp hồ sơ) */
.tds-criteria-row {
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    padding: .75rem .9rem;
    border: 1px solid var(--tds-line);
    border-radius: .75rem;
    margin-bottom: .5rem;
}
.tds-criteria-row-required {
    background: var(--tds-cream-soft);
}
.tds-criteria-row-optional {
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease;
}
.tds-criteria-row-optional:hover {
    border-color: var(--tds-gold);
    background: var(--tds-cream-soft);
}
.tds-criteria-row-optional:has(.criteria-option-input:checked) {
    border-color: var(--tds-gold);
    background: var(--tds-cream);
}
.tds-criteria-check {
    color: var(--tds-gold-dark);
    font-size: 1rem;
    line-height: 1.4;
}
.tds-criteria-price {
    flex-shrink: 0;
    font-weight: 700;
    font-size: .85rem;
    color: var(--tds-navy);
    white-space: nowrap;
}
/* ===== Tư cách người nộp & tài liệu chứng minh (form nộp / sửa / gửi lại hồ sơ) ===== */
.tds-role-pick {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    height: 100%;
    padding: .85rem .9rem;
    border: 1px solid var(--tds-line);
    border-radius: .75rem;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease, transform .15s ease;
}
.tds-role-pick:hover { border-color: var(--tds-gold); background: var(--tds-cream-soft); transform: translateY(-2px); }
.tds-role-pick:has(.tds-role-pick-input:checked) { border-color: var(--tds-gold); background: var(--tds-cream); }
.tds-role-pick-input { margin-top: .2rem; flex-shrink: 0; }
.tds-role-pick-text { display: flex; flex-direction: column; gap: .15rem; flex: 1 1 auto; min-width: 0; }
.tds-role-pick-name { font-size: .88rem; font-weight: 700; color: var(--tds-navy); line-height: 1.3; }
.tds-role-pick-desc { font-size: .75rem; color: var(--tds-muted); line-height: 1.35; }

.tds-role-hint {
    display: flex;
    align-items: flex-start;
    gap: .55rem;
    padding: .7rem .9rem;
    border-radius: .75rem;
    background: var(--tds-cream-soft);
    border: 1px dashed var(--tds-gold);
    font-size: .8rem;
    color: var(--tds-ink);
}
.tds-role-hint i { color: var(--tds-gold-dark); line-height: 1.4; }

.tds-proof-row {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: .7rem .8rem;
    margin-bottom: .5rem;
    border: 1px solid var(--tds-line);
    border-radius: .75rem;
    background: var(--tds-cream-soft);
}
.tds-proof-row-fields { flex-grow: 1; display: flex; flex-direction: column; gap: .5rem; min-width: 0; }
.tds-proof-row-remove { flex-shrink: 0; }

/* Xem trước tệp vừa chọn: ảnh hiện thumbnail, tệp khác hiện icon theo nhóm */
.tds-proof-preview {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: .4rem .5rem;
    border: 1px solid var(--tds-line);
    border-radius: .55rem;
    background: #fff;
}
.tds-proof-thumb {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    object-fit: cover;
    border-radius: .4rem;
    border: 1px solid var(--tds-line);
    background: var(--tds-cream-soft);
}
.tds-proof-fileicon {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .4rem;
    background: var(--tds-cream);
    color: var(--tds-gold-dark);
    font-size: 1.4rem;
}
.tds-proof-preview-body { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.tds-proof-preview-name {
    font-size: .78rem;
    font-weight: 600;
    color: var(--tds-navy);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tds-proof-preview-size { font-size: .72rem; color: var(--tds-muted); }
.tds-proof-preview-warn { font-size: .72rem; color: #b42318; line-height: 1.35; }

.tds-proof-existing-thumb {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    object-fit: cover;
    border-radius: .4rem;
    border: 1px solid var(--tds-line);
}

.tds-proof-existing {
    display: flex;
    align-items: flex-start;
    gap: .7rem;
    padding: .7rem .8rem;
    margin-bottom: .5rem;
    border: 1px solid var(--tds-line);
    border-radius: .75rem;
}
.tds-proof-existing.is-removed { opacity: .5; text-decoration: line-through; }
.tds-proof-existing-icon { color: var(--tds-gold-dark); font-size: 1.1rem; line-height: 1.4; flex-shrink: 0; }
.tds-proof-existing-body { flex-grow: 1; min-width: 0; }
.tds-proof-existing-name {
    display: block;
    font-size: .85rem;
    font-weight: 600;
    color: var(--tds-navy);
    word-break: break-all;
}
.tds-proof-existing-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .2rem;
    font-size: .72rem;
    color: var(--tds-muted);
}
.tds-proof-existing-desc { margin-top: .3rem; font-size: .78rem; color: var(--tds-ink); }
.tds-proof-existing-remove {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    flex-shrink: 0;
    font-size: .75rem;
    color: var(--tds-muted);
    cursor: pointer;
}

.tds-fee-summary {
    border: 1px solid var(--tds-line);
    border-radius: .75rem;
    padding: .9rem 1rem;
    background: var(--tds-cream-soft);
}
.tds-fee-total {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--tds-gold-dark);
}

/* Đếm ký tự trực tiếp trên form nộp hồ sơ */
.tds-char-counter {
    font-size: .75rem;
    color: var(--tds-muted);
    margin-top: .25rem;
}
.tds-char-counter-warn {
    color: #dc3545;
    font-weight: 600;
}

a { color: var(--tds-navy); }
a:hover { color: var(--tds-gold-dark); }

.tds-eyebrow {
    display: inline-block;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--tds-gold-dark);
    margin-bottom: .5rem;
}

.tds-eyebrow.on-dark { color: var(--tds-gold); }

.btn-gold {
    background-color: var(--tds-gold);
    border-color: var(--tds-gold);
    color: #fff;
    font-weight: 600;
}
.btn-gold:hover, .btn-gold:focus {
    background-color: var(--tds-gold-dark);
    border-color: var(--tds-gold-dark);
    color: #fff;
}

.btn-navy {
    background-color: var(--tds-navy);
    border-color: var(--tds-navy);
    color: #fff;
    font-weight: 600;
}
.btn-navy:hover, .btn-navy:focus {
    background-color: var(--tds-navy-deep);
    border-color: var(--tds-navy-deep);
    color: #fff;
}

.btn-outline-navy {
    border-color: var(--tds-navy);
    color: var(--tds-navy);
    font-weight: 600;
}
.btn-outline-navy:hover, .btn-outline-navy:focus {
    background-color: var(--tds-navy);
    border-color: var(--tds-navy);
    color: #fff;
}

/* ===== Header ===== */
.tds-header {
    background-color: var(--tds-cream-soft);
    border-bottom: 1px solid var(--tds-line);
}
.tds-header .navbar-brand {
    color: var(--tds-navy);
    font-weight: 800;
    letter-spacing: -.01em;
}
.tds-header .navbar-brand .brand-accent { color: var(--tds-gold-dark); }
.tds-logo-mark {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: var(--tds-navy);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.tds-header .nav-link {
    color: var(--tds-ink);
    font-weight: 600;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.tds-header .nav-link:hover { color: var(--tds-navy); }
/* Bootstrap đặt box-shadow xanh cho .nav-link:focus-visible. Dropdown chuông/user ở header mở
   bằng hover nên Bootstrap tự gọi focus() vào toggle -> hiện viền xanh dù chỉ rê chuột qua. */
.tds-header .nav-item.dropdown > .nav-link:focus,
.tds-header .nav-item.dropdown > .nav-link:focus-visible {
    box-shadow: none;
    outline: 0;
}
.tds-header .dropdown-menu { border: 1px solid var(--tds-line); box-shadow: 0 12px 32px -16px rgba(22, 33, 62, .25); }
.tds-header .dropdown-item { color: var(--tds-ink); font-size: .9rem; }
.tds-header .dropdown-item:hover,
.tds-header .dropdown-item:focus,
.tds-header .dropdown-item:active {
    background-color: var(--tds-cream);
    color: var(--tds-navy);
}

/* Chuông thông báo */
.tds-notif-badge {
    position: absolute;
    top: 0;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 999px;
    background: #dc3545;
    color: #fff;
    font-size: .65rem;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}
.tds-notif-panel {
    width: 360px;
    max-width: 92vw;
    padding: 0;
    overflow: hidden;
}
.tds-notif-panel-title {
    padding: .85rem 1.1rem;
    font-weight: 700;
    color: var(--tds-navy);
    border-bottom: 1px solid var(--tds-line);
}
.tds-notif-list {
    max-height: 380px;
    overflow-y: auto;
}
.tds-notif-empty {
    padding: 2rem 1rem;
    text-align: center;
    color: var(--tds-muted);
    font-size: .85rem;
}
.tds-notif-item {
    display: flex;
    gap: .7rem;
    align-items: flex-start;
    padding: .85rem 1.1rem;
    border-bottom: 1px solid var(--tds-line);
    text-decoration: none;
    color: var(--tds-ink);
    transition: background-color .15s ease;
}
.tds-notif-item:last-child { border-bottom: none; }
.tds-notif-item:hover { background-color: var(--tds-cream); color: var(--tds-ink); }
.tds-notif-item.is-unread { background-color: rgba(201, 150, 44, .08); }
.tds-notif-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--tds-navy);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: .9rem;
}
.tds-notif-item.is-unread .tds-notif-icon { background: var(--tds-gold-dark); }
.tds-notif-body { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.tds-notif-title { font-weight: 700; font-size: .85rem; color: var(--tds-navy); }
.tds-notif-item.is-unread .tds-notif-title { font-weight: 800; }
.tds-notif-message { font-size: .8rem; color: var(--tds-muted); line-height: 1.4; }
.tds-notif-time { font-size: .7rem; color: var(--tds-muted); opacity: .75; margin-top: .1rem; }

/* Menu mobile dạng drawer (offcanvas trượt từ trái sang) — chỉ có hiệu lực dưới breakpoint lg,
   từ lg trở lên Bootstrap tự đưa offcanvas về lại thanh nav ngang bình thường (không được đụng
   tới CSS dropdown/nav ở desktop nên toàn bộ tinh chỉnh dưới đây phải giới hạn trong @media <lg). */
.tds-mobile-drawer { background: #fff; }
@media (max-width: 991.98px) {
    .tds-mobile-drawer { width: 300px; max-width: 85vw; }
    .tds-mobile-drawer .offcanvas-header {
        border-bottom: 1px solid var(--tds-line);
        padding: 1.1rem 1.25rem;
    }
    .tds-mobile-drawer .navbar-nav .nav-item { border-bottom: 1px solid var(--tds-line); }
    .tds-mobile-drawer .navbar-nav .nav-link { padding: .85rem .25rem; }
    .tds-mobile-drawer .navbar-nav.align-items-lg-center { margin-top: 1.25rem; gap: .6rem; }
    .tds-mobile-drawer .navbar-nav.align-items-lg-center .nav-item { border-bottom: none; }
    .tds-mobile-drawer .btn { width: 100%; }
    .tds-mobile-drawer .dropdown-menu { position: static !important; inset: auto !important; transform: none !important; border: none; box-shadow: none; padding-left: .5rem; }
}

/* ===== Hero ===== */
.tds-hero {
    background: linear-gradient(180deg, var(--tds-cream) 0%, var(--tds-cream-soft) 100%);
    position: relative;
    overflow: hidden;
    padding: 4.5rem 0 5rem;
}
.tds-hero h1 {
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--tds-navy);
    line-height: 1.15;
}
.tds-hero-check {
    font-size: .875rem;
    color: var(--tds-ink);
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}
.tds-hero-check i { color: var(--tds-gold-dark); }

/* Certificate preview card */
.tds-cert-label {
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--tds-gold-dark);
}
.tds-cert-field-label {
    font-size: .7rem;
    color: var(--tds-muted);
    margin-bottom: .1rem;
}
.tds-cert-field-value {
    font-weight: 700;
    color: var(--tds-navy);
    font-size: .95rem;
}
.tds-verified-badge {
    font-size: .8rem;
    font-weight: 700;
    color: #1a7f4f;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}

/* ===== "Thẩm định số là gì" — ảnh mẫu chứng nhận ===== */
.tds-explainer-visual {
    position: relative;
}
.tds-explainer-img {
    border-radius: 1.5rem;
    box-shadow: 0 24px 48px -20px rgba(22, 33, 62, .3);
    width: 100%;
    height: auto;
}
.tds-link-arrow {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-weight: 700;
    color: var(--tds-gold-dark);
    text-decoration: none;
}
.tds-link-arrow i { transition: transform .18s ease; }
.tds-link-arrow:hover {
    color: var(--tds-gold-dark);
    text-decoration: underline;
}
.tds-link-arrow:hover i { transform: translateX(4px); }

/* ===== Điểm nổi bật (strip 4 cột dưới Hero) ===== */
.tds-highlights {
    background: #fff;
    border-bottom: 1px solid var(--tds-line);
    padding: 2.5rem 0;
}
.tds-highlight-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: .35rem;
    padding: 0 1rem;
    height: 100%;
    position: relative;
}
@media (min-width: 992px) {
    .col-lg-3 + .col-lg-3 .tds-highlight-item::before {
        content: "";
        position: absolute;
        left: 0;
        top: 4px;
        bottom: 4px;
        border-left: 1px solid var(--tds-line);
    }
}
.tds-highlight-icon {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    color: var(--tds-gold-dark);
    margin-bottom: .25rem;
}
.tds-highlight-item h3 {
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--tds-navy);
    margin-bottom: 0;
}
.tds-highlight-item p {
    font-size: .8rem;
    color: var(--tds-muted);
    margin-bottom: 0;
}

/* ===== Section chung ===== */
.tds-section { padding: 5rem 0; }
.tds-section-title {
    font-weight: 800;
    color: var(--tds-navy);
    letter-spacing: -.01em;
}
.tds-section-cream { background-color: var(--tds-cream); }

/* Quy trình 4 bước */
.tds-step-card {
    background: #fff;
    border: 1px solid var(--tds-line);
    border-radius: 1rem;
    padding: 1.75rem 1.5rem;
    height: 100%;
    transition: transform .18s ease, box-shadow .18s ease;
}
.tds-step-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px -18px rgba(22, 33, 62, .25);
}
.tds-step-number {
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--tds-gold-dark);
    margin-bottom: .6rem;
}
.tds-step-card h3 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--tds-navy);
}
.tds-step-card p {
    font-size: .875rem;
    color: var(--tds-muted);
    margin-bottom: 0;
}

/* Loại tài sản số */
.tds-asset-card {
    background: #fff;
    border: 1px solid var(--tds-line);
    border-radius: 1rem;
    padding: 1.5rem 1rem;
    text-align: center;
    height: 100%;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.tds-asset-card:hover {
    transform: translateY(-3px);
    border-color: var(--tds-gold);
    box-shadow: 0 14px 28px -18px rgba(22, 33, 62, .25);
}
.tds-asset-icon {
    width: 48px;
    height: 48px;
    border-radius: .75rem;
    background: var(--tds-cream);
    color: var(--tds-navy);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    margin: 0 auto .75rem;
}
.tds-asset-card span {
    font-size: .875rem;
    font-weight: 600;
    color: var(--tds-ink);
}

/* Loại tài sản số — dải trượt tự động (trang chủ, khi có hơn 6 loại).
   Thuần CSS, không cần JS. Track chứa 2 bản danh sách giống nhau nên chạy tới
   translateX(-50%) là vừa đúng một vòng và điểm nối không nhìn thấy. */
.tds-asset-marquee {
    position: relative;
    overflow: hidden;
    /* chừa chỗ cho hiệu ứng nhấc thẻ + đổ bóng khi hover, tránh bị overflow cắt mất */
    padding: 6px 0 24px;
    /* mờ dần hai bên để thẻ trôi vào/ra mềm mại thay vì bị cắt ngang */
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}
.tds-asset-marquee-track {
    display: flex;
    width: max-content;
    animation: tds-asset-marquee var(--tds-marquee-duration, 40s) linear infinite;
}
/* Dừng khi trỏ chuột vào hoặc khi focus bằng bàn phím để người dùng đọc kịp */
.tds-asset-marquee:hover .tds-asset-marquee-track,
.tds-asset-marquee:focus-within .tds-asset-marquee-track {
    animation-play-state: paused;
}
/* Khoảng cách đặt bằng margin-right chứ không dùng gap: nhờ vậy mỗi thẻ chiếm đúng
   width + margin, và mốc -50% trùng khít một bản danh sách (dùng gap sẽ lệch nửa
   khoảng cách và thấy giật ở điểm nối). */
.tds-asset-marquee-item {
    flex: 0 0 auto;
    width: 184px;
    margin-right: 1.5rem;
}
@keyframes tds-asset-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
@media (max-width: 575.98px) {
    .tds-asset-marquee-item {
        width: 148px;
        margin-right: 1rem;
    }
}
/* Người dùng tắt hiệu ứng chuyển động trong hệ điều hành: không tự trượt nữa,
   cho cuộn ngang bằng tay và bỏ bản sao để không thấy danh sách lặp hai lần. */
@media (prefers-reduced-motion: reduce) {
    .tds-asset-marquee {
        overflow-x: auto;
        -webkit-mask-image: none;
        mask-image: none;
    }
    .tds-asset-marquee-track {
        animation: none;
    }
    .tds-asset-marquee-item[aria-hidden="true"] {
        display: none;
    }
}

/* Hội đồng thẩm định — dark section */
.tds-council {
    background: radial-gradient(ellipse 1400px 900px at 50% 0%, #2E4A8A 0%, #203863 35%, var(--tds-navy) 65%, var(--tds-navy-deep) 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}
.tds-council::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(600px circle at 88% 5%, rgba(201, 150, 44, .25), transparent 60%),
        radial-gradient(520px circle at 8% 95%, rgba(201, 150, 44, .16), transparent 60%);
    pointer-events: none;
}
.tds-council > * { position: relative; z-index: 1; }
.tds-council-card {
    background: var(--tds-navy-soft);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 1rem;
    padding: 1.5rem;
    height: 100%;
    transition: transform .25s ease, border-color .25s ease, background-color .25s ease, box-shadow .25s ease;
}
.tds-council-card:hover {
    transform: translateY(-6px);
    background: #253b6e;
    border-color: rgba(201, 150, 44, .55);
    box-shadow: 0 16px 32px -12px rgba(0, 0, 0, .5), 0 0 28px -6px rgba(201, 150, 44, .35);
}
.tds-council-card h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--tds-gold);
    margin-bottom: .4rem;
}
.tds-council-card p {
    font-size: .85rem;
    color: rgba(255,255,255,.72);
    margin-bottom: 0;
}
.tds-council .tds-section-title { color: #fff; }
.tds-council p.lead-muted { color: rgba(255,255,255,.7); }

/* Số liệu nổi bật */
.tds-stat-number {
    font-size: 2.25rem;
    font-weight: 800;
    color: var(--tds-navy);
    letter-spacing: -.01em;
    line-height: 1.1;
}
.tds-stat-label {
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--tds-muted);
    margin-top: .35rem;
}

/* Dải ảnh dưới khối số liệu — admin thêm ở Admin > Banner, vị trí "Dưới bộ đếm trang chủ".
   Xếp dọc từ trên xuống, mỗi ảnh một hàng. */
.tds-stats-images {
    margin-top: 2.75rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}
.tds-stats-image {
    margin: 0;
    width: 100%;
    text-align: center;
}
.tds-stats-image img {
    max-width: 100%;
    height: auto;
    border-radius: 1rem;
    border: 1px solid var(--tds-line);
    box-shadow: 0 1.25rem 2.5rem -1.5rem rgba(22, 33, 62, .35);
}
@media (max-width: 575.98px) {
    .tds-stats-images { margin-top: 1.75rem; gap: 1rem; }
    .tds-stats-image img { border-radius: .75rem; }
}

.tds-lookup-card {
    background: #fff;
    border: 1px solid var(--tds-line);
    border-radius: 1.25rem;
    padding: 2rem;
    box-shadow: 0 20px 40px -24px rgba(22, 33, 62, .2);
    height: 100%;
}
.tds-lookup-card input.form-control {
    border-radius: .65rem;
    padding: .7rem 1rem;
}

.tds-view-field + .tds-view-field {
    margin-top: 1.1rem;
}
.tds-view-field-label {
    display: block;
    font-size: .85rem;
    font-weight: 700;
    color: var(--tds-navy);
    margin-bottom: .35rem;
}
.tds-view-field-value {
    font-size: .9rem;
    color: var(--tds-ink);
    white-space: pre-line;
}

/* ===== Chi tiết hồ sơ: banner trạng thái + stepper quy trình ===== */
.tds-process-banner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.5rem 1.5rem 1.25rem;
}
.tds-process-banner-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}
.tds-process-meta {
    display: flex;
    gap: 2.5rem;
    flex-wrap: wrap;
}
.tds-process-meta-label {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--tds-muted);
    margin-bottom: .2rem;
}
.tds-process-meta-value {
    font-weight: 700;
    color: var(--tds-navy);
    font-size: .95rem;
}
.tds-stepper {
    display: flex;
    align-items: flex-start;
    padding: 1rem 1.5rem 1.5rem;
    border-top: 1px solid var(--tds-line);
}
.tds-stepper-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
}
.tds-stepper-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: .95rem;
    margin-bottom: .5rem;
    background: #fff;
    border: 2px solid var(--tds-line);
    color: var(--tds-muted);
}
.tds-stepper-item.is-reached .tds-stepper-circle {
    background: var(--tds-gold);
    border-color: var(--tds-gold);
    color: #fff;
}
.tds-stepper-item.is-error .tds-stepper-circle {
    background: #C0392B;
    border-color: #C0392B;
    color: #fff;
}
.tds-stepper-line {
    position: absolute;
    top: 20px;
    left: calc(-50% + 20px);
    width: calc(100% - 40px);
    height: 2px;
    background: var(--tds-line);
    z-index: 0;
}
.tds-stepper-item:first-child .tds-stepper-line { display: none; }
.tds-stepper-line.is-reached { background: var(--tds-gold); }
.tds-stepper-name { font-size: .78rem; font-weight: 700; color: var(--tds-navy); }
.tds-stepper-sub { font-size: .72rem; color: var(--tds-muted); margin-top: .1rem; }
.tds-stepper-sub.is-active { color: var(--tds-gold-dark); font-weight: 600; }

/* ===== File minh chứng dạng lưới ===== */
.tds-file-card {
    border: 1px solid var(--tds-line);
    border-radius: .75rem;
    padding: .75rem;
    display: flex;
    align-items: center;
    gap: .65rem;
    height: 100%;
}
.tds-file-card-thumb {
    width: 42px;
    height: 42px;
    border-radius: .5rem;
    object-fit: cover;
    flex-shrink: 0;
}
.tds-file-card-icon {
    width: 42px;
    height: 42px;
    border-radius: .5rem;
    background: var(--tds-cream-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}
.tds-file-card-name {
    font-size: .82rem;
    font-weight: 600;
    color: var(--tds-ink);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.tds-file-card-size { font-size: .72rem; color: var(--tds-muted); }
.tds-file-card-link { font-size: .72rem; }

/* ===== Lịch sử xử lý dạng timeline ===== */
.tds-timeline { position: relative; padding-left: 1.4rem; }
.tds-timeline-item { position: relative; padding-bottom: 1.25rem; }
.tds-timeline-item:last-child { padding-bottom: 0; }
.tds-timeline-item::before {
    content: '';
    position: absolute;
    left: -1.4rem;
    top: 4px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--tds-gold);
}
.tds-timeline-item::after {
    content: '';
    position: absolute;
    left: calc(-1.4rem + 4px);
    top: 16px;
    bottom: -4px;
    width: 2px;
    background: var(--tds-line);
}
.tds-timeline-item:last-child::after { display: none; }
.tds-timeline-item.is-pending::before { background: #fff; border: 2px solid var(--tds-line); }
.tds-timeline-title { font-size: .85rem; font-weight: 700; color: var(--tds-navy); }
.tds-timeline-date { font-size: .72rem; color: var(--tds-muted); }
.tds-timeline-note { font-size: .78rem; color: var(--tds-muted); margin-top: .15rem; }

@media print {
    .tds-header, .tds-footer, .no-print { display: none !important; }
    body { background: #fff !important; }
}

/* ===== Footer ===== */
.tds-footer {
    background: var(--tds-navy-deep);
    color: rgba(255,255,255,.65);
    position: relative;
    overflow: hidden;
}
.tds-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(420px circle at 4% 15%, rgba(201, 150, 44, .14), transparent 60%),
        radial-gradient(420px circle at 96% 15%, rgba(201, 150, 44, .14), transparent 60%),
        repeating-linear-gradient(45deg, rgba(255,255,255,.045) 0px, rgba(255,255,255,.045) 1px, transparent 1px, transparent 42px),
        repeating-linear-gradient(-45deg, rgba(255,255,255,.035) 0px, rgba(255,255,255,.035) 1px, transparent 1px, transparent 42px);
    pointer-events: none;
}
.tds-footer > * { position: relative; z-index: 1; }
.tds-footer h6 {
    color: #fff;
    font-weight: 700;
    font-size: .85rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}
.tds-footer a {
    color: rgba(255,255,255,.65);
    text-decoration: none;
    font-size: .9rem;
}
.tds-footer a:hover { color: var(--tds-gold); }
.tds-footer .brand { color: #fff; font-weight: 800; }
.tds-footer .brand .brand-accent { color: var(--tds-gold); }
.tds-footer-bottom {
    border-top: 1px solid rgba(255,255,255,.08);
    font-size: .8rem;
}

/* ===== Trang xác thực (đăng nhập/đăng ký/quên mật khẩu...) — HideHeader=true nhưng vẫn dùng chung _Layout ===== */
.tds-auth-wrap {
    position: relative;
    overflow: hidden;
    min-height: 100vh;
    background: url('/images/auth-bg.png') center center / cover no-repeat fixed, var(--tds-navy-deep);
}
@media (max-width: 767px) {
    /* background-attachment: fixed gây giật/lỗi cuộn trên nhiều trình duyệt mobile — chỉ dùng fixed ở desktop */
    .tds-auth-wrap { background-attachment: scroll; }
}
.tds-auth-wrap > * { position: relative; z-index: 1; }
.tds-auth-card {
    background: #fff;
    border: 1px solid var(--tds-line);
    border-radius: 1.25rem;
    box-shadow: 0 24px 48px -20px rgba(22, 33, 62, .18);
}
.tds-auth-brand {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-weight: 800;
    font-size: 1.2rem;
    color: var(--tds-navy);
    letter-spacing: -.01em;
}
.tds-auth-brand .brand-accent { color: var(--tds-gold-dark); }
.tds-auth-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--tds-cream);
    color: var(--tds-gold-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}
.tds-auth-wrap a { color: var(--tds-navy); font-weight: 600; }
.tds-auth-wrap a:hover { color: var(--tds-gold-dark); }
.tds-auth-wrap .btn-link { color: var(--tds-navy); text-decoration: none; }

/* ===== Trang chờ thanh toán (VietQR) ===== */
.tds-pay-status-pill {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    background: #fff8e1;
    color: #a3730a;
    border: 1px solid rgba(201, 150, 44, .35);
    border-radius: 999px;
    padding: .35rem .9rem;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.tds-pay-card {
    background: #fff;
    border-radius: 1.25rem;
    overflow: hidden;
    box-shadow: 0 20px 48px -24px rgba(22, 33, 62, .3);
    border: 1px solid var(--tds-line);
}
.tds-pay-card-header {
    background: linear-gradient(135deg, var(--tds-navy) 0%, var(--tds-navy-deep) 100%);
    color: #fff;
    padding: .9rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    font-size: .85rem;
    font-weight: 600;
    flex-wrap: wrap;
}
.tds-pay-card-header i.bi-shield-check { color: var(--tds-gold); margin-right: .35rem; }
.tds-pay-live-dot {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: #7CE0A8;
    font-weight: 600;
    font-size: .8rem;
}
.tds-pay-live-dot i { font-size: .5rem; animation: tds-pay-blink 1.6s ease-in-out infinite; }
@keyframes tds-pay-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: .25; }
}
.tds-pay-qr-wrap {
    border: 1px dashed var(--tds-line);
    border-radius: 1rem;
    padding: 1rem;
    background: var(--tds-cream-soft);
    display: inline-block;
    margin-bottom: .75rem;
}
.tds-pay-qr-wrap img { max-width: 100%; border-radius: .5rem; }
.tds-pay-row {
    padding-bottom: .85rem;
    margin-bottom: .85rem;
    border-bottom: 1px dashed var(--tds-line);
}
.tds-pay-label {
    font-size: .75rem;
    color: var(--tds-muted);
    margin-bottom: .2rem;
}
.tds-pay-value {
    font-weight: 700;
    color: var(--tds-navy);
    font-size: .95rem;
}
.tds-pay-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    background: var(--tds-cream);
    color: var(--tds-gold-dark);
    border-radius: .5rem;
    padding: .2rem .55rem;
    font-size: .72rem;
    font-weight: 700;
    white-space: nowrap;
}
.tds-pay-amount {
    font-weight: 800;
    font-size: 1.75rem;
    color: var(--tds-navy);
}
.tds-pay-code-box {
    background: var(--tds-cream-soft);
    border: 1px solid var(--tds-line);
    border-radius: .6rem;
    padding: .5rem .9rem;
    font-weight: 700;
    letter-spacing: .05em;
    color: var(--tds-navy);
    flex: 1;
}
.tds-pay-copy-btn {
    width: 36px;
    height: 36px;
    border-radius: .6rem;
    border: 1px solid var(--tds-line);
    background: #fff;
    color: var(--tds-navy);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background-color .15s ease, color .15s ease;
}
.tds-pay-copy-btn:hover { background: var(--tds-cream); }
.tds-pay-copy-btn-dark {
    width: auto;
    height: 40px;
    padding: 0 .9rem;
    gap: .35rem;
    background: var(--tds-navy);
    color: #fff;
    border-color: var(--tds-navy);
    font-weight: 600;
    font-size: .85rem;
}
.tds-pay-copy-btn-dark:hover { background: var(--tds-navy-deep); }
.tds-pay-footer {
    background: #fff;
    border-top: 1px solid var(--tds-line);
    padding: 1.25rem 1.5rem 1.5rem;
    border-radius: 0 0 1.25rem 1.25rem;
}
.tds-pay-warning {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    background: #fff8e1;
    border-left: 4px solid var(--tds-gold);
    border-radius: 0 .75rem .75rem 0;
    padding: .9rem 1.1rem;
    font-size: .88rem;
    color: #6b4f00;
}
.tds-pay-warning i { color: var(--tds-gold-dark); margin-top: .15rem; }
.tds-pay-listening {
    padding-top: 1rem;
    margin-top: 1rem;
    border-top: 1px solid var(--tds-line);
}
.tds-auth-wrap .btn-link:hover { color: var(--tds-gold-dark); }

/* ===== Hồ sơ của tôi — danh sách dạng card ===== */
.tds-dossier-list {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}
.tds-dossier-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #fff;
    border: 1px solid var(--tds-line);
    border-radius: 1rem;
    padding: 1rem 1.25rem;
    text-decoration: none;
    color: inherit;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.tds-dossier-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 32px -20px rgba(22, 33, 62, .3);
    border-color: var(--tds-gold);
    color: inherit;
}
.tds-dossier-icon {
    width: 48px;
    height: 48px;
    border-radius: .85rem;
    background: var(--tds-cream);
    color: var(--tds-gold-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}
.tds-dossier-main { flex: 1; min-width: 0; }
.tds-dossier-name {
    font-weight: 700;
    color: var(--tds-navy);
    font-size: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tds-dossier-meta {
    font-size: .8rem;
    color: var(--tds-muted);
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}
.tds-dot-sep {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--tds-muted);
    flex-shrink: 0;
}
.tds-dossier-status {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: .3rem;
    flex-shrink: 0;
}
.tds-status-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .72rem;
    font-weight: 700;
    padding: .3rem .65rem;
    border-radius: 999px;
    white-space: nowrap;
}
.tds-status-muted { background: #EEF0F3; color: #5A6270; }
.tds-status-amber { background: #FFF3DA; color: #A3730A; }
.tds-status-blue { background: #E3F0FF; color: #1660B8; }
.tds-status-navy { background: #E6E9F2; color: var(--tds-navy); }
.tds-status-red { background: #FDE6E6; color: #C0392B; }
.tds-status-green { background: #E3F7EA; color: #1A7F4F; }
.tds-dossier-arrow {
    color: var(--tds-muted);
    font-size: 1.1rem;
    flex-shrink: 0;
    transition: transform .15s ease, color .15s ease;
}
.tds-dossier-item:hover .tds-dossier-arrow { transform: translateX(4px); color: var(--tds-gold-dark); }
.tds-dossier-empty {
    background: #fff;
    border: 1px dashed var(--tds-line);
    border-radius: 1.25rem;
    padding: 3rem 1.5rem;
}
.tds-dossier-empty i { font-size: 2.5rem; color: var(--tds-muted); display: block; margin-bottom: .75rem; }
@media (max-width: 575px) {
    .tds-dossier-item { flex-wrap: wrap; }
    .tds-dossier-status { align-items: flex-start; order: 3; flex-direction: row; }
    .tds-dossier-arrow { display: none; }
}

/* ===== Hồ sơ của tôi — bộ lọc + card chi tiết hơn ===== */
.tds-search-box { position: relative; min-width: 220px; }
.tds-search-box i {
    position: absolute;
    left: .8rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--tds-muted);
    font-size: .85rem;
}
.tds-search-box .form-control { padding-left: 2.1rem; border-radius: .65rem; }
@media (max-width: 575px) {
    .tds-filter-tabs-row { flex-wrap: wrap; }
    .tds-search-box { min-width: 100%; }
}

.tds-dossier-card-v2 {
    background: #fff;
    border: 1px solid var(--tds-line);
    border-radius: 1rem;
    padding: 1.25rem;
    margin-bottom: .9rem;
}
.tds-dossier-info-banner {
    background: var(--tds-cream-soft);
    border: 1px solid rgba(201, 150, 44, .3);
    color: var(--tds-ink);
    border-radius: .65rem;
    padding: .6rem .9rem;
    font-size: .82rem;
    display: flex;
    align-items: flex-start;
    gap: .5rem;
}
.tds-dossier-info-banner i { color: var(--tds-gold-dark); margin-top: .15rem; }
.tds-dossier-info-banner.is-danger { background: #FDE6E6; border-color: rgba(192, 57, 43, .3); }
.tds-dossier-info-banner.is-danger i { color: #C0392B; }

/* ===== Popup Điều khoản / Quy chế (partial _PolicyModal) ===== */
.tds-policy-modal .modal-content {
    border: none;
    border-radius: 1.25rem;
    overflow: hidden;
    box-shadow: 0 32px 70px -32px rgba(15, 24, 48, .55);
}
.tds-policy-modal .modal-header {
    align-items: center;
    gap: .9rem;
    padding: 1.1rem 1.4rem;
    border-bottom: 1px solid var(--tds-line);
    background: linear-gradient(135deg, var(--tds-cream) 0%, var(--tds-cream-soft) 100%);
}
.tds-policy-modal-icon {
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border-radius: .85rem;
    background: var(--tds-navy);
    color: var(--tds-gold);
    font-size: 1.15rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.tds-policy-modal-heading { flex: 1 1 auto; min-width: 0; }
.tds-policy-modal .modal-title {
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--tds-navy);
}
.tds-policy-modal-sub {
    margin: .1rem 0 0;
    font-size: .76rem;
    color: var(--tds-muted);
}
.tds-policy-modal .btn-close {
    margin: 0;
    padding: .4rem;
    flex-shrink: 0;
    opacity: .45;
}
.tds-policy-modal .btn-close:hover { opacity: .9; }
.tds-policy-modal .modal-body { padding: 1.35rem 1.5rem; }
.tds-policy-modal .modal-body::-webkit-scrollbar { width: 8px; }
.tds-policy-modal .modal-body::-webkit-scrollbar-thumb {
    background: rgba(22, 33, 62, .18);
    border-radius: 8px;
}
.tds-policy-modal .modal-body::-webkit-scrollbar-thumb:hover { background: rgba(22, 33, 62, .32); }
.tds-policy-modal .modal-footer {
    padding: .85rem 1.4rem;
    border-top: 1px solid var(--tds-line);
    background: var(--tds-cream-soft);
}
.tds-policy-modal .modal-footer .btn { border-radius: .7rem; }

/* Nội dung HTML do admin soạn bằng CKEditor — chuẩn hóa typography để popup không vỡ cỡ chữ */
.tds-policy-doc { font-size: .9rem; color: var(--tds-ink); }
.tds-policy-doc > *:first-child { margin-top: 0; }
.tds-policy-doc > *:last-child { margin-bottom: 0; }
.tds-policy-doc p {
    margin: 0 0 .8rem;
    line-height: 1.8;
    color: var(--tds-muted);
}
.tds-policy-doc > p:first-child {
    padding: .85rem 1rem;
    margin-bottom: 1.35rem;
    border-left: 3px solid var(--tds-gold);
    border-radius: 0 .6rem .6rem 0;
    background: var(--tds-cream-soft);
    color: var(--tds-ink);
    font-size: .88rem;
    line-height: 1.7;
}
.tds-policy-doc h1,
.tds-policy-doc h2,
.tds-policy-doc h3,
.tds-policy-doc h4,
.tds-policy-doc h5,
.tds-policy-doc h6 {
    position: relative;
    margin: 1.5rem 0 .55rem;
    padding-left: .8rem;
    font-weight: 700;
    line-height: 1.45;
    color: var(--tds-navy);
}
.tds-policy-doc h1 { font-size: 1.05rem; }
.tds-policy-doc h2 { font-size: 1rem; }
.tds-policy-doc h3 { font-size: .96rem; }
.tds-policy-doc h4,
.tds-policy-doc h5,
.tds-policy-doc h6 { font-size: .92rem; }
.tds-policy-doc h1::before,
.tds-policy-doc h2::before,
.tds-policy-doc h3::before,
.tds-policy-doc h4::before,
.tds-policy-doc h5::before,
.tds-policy-doc h6::before {
    content: "";
    position: absolute;
    left: 0;
    top: .25em;
    bottom: .25em;
    width: 3px;
    border-radius: 2px;
    background: var(--tds-gold);
}
.tds-policy-doc ul,
.tds-policy-doc ol {
    margin: 0 0 .8rem;
    padding-left: 1.35rem;
    color: var(--tds-muted);
}
.tds-policy-doc ul { list-style-type: disc; }
.tds-policy-doc ol { list-style-type: decimal; }
.tds-policy-doc li { margin-bottom: .3rem; line-height: 1.8; }
.tds-policy-doc strong, .tds-policy-doc b { font-weight: 600; color: var(--tds-navy); }
.tds-policy-doc a { color: var(--tds-gold-dark); }
.tds-policy-doc img { max-width: 100%; height: auto; border-radius: .75rem; margin: .75rem 0; }
.tds-policy-doc hr { margin: 1.25rem 0; border-color: var(--tds-line); opacity: 1; }
.tds-policy-doc blockquote {
    margin: .9rem 0;
    padding: .85rem 1.1rem;
    border-left: 3px solid var(--tds-gold);
    border-radius: 0 .6rem .6rem 0;
    background: var(--tds-cream);
    color: var(--tds-ink);
}
.tds-policy-doc table {
    width: 100%;
    margin-bottom: .9rem;
    border-collapse: collapse;
    font-size: .85rem;
}
.tds-policy-doc th,
.tds-policy-doc td {
    border: 1px solid var(--tds-line);
    padding: .5rem .7rem;
    text-align: left;
}
.tds-policy-doc th { background: var(--tds-cream); font-weight: 600; color: var(--tds-navy); }

.tds-policy-empty {
    padding: 2.5rem 1rem;
    text-align: center;
    color: var(--tds-muted);
}
.tds-policy-empty i { font-size: 2rem; display: block; margin-bottom: .6rem; opacity: .5; }
.tds-policy-empty p { margin: 0; font-size: .9rem; }

@media (max-width: 575.98px) {
    .tds-policy-modal .modal-header { padding: 1rem 1.1rem; gap: .7rem; }
    .tds-policy-modal .modal-body { padding: 1.1rem 1.1rem; }
    .tds-policy-modal .modal-footer { padding: .8rem 1.1rem; }
    .tds-policy-modal-icon { width: 36px; height: 36px; font-size: 1rem; }
    .tds-policy-modal .modal-title { font-size: .95rem; }
}