.nsbe-events {
    --nsbe-head-bg: #f7f9fc;
    --nsbe-head-color: #111;
    --nsbe-alt-bg: #eaf6ff;
    --nsbe-row-hover: #f6faff;
    --nsbe-border: #e5e8ee;
    --nsbe-badge-radius: 16px;
    --nsbe-pad: 14px;
    --nsbe-head-pad: 14px;
    --nsbe-tab-bg: #ffffff;
    --nsbe-tab-border: #cdd6e1;
    --nsbe-tab-hover-bg: #f2f6fb;
    --nsbe-tab-active-bg: #132a57;
    --nsbe-tab-active-color: #ffffff;
    --nsbe-tab-pad-y: 18px;
    --nsbe-tab-pad-x: 78px;

    --nsbe-tab-radius: 9999px;
    --nsbe-tab-border-w: 2px;
    width: 100%;
    padding: 0;

    --nsbe-border-width: 1px;
    --nsbe-font-size: 14px;
    --nsbe-tab-pad: 8px;
    --nsbe-tab-gap: 6px;
    --nsbe-tab-color: #444;
    --nsbe-tab-active: #000;
}


.nsbe-tabs .nsbe-tab.active {
    background: var(--nsbe-tab-active);
    color: #fff;
}

/* Tabs bar */
.nsbe-events .nsbe-tabs {
    display: flex;
    gap: var(--nsbe-tab-gap);
    align-items: center;
    margin: 12px 0 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: var(--nsbe-pad);
    flex-wrap: wrap;
}

.nsbe-events .nsbe-tabs::-webkit-scrollbar {
    height: 6px;
}

.nsbe-events .nsbe-tabs::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, .15);
    border-radius: 6px;
}

/* Tab pill button */
.nsbe-events .nsbe-tab {
    appearance: none;
    -webkit-appearance: none;
    border: var(--nsbe-tab-border-w) solid var(--nsbe-tab-border);
    background: var(--nsbe-tab-bg);
    color: var(--nsbe-tab-color);
    border-radius: var(--nsbe-tab-radius);
    padding: var(--nsbe-tab-pad-y) var(--nsbe-tab-pad-x);
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease;
    white-space: nowrap;
    background: #f7f7f7;
}


.nsbe-events .nsbe-tab:hover {
    background: var(--nsbe-tab-hover-bg);
}

.nsbe-events .nsbe-tab:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(19, 42, 87, .2);
}

.nsbe-events .nsbe-tab.is-active {
    background: var(--nsbe-tab-active-bg);
    color: var(--nsbe-tab-active-color);
    border-color: var(--nsbe-tab-active-bg);
}

.nsbe-events .row[hidden] {
    display: none !important;
}

.nsbe-events .tbl {
    width: 100%;
    overflow: hidden;
    background: #fff;
}

.nsbe-events .head {
    display: grid;
    grid-template-columns:1.2fr 2fr 1.5fr 1fr;
    background: var(--nsbe-head-bg);
    color: var(--nsbe-head-color);
    font-weight: 600;
    padding: var(--nsbe-head-pad);
}

.nsbe-events .row {
    display: grid;
    grid-template-columns: var(--nsbe-grid,1fr 1fr 1fr 1fr);
    align-items: center;
    padding: var(--nsbe-pad);
    background: #fff;
    border-top: var(--nsbe-border-width) solid var(--nsbe-border);
    font-size: var(--nsbe-font-size);
}

.nsbe-events .row.alt {
    background: var(--nsbe-alt-bg);
}

.nsbe-events .row:hover {
    background: var(--nsbe-row-hover);
}

.nsbe-events .time {
    font-weight: 600;
}

.nsbe-events .title a {
    color: inherit;
    text-decoration: none;
}

.nsbe-events .badges {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.nsbe-events .badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 24px;
    border-radius: var(--nsbe-badge-radius);
    font-weight: 600;
    font-size: 24px;
    line-height: normal;
    color: #fff;
}

/* default badge colors */
.nsbe-events .badge--collegiate {
    background: #0a66c2;
}

.nsbe-events .badge--graduate {
    background: #f59e0b;
}

.nsbe-events .badge--professional {
    background: #ff4d4f;
}

@media (max-width: 900px) {
    .nsbe-events {
        --nsbe-tab-pad-y: 14px;
        --nsbe-tab-pad-x: 33px;
    }
    .nsbe-events .head, .nsbe-events .row {
        grid-template-columns:1fr;
        gap: 6px;
    }

    .nsbe-events .badges {
        justify-content: flex-start;
    }

    .nsbe-events .nsbe-tabs {
        gap: 10px;
        margin: 8px 0 12px;
    }

    .nsbe-events .nsbe-tab {
        padding: 8px 14px;
    }
}