@media (max-width: 768px) {
    /* Responsive Table Card Layout */
    table.responsive-table {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        border: none !important;
    }
    table.responsive-table thead {
        display: none !important;
    }
    table.responsive-table tbody {
        display: block !important;
        width: 100% !important;
    }
    table.responsive-table tr {
        display: flex !important;
        flex-direction: column !important;
        margin-bottom: 1rem !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 0.75rem !important;
        padding: 0.5rem !important;
        background: #ffffff !important;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
    }
    .dark table.responsive-table tr {
        border-color: #1e293b !important;
        background: #0f172a !important;
    }
    table.responsive-table td {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        text-align: right !important;
        padding: 0.75rem 0.5rem !important;
        border-bottom: 1px solid #f1f5f9 !important;
        width: 100% !important;
        box-sizing: border-box !important;
        word-break: break-word !important;
        white-space: normal !important;
        gap: 0.5rem !important;
    }
    .dark table.responsive-table td {
        border-bottom-color: #1e293b !important;
    }
    table.responsive-table td:last-child {
        border-bottom: none !important;
    }
    table.responsive-table td::before {
        content: attr(data-label) !important;
        font-weight: 600 !important;
        text-transform: uppercase !important;
        font-size: 0.7rem !important;
        color: #64748b !important;
        text-align: left !important;
        flex-shrink: 0 !important;
        flex-basis: 35% !important;
        max-width: 35% !important;
    }
    .dark table.responsive-table td::before {
        color: #94a3b8 !important;
    }

    /* Đảm bảo nội dung bên trong không bị tràn ra ngoài */
    table.responsive-table td > *:not(::before) {
        max-width: 65% !important;
        word-break: break-word !important;
        white-space: normal !important;
    }

    /* Reset some complex elements inside cells to align right nicely */
    table.responsive-table td > div {
        align-items: flex-end !important;
        text-align: right !important;
        width: 100% !important;
    }
    table.responsive-table td > div.flex-row {
        justify-content: flex-end !important;
    }
}