.table-container {
    background-color : var(--bg-zero);
    color            : var(--text);
    border-radius    : var(--rounded-default);
    width            : 100%;
    max-width        : 100%;
    overflow-x       : auto;
}

.table {
    display         : table;
    width           : 100%;
    border-collapse : collapse;
    border-spacing  : 0;
    max-width       : 100%;
    vertical-align  : top;
}

@media(max-width: 992px) {
    .table.mobile {
        min-width : 100%
    }
}

.table-head {
    display          : table-header-group;
    border           : 1px solid;
    background-color : var(--bg-zero)
}

.table-head-row {
    color          : inherit;
    display        : table-row;
    vertical-align : top;
    outline        : 0;
    border         : 1px solid;
    border-color   : var(--border);
    font-weight    : 600;
    font-size      : 1rem;
    line-height    : 1.5;
    color          : #a5a5ba
}

.table-head-row .table-cell {
    font-weight : 700
}

.table-body {
    display : table-row-group
}

.table-row {
    color            : inherit;
    display          : table-row;
    vertical-align   : top;
    outline          : 0;
    border           : 1px solid;
    border           : none;
    border-color     : transparent;
    background-color : var(--bg-zero)
}

.table-row:nth-child(even) {
    background-color : var(--bg-zero)
}

.table-cell {
    table-layout   : fixed;
    display        : table-cell;
    color          : var(--text);
    text-align     : left;
    font-weight    : 400;
    font-size      : 1rem;
    line-height    : 1.43;
    letter-spacing : .01071em;
    vertical-align : inherit;
    padding        : 10px 16px 10px 0;
    border         : none;
}

  /* Media query for mobile devices with a maximum width of 767px */
@media (max-width: 767px) {
    .table.mobile .table-row {
        display    : block;
        width      : 100%;
        box-sizing : border-box;
    }

    .table.mobile .table-row .table-cell {
        display    : block;
        width      : 100% !important;
        box-sizing : border-box;
    }
}

.table-cell.textarea {
    white-space : pre-line;
}

.table-cell .editor-content>*:not(div, p, span, a, b, i, em, small, strong) {
    display : none
}

.table-cell.call-to-action {
    text-align : right
}

.table-cell.call-to-action>div,
.table-cell.call-to-action>button {
    display : inline-block
}

.table-cell.action {
    cursor : pointer
}

.table-cell.action svg {
    margin-left   : 10px;
    margin-bottom : -5px;
    width         : 18px;
    height        : 18px
}

.table-cell.action:hover {
    background : var(--bg-one)
}

.table-cell.th {
    padding : 16px
}