:root {
    --nb-product-bulk-variant-table-column-header-color: var(--nb-text-color-primary);
    --nb-product-bulk-variant-table-column-header-font-size: var(--nb-font-size-14);
    --nb-product-bulk-variant-table-column-header-font-weight: var(--nb-font-weight-700);
    --nb-product-bulk-variant-table-column-header-line-height: 24px;
}

.nb-product-bulk-variant-table {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns {
    display: flex;
    align-items: center;
    gap: 40px;
}

.nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns .nb-product-bulk-variant-table-size-column-header {
    flex: 0 0 28%;
}

.nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns .nb-product-bulk-variant-table-quantity-column-header {
    flex: 0 0 39.8%;
}

.nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns .nb-product-bulk-variant-table-price-column-header {
    flex: 0 0 16%;
}

.nb-product-bulk-variant-table .nb-product-bulk-variant-rows {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.nb-product-bulk-variant-table .nb-product-bulk-variant-table-column-header {
    color: var(--nb-product-bulk-variant-table-column-header-color);
    font-size: var(--nb-product-bulk-variant-table-column-header-font-size);
    font-weight: var(--nb-product-bulk-variant-table-column-header-font-weight);
    line-height: var(--nb-product-bulk-variant-table-column-header-line-height);
}

@media screen and (max-width: 576px) {

    .nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns .nb-product-bulk-variant-table-size-column-header {
        flex: 0 0 27%;
    }

    .nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns .nb-product-bulk-variant-table-quantity-column-header {
        flex: 0 0 39.8%;
    }

    .nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns .nb-product-bulk-variant-table-price-column-header {
        flex: 0 0 26%;
    }

    .nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns {
        gap: 20px;
    }
}

@media screen and (max-width: 360px) {
    .nb-product-bulk-variant-table .nb-product-bulk-variant-table-header-columns .nb-product-bulk-variant-table-price-column-header {
        flex: 0 0 21%;
    }
}