.hcg-container {
    .hcg-table {
        --ig-pinned-border-width: var(--hcg-pinned-border-width, var(--ig-row-border-width));
        --ig-pinned-border-style: var(--hcg-pinned-border-style, var(--ig-row-border-style));
        --ig-pinned-border-color: var(--hcg-pinned-border-color, var(--ig-row-border-color));
        --ig-pinned-border: var(--ig-pinned-border-width) var(--ig-pinned-border-style) var(--ig-pinned-border-color);
        --ig-pinned-top-shadow: var(--hcg-pinned-top-shadow);
        --ig-pinned-bottom-shadow: var(--hcg-pinned-bottom-shadow);
    }
}

.hcg-container,
.highcharts-light .hcg-container {
    --ig-pinned-border-width: var(--hcg-pinned-border-width, var(--ig-row-border-width));
    --ig-pinned-border-style: var(--hcg-pinned-border-style, var(--ig-row-border-style));
    --ig-pinned-border-color: var(--hcg-pinned-border-color, var(--ig-row-border-color));
    --ig-pinned-border: var(--ig-pinned-border-width) var(--ig-pinned-border-style) var(--ig-pinned-border-color);
    --ig-pinned-top-shadow: var(--hcg-pinned-top-shadow);
    --ig-pinned-bottom-shadow: var(--hcg-pinned-bottom-shadow);
}

.hcg-theme-default,
.highcharts-light .hcg-theme-default {
    --hcg-pinned-top-shadow: 0 3px 5px -2px rgba(0, 0, 0, 0.1);
    --hcg-pinned-bottom-shadow: 0 -3px 5px -2px rgba(0, 0, 0, 0.1);
}

.hcg-container .hcg-table tbody.hcg-tbody-pinned-top {
    border-bottom: var(--ig-pinned-border);
    box-shadow: var(--ig-pinned-top-shadow);
}

.hcg-container .hcg-table tbody.hcg-tbody-pinned-bottom {
    border-top: var(--ig-pinned-border);
    box-shadow: var(--ig-pinned-bottom-shadow);
}

.hcg-container .hcg-table {
    > tbody.hcg-tbody-pinned {
        height: auto;
        display: block;
        overflow: hidden;
        min-height: 0;
        flex: 0 0 auto;
        position: relative;
        z-index: 1;

        > tr {
            display: block;
            position: static;
        }
    }

    > tbody:not(.hcg-tbody-pinned) > tr.hcg-row-pinned td {
        font-weight: 600;
    }

    &:has(> tbody.hcg-tbody-pinned) {
        > tbody:not(.hcg-tbody-pinned) {
            height: auto;
        }
    }
}