.brx-adv-table {
    --brx-head-bg: transparent;
    --brx-head-color: #201D1D;
    --brx-alt-bg: #f6fbff;
    --brx-border: #201D1D;
    --brx-radius: 6px;
    --brx-pad: 12px;
    --brx-minw: 780px;
    --brx-firstcol: 2.2fr;
    --brx-table-bg: #fff;
    --brx-table-pad: 0px;
    --brx-table-space: 0px;
    --brx-border-w: 1px;
    --brx-cell-align: left;
    --brx-head-align: left;
    --brx-head-pad: 12px;
    --brx-head-minh: 44px;
    --brx-row-hover-bg: inherit;
    --brx-first-bg: transparent;
    --brx-cell-fs: inherit;
    --brx-head-fs: inherit;
    margin-block: var(--brx-table-space);
    display: block;
    padding: 0;
    width: 100%;
}

.brx-adv-table .tbl-title {
    margin: 0 0 12px;
    font-size: clamp(18px, 2vw, 22px);
}

.brx-adv-table .tbl {
    display: grid;
    grid-auto-rows: minmax(44px, auto);
    border: var(--brx-border-w) solid var(--brx-border);
    border-radius: var(--brx-radius);
    overflow: hidden;
    padding: var(--brx-table-pad);
}

.brx-adv-table .row {
    display: grid;
    align-items: stretch;
    background: var(--brx-table-bg);
}

.brx-adv-table .row.alt {
    background: var(--brx-alt-bg);
}


.brx-adv-table .cell {
    padding: var(--brx-pad);

    border-right: var(--brx-border-w) solid var(--brx-border);
    text-align: var(--brx-cell-align);
    font-size: var(--brx-cell-fs);
}

.brx-adv-table .cell:last-child {
    border-right: none;
}

.brx-adv-table .head {
    background: var(--brx-head-bg);
    color: var(--brx-head-color);
    font-weight: 600;
}

.brx-adv-table .head .cell {
    padding: var(--brx-head-pad);
    min-height: var(--brx-head-minh);
    text-align: var(--brx-head-align);
    font-size: var(--brx-head-fs);
}

.brx-adv-table .head.sticky {
    position: sticky;
    top: 0;
    z-index: 3;
}

.brx-adv-table .first {
    background: var(--brx-table-bg);
    position: sticky;
    left: 0;
    z-index: 2;
    font-weight: 600;
}

.brx-adv-table .row.alt .first {
    background: var(--brx-alt-bg);
}

.brx-adv-table .head .first {
    box-shadow: none;
    background: var(--brx-head-bg);
}

/* Responsive: make table scrollable horizontally */
@media (max-width: 900px) {
    .brx-adv-table .tbl {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .brx-adv-table .row {
        min-width: var(--brx-minw);
    }
}