/* ===============================
   FORCE MOBILE RESPONSIVE TABLE
================================ */

/* container width fix */
.vd-content-wrapper,
.vd-content-wrapper .container {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

/* table wrapper must scroll */
.vd-table-wrapper {
    width: 100%;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    position: relative;
}

/* hide scrollbar but keep scroll */
.vd-table-wrapper::-webkit-scrollbar {
    display: none;
}

.vd-table-wrapper {
    scrollbar-width: none;
    -ms-overflow-style: none;
}

/* table must be wider than mobile */
.vd-table {
    min-width: 820px;
    /* THIS IS IMPORTANT */
    width: 100%;
    table-layout: auto;
}

/* prevent column breaking */
.vd-table th,
.vd-table td {
    white-space: nowrap;
    word-break: keep-all;
}

/* ===============================
   MOBILE SPECIFIC FIX
================================ */
@media (max-width: 768px) {

    /* remove bootstrap padding */
    .vd-content-wrapper .container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    /* search & sort stacking */
    .vd-controls {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .vd-search-box,
    .vd-search-input,
    .vd-sort,
    .vd-sort-select {
        width: 100%;
    }

    /* pagination wrap */
    .vd-pagination {
        flex-wrap: wrap;
        gap: 10px;
        text-align: center;
    }

    .vd-page-text {
        width: 100%;
        order: -1;
    }
}

@media (max-width: 576px) {
    .vd-title {
        font-size: 20px;
    }

    .vd-subtitle {
        font-size: 13px;
    }

    .vd-sort label {
        width: 250px;
    }
}

@media(max-width:768px) {
    .policy-title {
        font-size: 34px;
    }
}