/* Screen-only enhancement: printed invoices retain their original layout. */
@media screen {
    table[data-desktop-grid] {
        border-collapse: separate;
        border-spacing: 0;
        border: 1px solid #bdc9d6;
        font-size: .85rem;
        margin-bottom: 0;
        --bs-table-striped-bg: #f4f7fb;
        --bs-table-hover-bg: #edf4ff;
    }
    table[data-desktop-grid] > :is(thead, tbody, tfoot) > tr > :is(th, td) {
        padding: .35rem .5rem;
        border-right: 1px solid #d5dde7;
        border-bottom: 1px solid #d5dde7;
        vertical-align: middle;
    }
    table[data-desktop-grid] > thead {
        position: sticky;
        top: 0;
        z-index: 2;
        background: #e9eef5;
    }
    table[data-desktop-grid] > thead > tr > th {
        background-color: #e9eef5;
        color: #26384c;
        font-weight: 600;
    }
    table[data-desktop-grid] > tbody > tr:nth-child(even) > td {
        --bs-table-bg-type: #f4f7fb;
    }
    table[data-desktop-grid] > tbody > tr:hover > td {
        --bs-table-bg-state: #edf4ff;
    }
    table[data-desktop-grid] > tbody > tr[data-grid-active] > td {
        --bs-table-bg-state: #dcecff;
        box-shadow: inset 0 1px #85b5ec, inset 0 -1px #85b5ec;
        background-color: #dcecff;
    }
    table[data-desktop-grid]:focus-visible { outline: 2px solid #4285ce; outline-offset: 2px; }
    table[data-desktop-grid] th[data-grid-column] { position: relative; }
    table[data-desktop-grid] th[data-grid-column]::after {
        content: '';
        position: absolute;
        right: 0;
        top: 20%;
        height: 60%;
        border-right: 2px solid #a8b8ca;
        pointer-events: none;
    }
    table[data-desktop-grid] th[data-grid-edge] { cursor: col-resize; }
    table[data-desktop-grid] th[data-grid-sized] {
        width: var(--desktop-grid-column-width) !important;
        min-width: var(--desktop-grid-column-width) !important;
    }
    [data-desktop-grid-host] { overflow: auto; max-height: 68vh; }
}

@media screen {
    [data-app-theme="Dark"] table[data-desktop-grid]:not(.items-data-grid) {
        color: #f8fafc;
        border-color: #475569;
        --bs-table-color: #f8fafc;
        --bs-table-bg: #1e293b;
        --bs-table-border-color: #475569;
        --bs-table-striped-color: #f8fafc;
        --bs-table-striped-bg: #263449;
        --bs-table-hover-color: #f8fafc;
        --bs-table-hover-bg: #334155;
        --bs-table-active-color: #f8fafc;
        --bs-table-active-bg: #1e4167;
    }
    [data-app-theme="Dark"] table[data-desktop-grid]:not(.items-data-grid) > :is(thead, tbody, tfoot) > tr > :is(th, td) {
        color: #f8fafc;
        border-color: #475569;
    }
    [data-app-theme="Dark"] table[data-desktop-grid]:not(.items-data-grid) > thead,
    [data-app-theme="Dark"] table[data-desktop-grid]:not(.items-data-grid) > thead > tr > th {
        background: #334155;
        color: #f8fafc;
    }
    [data-app-theme="Dark"] table[data-desktop-grid]:not(.items-data-grid) > tbody > tr:nth-child(even) > td {
        --bs-table-bg-type: #263449;
    }
    [data-app-theme="Dark"] table[data-desktop-grid]:not(.items-data-grid) > tbody > tr:hover > td {
        --bs-table-bg-state: #334155;
    }
    [data-app-theme="Dark"] table[data-desktop-grid]:not(.items-data-grid) > tbody > tr[data-grid-active] > td {
        --bs-table-bg-state: #1e4167;
        background-color: #1e4167;
        box-shadow: inset 0 1px #60a5fa, inset 0 -1px #60a5fa;
    }
}