/*
 * OTS — tables fit the screen on desktop (27/9/2026).
 * Vuexy pads every cell 20–24px per side and many wrappers carry .text-nowrap, so wide
 * tables pushed past the card (and on /invoices past the page). On desktop widths:
 *  - tighter cell padding and a slightly smaller font,
 *  - plain text wraps at spaces, while references, links, badges, dates and amounts stay
 *    on one line (they are links/badges or have no spaces),
 *  - buttons in action cells never wrap,
 *  - last resort: a table that is still too wide scrolls INSIDE its card, never the page.
 * Plain file in public/ on purpose — no Vite build needed to change it.
 */
@media (min-width: 992px) {
    .table > :not(caption) > * > * {
        padding-left: .6rem;
        padding-right: .6rem;
    }
    .table thead th {
        letter-spacing: 0;
        font-size: .75rem;
    }
    .table tbody td {
        font-size: .875rem;
    }
    /* let text wrap even inside a .text-nowrap wrapper — the wrapper keeps its own nowrap */
    .text-nowrap .table th,
    .text-nowrap .table td,
    .table th,
    .table td {
        white-space: normal;
    }
    /* things that must never break across lines */
    .table td a,
    .table td .badge,
    .table td .btn,
    .table td.text-nowrap,
    .table th.text-nowrap,
    .table td .text-nowrap {
        white-space: nowrap;
    }
    /* …except names: a long company name wraps normally */
    .table td a.text-body,
    .table td a.fw-medium { white-space: normal; }
    .table td:last-child .d-flex,
    .table td:last-child form {
        flex-wrap: nowrap;
    }
    /* last resort: scroll inside the card, never the page */
    .dt-layout-table,
    .card > .table-responsive,
    .card-body > .table-responsive {
        overflow-x: auto;
    }
    .card { min-width: 0; }
    /* DataTables (autoWidth) freezes column widths in <col style="width:…"> at init — often
       while the tab is hidden or before wrapping applies. Let the browser size them. */
    table.dataTable { width: 100% !important; }
    table.dataTable colgroup col { width: auto !important; }
    table.dataTable > thead > tr > th { width: auto !important; }
    /* sort arrow: DataTables reserves 30px on every sortable header — half is enough */
    table.dataTable > thead > tr > th.dt-orderable-asc,
    table.dataTable > thead > tr > th.dt-orderable-desc,
    table.dataTable > thead > tr > th.dt-ordering-asc,
    table.dataTable > thead > tr > th.dt-ordering-desc { padding-right: 1.1rem !important; }
    table.dataTable > thead > tr > th .dt-column-order { right: .2rem !important; }
    /* long rows of status tabs (/invoices) wrap instead of widening the page */
    .nav-tabs, .nav-pills { flex-wrap: wrap; }
}

/* laptops (1280–1399px): a little tighter still */
@media (min-width: 992px) and (max-width: 1399.98px) {
    .table > :not(caption) > * > * {
        padding-left: .45rem;
        padding-right: .45rem;
    }
    .table tbody td { font-size: .8125rem; }
    .table thead th { font-size: .6875rem; }
}