.igz-size {
    .size-color-set();

    align-items: center;
    display: flex;
    justify-content: space-between;

    &:after {
        content: ' ';
        display: inline-block;
        vertical-align: middle;
    }

    .size-value {
        line-height: 1;
        flex: 0 0 100px;
        min-width: 100px;

        > span {
            line-height: 25px;
        }

        &.short {
            flex: 0 0 75px;
            min-width: 75px;
        }

        &.shorten {
            flex: 0 0 60px;
            min-width: 60px;
        }

        &.shortest {
            flex: 0 0 40px;
            min-width: 40px;
        }
    }

    .size-reserved {
        color: @size-reserved-color;
        font-size: 12px;

        .icon-font-arrow-right:before {
            color: @size-reserved-arrow-right-before-color;
            font-size: 10px;
            padding: 0 4px 0 4px;
        }

        .icon-font-infinity:before {
            color: @size-reserved-infinity-before-color;
            font-size: 10px;
        }
    }

    .size-chart {
        flex: 1 1 auto;
        min-width: 0;

        div.highcharts-tooltip {
            position: fixed !important;

            .igz-tooltip-wrapper {
                color: @size-chart-tooltip-wrapper-color;

                &.used-capacity-tooltip-wrapper {
                    .igz-row {
                        .tooltip-label,
                        .tooltip-value {
                            text-overflow: unset;
                        }
                    }
                }

                .tooltip-header {
                    padding-bottom: 6px;
                    margin-bottom: 5px;
                    line-height: 1.1;
                    text-align: center;
                }
            }
        }
    }

    .igz-highcharts-wrapper {
        height: 40px;
        position: relative;
        width: 100%;
    }
}