.table-product-nutrients {}
.table-product-nutrients th {
    font-size: 14px;
    font-weight: 300;
    color: #92949f;
    padding-bottom: .5rem;
}
.table-product-nutrients td {
    font-size: 18px;
    font-weight: 300 !important;
}
.table-product-nutrients td a {
    text-decoration: none;
}

.icon-color {
    display: inline-block;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    flex-shrink: 0;
}

/**
 * Диаграммы
 */
.diagram-wrap {
    width: 100%;
}

.diagram-horizont {
    position: relative;
    display: flex;
    height: 60px;
    background-color: #f0f0f0;
    border-radius: 5px;
    overflow: hidden;
}

/* линии по 10% */
.diagram-horizont::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: repeating-linear-gradient(
            to right,
            rgba(0,0,0,0.05) 0,
            rgba(0,0,0,0.05) 1px,
            transparent 1px,
            transparent 10%
    );
}

/* подписи */
.diagram-labels {
    position: absolute;
    width: 100%;
    height: 20px;
    margin-top: 20px;
}

.diagram-labels span {
    position: absolute;
    transform: translateX(3px);
    font-size: 12px;
    color: #9f9f9f;
    white-space: nowrap;
}

/**

 */
.diagram-table-wrap {
    width: 100%;
    /*height: 100%;*/
}

.diagram-table-horizont {
    position: relative;
    display: flex;
    height: 44px;
    /*height: 100%;*/
    background-color: #f0f0f0;
    /*border-radius: 5px;*/
    overflow: hidden;
}
@media (min-width: 992px) {
    .diagram-table-labels::after {
        display: none;
    }
    /* линии по 10% */
    .diagram-table-horizont::after {
        content: "";
        position: absolute;
        inset: 0;
        pointer-events: none;
        background: repeating-linear-gradient(
                to right,
                rgba(0,0,0,0.05) 0,
                rgba(0,0,0,0.05) 1px,
                transparent 1px,
                transparent 25%
        );
    }
}

/* подписи */
.diagram-table-labels {
    position: absolute;
    width: 100%;
    height: 10px;
    margin-top: 10px;
}

.diagram-table-labels span {
    position: absolute;
    transform: translateX(3px);
    font-size: 12px;
    color: #9f9f9f;
    white-space: nowrap;
}
.diagram-table-labels span.diagram-table-percent {
    color: #000;
    font-size: 18px;
    margin-top: -3px;
    left: 3px;
}
[data-bs-theme=dark] {
    .diagram-table-horizont {
        background-color: #333333;
    }
    .diagram-table-labels span.diagram-table-percent {
        color: #dadada;
        text-shadow: 0 0 3px #000000;
    }
    .diagram-table-labels span {
        color: #636363;
    }
}