.ga-table-container {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--ga-color-border);
    border-radius: var(--ga-radius-lg);
    background: var(--ga-color-surface);
}

.ga-table {
    width: 100%;
}

.ga-table-head {
    background: var(--ga-color-surface);
}

.ga-table-head th {
    padding: var(--ga-table-cell-padding-y) var(--ga-table-cell-padding-x);
    text-align: left;
    font-size: var(--ga-font-size-sm);
    font-weight: var(--ga-font-semibold);
    color: var(--ga-color-text-muted);
    white-space: nowrap;
    border-bottom: 1px solid var(--ga-color-border);
}

.ga-table-head th.ga-sortable {
    cursor: pointer;
    user-select: none;
    transition:
        background-color var(--ga-transition-fast),
        color var(--ga-transition-fast);
}

.ga-table-head th.ga-sortable:hover {
    background-color: var(--ga-color-surface-hover);
    color: var(--ga-color-text);
}

.ga-table-head th.ga-sort-active {
    color: var(--ga-color-text);
}

.ga-table-head th.ga-sortable::after {
    display: inline-block;
    margin-left: .4rem;
    opacity: 0;
    transition: opacity var(--ga-transition-fast);
}

.ga-table-head th.ga-sort-active[data-direction="asc"]::after {
    content: "↑";
    opacity: .7;
}

.ga-table-head th.ga-sort-active[data-direction="desc"]::after {
    content: "↓";
    opacity: .7;
}

.ga-table-head th.ga-sort-active[data-sort-direction="reverse"][data-direction="asc"]::after {
    content: "↓";
}

.ga-table-head th.ga-sort-active[data-sort-direction="reverse"][data-direction="desc"]::after {
    content: "↑";
}

.ga-table-body tr {
    transition: background-color var(--ga-transition-fast);
}

.ga-table-body td {
    padding: var(--ga-table-cell-padding-y) var(--ga-table-cell-padding-x);
    border-bottom: 1px solid var(--ga-color-border);
    vertical-align: middle;
}

.ga-table-body tr:last-child td {
    border-bottom: none;
}

.ga-table-body tr:hover {
    background-color: var(--ga-color-surface-hover);
}