/* Keep existing rows and delegated actions; only change their phone presentation. */
@media (max-width: 600px) {
    :is(#all-stores-table, #revisit-store-table, #audit-report-table) {
        display: block;
        width: 100%;
        min-width: 0;
        table-layout: auto;
    }

    :is(#all-stores-table, #revisit-store-table, #audit-report-table) thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }

    :is(#all-stores-table, #revisit-store-table, #audit-report-table) tbody {
        display: block;
        width: 100%;
    }

    :is(#all-stores-table, #revisit-store-table, #audit-report-table) tbody tr {
        display: block;
        margin-bottom: 12px;
        border: 1px solid var(--border);
        border-radius: 10px;
        background: var(--bg-card);
    }

    :is(#all-stores-table, #revisit-store-table, #audit-report-table) tbody :is(td[data-label], td[colspan]) {
        display: block;
        width: auto;
        min-width: 0;
        max-width: 100%;
        padding: 8px 12px;
        text-align: left;
        white-space: normal;
        overflow-wrap: anywhere;
        box-sizing: border-box;
        font-size: 14px;
    }

    :is(#all-stores-table, #revisit-store-table, #audit-report-table) td[data-label]::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 4px;
        color: var(--text-muted);
        font-size: 12px;
        font-weight: 600;
    }

    :is(#all-stores-table, #revisit-store-table, #audit-report-table) td:last-child {
        border-bottom: 0;
    }

    :is(#all-stores-table, #revisit-store-table, #audit-report-table) .btn {
        min-height: 44px;
        max-width: 100%;
        white-space: normal;
    }

    #audit-report-table .btn-icon,
    #audit-report-table .wp-child-action-btn {
        min-width: 44px;
        min-height: 44px;
    }

    #audit-report-table :is(.audit-action-cell, .audit-approval-cell) {
        min-height: 0;
        justify-content: flex-start;
    }

    #audit-report-table .audit-report-action-group {
        flex-wrap: wrap;
    }

    /* Report rows share the existing actions, but compact metadata into pairs. */
    #audit-report-table tbody tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 6px;
    }

    #audit-report-table tbody td[data-label] {
        min-width: 0;
        width: auto;
        padding: 8px;
        border: 0;
        font-size: 14px;
        line-height: 1.4;
        order: 8;
    }

    #audit-report-table tbody td:is(.audit-col-no, .audit-history-col-no) {
        order: 0;
        color: var(--text-muted);
    }

    #audit-report-table tbody td:is(.audit-col-store-code, .audit-history-col-store-code) {
        order: 1;
        text-align: right;
        font-weight: 600;
    }

    #audit-report-table td:is(.audit-col-no, .audit-history-col-no,
        .audit-col-store-code, .audit-history-col-store-code)::before {
        display: inline;
        margin-right: 6px;
    }

    #audit-report-table tbody td:is(.audit-col-store-name, .audit-history-col-store-name) {
        grid-column: 1 / -1;
        order: 2;
        padding-top: 0;
        font-weight: 600;
    }

    #audit-report-table td:is(.audit-col-store-name, .audit-history-col-store-name)::before {
        display: none;
    }

    #audit-report-table tbody td:is(.audit-col-date, .audit-history-col-date) { order: 3; }
    #audit-report-table tbody td.audit-history-col-status { order: 4; }
    #audit-report-table tbody td.audit-history-col-approved-by { order: 5; grid-column: 1 / -1; }
    #audit-report-table tbody td.audit-col-date { grid-column: 1 / -1; }
    /* Keep actionable Active Report cells in DOM/tab order after Working Paper. */
    #audit-report-table tbody td:is(.audit-col-submit, .audit-col-review) { order: 7; }

    #audit-report-table tbody td:is(.audit-col-wp, .audit-history-col-wp) {
        grid-column: 1 / -1;
        order: 6;
        border-block: 1px solid var(--border);
        margin-block: 4px;
    }

    #audit-report-table tbody td:is(.audit-col-manage, .audit-history-col-manage) { order: 9; }
    #audit-report-table tbody td[colspan] { grid-column: 1 / -1; }

    .audit-report-list-panel > .audit-report-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: start;
        gap: 8px;
        margin-bottom: 14px;
    }

    .audit-report-list-panel > .audit-report-header h2 { font-size: 20px; }
    .audit-report-list-panel > .audit-report-header .audit-report-subtitle {
        font-size: 12px;
        line-height: 1.5;
        margin-top: 4px;
    }

    .audit-report-list-panel .audit-pdf-convert-btn {
        font-size: 12px;
        padding: 8px 10px;
        gap: 6px;
    }

    .audit-report-action { gap: 8px; margin-bottom: 12px; }
    .audit-report-workspace-tabs { box-sizing: border-box; min-width: 0; }
    .audit-report-workspace-tab { min-width: 0; min-height: 44px; padding-inline: 6px; }
    .audit-report-history-filters { min-width: 0; }
    .audit-report-history-filters select { min-width: 0; width: 0; min-height: 44px; }
    .audit-report-search { flex-basis: 100%; width: 100%; max-width: none; min-width: 0; min-height: 44px; }
    .audit-report-search input { width: 100%; min-width: 0; }
    .audit-report-list-footer { gap: 8px; padding: 10px; flex-wrap: wrap; }
}

/* Retain dense tables on tablets while keeping the site identity in view. */
@media (min-width: 601px) and (max-width: 1024px) {
    :is(#all-stores-table, #revisit-store-table, #audit-report-table) :is(th, td):nth-child(2) {
        position: sticky;
        left: 0;
        z-index: 1;
        background: var(--bg-card);
        box-shadow: 1px 0 0 var(--border);
    }
}

.mobile-sort-caption { display: none; }

@media (max-width: 600px) {
    :is(#all-stores-table, #revisit-store-table) .mobile-sort-caption {
        display: block;
        margin-bottom: 6px;
        color: var(--text-muted);
        text-align: left;
        font-size: 12px;
    }

    :is(#all-stores-table, #revisit-store-table) thead {
        position: static;
        display: block;
        width: 100%;
        height: auto;
        margin-bottom: 12px;
        overflow-x: auto;
        clip-path: none;
    }

    :is(#all-stores-table, #revisit-store-table) thead tr {
        display: flex;
        gap: 6px;
    }

    :is(#all-stores-table, #revisit-store-table) th[data-sort-key] {
        display: flex;
        flex: 0 0 auto;
        align-items: center;
        gap: 4px;
        width: auto;
        min-height: 44px;
        padding: 8px 10px;
        border: 1px solid var(--border);
        border-radius: 6px;
    }

    :is(#all-stores-table, #revisit-store-table) th:not([data-sort-key]) {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip-path: inset(50%);
    }
}