.histogram {
    display: flex;
    flex: 1 1 auto;

    &__chart {
        position: relative;

        display: flex;
        align-items: baseline;

        width: 800px;
        height: 300px;
        margin-top: 30px;
        margin-left: 50px;

        border-bottom: 1px solid var(--g-color-base-generic);
        border-left: 1px solid var(--g-color-base-generic);
    }
    &__x-min {
        position: absolute;
        bottom: -25px;
        left: -3px;

        color: var(--g-color-text-secondary);
    }
    &__x-max {
        position: absolute;
        right: 0;
        bottom: -25px;

        color: var(--g-color-text-secondary);
    }
    &__y-min {
        position: absolute;
        bottom: -7px;
        left: -30px;

        width: 20px;

        text-align: right;

        color: var(--g-color-text-secondary);
    }
    &__y-max {
        position: absolute;
        top: -5px;
        left: -60px;

        width: 50px;

        text-align: right;

        color: var(--g-color-text-secondary);
    }
    &__item {
        width: 1.5%;
        margin-right: 0.5%;

        cursor: pointer;
    }
}

.histogram-tooltip {
    padding: 10px;

    &__label {
        padding-right: 15px;

        color: var(--g-color-text-secondary);
    }
}