@media (min-width: 768px) and (pointer: fine) {
    .fi-ta-content:has(.ssl-resizable-table) {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }

    .ssl-resizable-table {
        min-width: 100%;
    }

    .ssl-resizable-table .fi-ta-header-cell[data-ssl-resizable-column] {
        position: relative;
    }

    .ssl-table-column-resizer {
        position: absolute;
        z-index: 10;
        inset-block: 0;
        inset-inline-end: -5px;
        width: 10px;
        cursor: col-resize;
        touch-action: none;
        user-select: none;
    }

    .ssl-table-column-resizer::after {
        position: absolute;
        inset-block: 20%;
        inset-inline-start: 4px;
        width: 2px;
        border-radius: 9999px;
        background: color-mix(in srgb, currentColor 26%, transparent);
        content: '';
        opacity: 0;
        transition: opacity 120ms ease;
    }

    .ssl-table-column-resizer:hover::after,
    .ssl-table-column-resizer:focus-visible::after,
    .ssl-column-resizing .ssl-table-column-resizer::after {
        opacity: 1;
    }

    .ssl-table-column-resizer:focus-visible {
        outline: 2px solid var(--color-primary-500, #3b82f6);
        outline-offset: -2px;
    }

    .ssl-resizable-table .ssl-resized-column {
        overflow: hidden;
    }

    .ssl-resizable-table .ssl-resized-column .fi-ta-text-item {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    body.ssl-column-resizing {
        cursor: col-resize;
        user-select: none;
    }
}