@layer base {
    .tbl {
        border-collapse: collapse
    }

        .tbl th:first-child, .tbl td:first-child {
            padding-left: 0
        }

        .tbl tr:first-child td {
            border-top: none !important
        }

        .tbl th:last-child, .tbl td:last-child {
            padding-right: 0
        }

        .tbl th {
            padding: 6px 8px;
            border: none;
            color: var(--color-text);
            font-size: 12px;
            font-weight: var(--font-weight-semibold);
            letter-spacing: var(--tracking-small-caps);
            line-height: 16px;
            text-align: left;
            text-transform: uppercase
        }

        .tbl td {
            padding: 16px 8px;
            border: none;
            border-top: 1px solid var(--color-background-primary-soft) !important;
            color: var(--color-text);
            vertical-align: top
        }

            .tbl td.align-center, .tbl th.align-center {
                text-align: center
            }

            .tbl td.align-right, .tbl th.align-right {
                text-align: right
            }

    .tbl-compact td {
        padding: 8px
    }

    .tbl-full-width {
        width: 100%
    }
}