@media (max-width: 768px) {
    .ht_master .wtHolder {
        overflow-x: auto !important;
    }
}

.ht_master .wtHolder {
    overflow: hidden;
}

.ht_clone_top .htCore thead th {
    font-size: 12px !important;
    font-weight: bold;
}

.ht_clone_top,
.ht_clone_left,
.ht_clone_top_left_corner {
    z-index: 1 !important;
    /* thấp hơn modal */
}

/* =========================
   Policy modal - Dark mode
   ========================= */

.dark .policy-content,
.dark .policy-content p,
.dark .policy-content span,
.dark .policy-content li,
.dark .policy-content div {
    color: #e5e7eb;
    /* gray-200 */
}

.dark .policy-content strong,
.dark .policy-content b {
    color: #f9fafb;
    /* gần trắng */
}

.dark .policy-content h1,
.dark .policy-content h2,
.dark .policy-content h3,
.dark .policy-content h4,
.dark .policy-content h5 {
    color: #ffffff;
}

.dark .policy-content a {
    color: #60a5fa;
    /* blue-400 */
}

.dark .policy-content a:hover {
    color: #93c5fd;
    /* blue-300 */
}

.dark .policy-content ul,
.dark .policy-content ol {
    color: #e5e7eb;
}

#customs-summary .summary-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
}

#customs-summary .summary-label {
    font-weight: 700;
    color: #333;
    flex: 0 0 auto;
    white-space: nowrap;
    /* label không xuống dòng */
}

#customs-summary .summary-value {
    font-weight: 700;
    flex: 1 1 auto;
    /* chiếm phần còn lại */
    min-width: 0;
    /* QUAN TRỌNG để ellipsis hoạt động */
    text-align: right;
    color: #16a34a;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    /* giữ 1 dòng */
    overflow: hidden;
    /* ẩn phần tràn */
    text-overflow: ellipsis;
    /* ... */
}

/* Mobile: giảm nhẹ font nếu cần */
@media (max-width: 480px) {
    #customs-summary {
        font-size: 0.95rem;
    }
}

/* 📱 Responsive Mobile/Tablet - Chỉ thay đổi trên màn hình nhỏ, không ảnh hưởng desktop */
@media (max-width: 767px) {
    body #unit-money-wrapper,
    body #export-is-wrapper,
    body #surcharge-container,
    body #surcharge-wrapper {
        width: 100% !important;
        max-width: 100% !important;
    }

    body #surcharge-container {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    body #weight-summary div,
    body #summary div {
        gap: 8px !important;
    }

    body #weight-summary span,
    body #summary span,
    body #customs-summary span {
        min-width: unset !important;
        /* Xóa min-width cũ để co giãn tốt hơn */
    }

    body #total-charge-weight,
    body #chi-phi,
    body #phu-phi,
    body #thanh-tien {
        min-width: unset !important;
        flex: 1 !important;
        text-align: right !important;
    }
}