/*
// .card-table
*/
@import '../variables';
@import '../mixins/direction';
@import '../mixins/breakpoints';


.card-table {
    font-size: 15px;

    a:hover {
        text-decoration: underline;
    }

    table {
        width: 100%;
        min-width: 500px;

        @include direction {
            text-align: $inline-start;
        }
    }
    thead th {
        border-bottom: 1px solid map_get($card-scheme, divider);
        text-transform: uppercase;
        font-size: 13px;
        padding: 10px 12px;
    }
    tbody,
    tfoot {
        th,
        td {
            padding: 12px 12px;
        }
    }
    tfoot {
        th,
        td {
            padding-top: 16px;
            padding-bottom: 16px;
        }
    }
    tbody + tbody tr,
    tbody + tfoot tr,
    tbody tr + tr {
        th,
        td {
            border-top: 1px solid map_get($card-scheme, divider);
        }
    }
    tbody,
    tfoot {
        tr:hover > * {
            background-color: $table-row-hover-bg;
        }
    }
    th, td {
        @include direction {
            &:first-child {
                #{$padding-inline-start}: 2rem;
            }
            &:last-child {
                #{$padding-inline-end}: 2rem;
            }
        }
    }

    .card-table__body--merge-rows {
        th,
        td {
            padding-top: 3px;
            padding-bottom: 3px;
        }
        tr:first-child {
            th,
            td {
                padding-top: 12px;
            }
        }
        tr:last-child {
            th,
            td {
                padding-bottom: 12px;
            }
        }

        tr + tr {
            th,
            td {
                border-top: none;
            }
        }
    }
}


@include media-breakpoint-only(md) {
    .card-table {
        font-size: 14px;

        th, td {
            @include direction {
                &:first-child {
                    #{$padding-inline-start}: 1.5rem;
                }
                &:last-child {
                    #{$padding-inline-end}: 1.5rem;
                }
            }
        }
    }
}


@include media-breakpoint-down(sm) {
    .card-table {
        font-size: 14px;

        th, td {
            @include direction {
                &:first-child {
                    #{$padding-inline-start}: 1.375rem;
                }
                &:last-child {
                    #{$padding-inline-end}: 1.375rem;
                }
            }
        }
    }
}