
.tb-table {
    text-align: left;
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    vertical-align: top;
    font-size: config('textSizes.base');

    @include mappy-bp(xl) {
        font-size: config('textSizes.lg');
    }
}

.tb-table--with-dividers {
    tr:not(:last-child) {
        border-bottom: 1px solid config('colors.grey-lighter');
    }
}

.tb-table th,
.tb-table td {
    padding: config('padding.2') config('padding.1');
    vertical-align: top;

    > *:first-child {
        margin-top: 0;
    }
}

.tb-table:not(.tb-table--mobile-two-columns) th,
.tb-table:not(.tb-table--mobile-two-columns) td {
    &:first-child {
        padding-left: 0;
    }

    &:last-child {
        padding-right: 0;
    }
}

@include mappy-bp(max xs) {
    .tb-table--mobile-two-columns tr {
        display: flex;
        flex-wrap: wrap;
    }

    .tb-table--mobile-two-columns th,
    .tb-table--mobile-two-columns td {
        &:nth-child(odd) {
            width: 38%;
        }

        &:nth-child(even) {
            width: 62%;
        }
    }

    .tb-table--with-dividers.tb-table--mobile-two-columns th:nth-child(n + 3),
    .tb-table--with-dividers.tb-table--mobile-two-columns td:nth-child(n + 3) {
        border-top: 1px solid config('colors.grey-lighter');
    }
}

@include mappy-bp(xs) {
    .tb-table th,
    .tb-table td {
        padding: config('padding.3');

        &:first-child {
            padding-left: 0;
        }

        &:last-child {
            padding-right: 0;
        }
    }
}

@include mappy-bp(max md) {
    .tb-table--mobile-stack-third-cell-and-up th,
    .tb-table--mobile-stack-third-cell-and-up td {
        &:nth-child(1) {
            width: 50%;
            padding: config('padding.1') config('padding.1') config('padding.1') 0;
        }

        &:nth-child(2) {
            width: 50%;
            padding: config('padding.1') 0 config('padding.1') config('padding.1');
        }

        &:nth-child(n + 3) {
            display: block;
            width: 100%;
            padding: config('padding.1') 0;
        }
    }

    .tb-table--mobile-stack-third-cell-and-up tr {
        display: flex;
        flex-wrap: wrap;

        &:not(:last-child) {
            margin-bottom: config('margin.2');
        }
    }
}
