@use '../abstracts/variables' as *;
@use '../abstracts/mixins' as *;

.table-card {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: $radius-xl;
    overflow-x: auto;
}

.table {
    width: 100%;
    font-size: $font-sm;
}

.table__head {
    background: var(--color-surface-muted);
}

.table__head-cell {
    text-align: left;
    font-weight: 500;
    color: var(--color-text-secondary);
    padding: $space-2 $space-4;
}

.table__body {
    tr {
        border-top: 1px solid var(--color-border);

        &:hover {
            background: var(--color-surface-muted);
        }
    }

    tr.table__row--edit:hover {
        background: none;
    }
}

.table__row--edit {
    background: var(--color-surface-muted);
}

.table__cell {
    padding: $space-2 $space-4;
    color: var(--color-text-secondary);

    &--primary {
        color: var(--color-text-primary);
    }

    &--actions {
        text-align: right;
    }
}

.table__empty {
    padding: $space-4;
    font-size: $font-sm;
    color: var(--color-text-secondary);
}