.chart-modeling-settings {
    &__container {
        top: var(--dl-chart-modelling-settings-top, 40px);
        width: 280px;
        z-index: 10;
        background: var(--g-color-base-float);
        overflow: auto;
    }

    &__section {
        border-bottom: 1px solid var(--g-color-line-generic-solid);
        padding: var(--g-spacing-4);
    }

    &__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    &__title {
        margin-right: var(--g-spacing-2);
    }

    &__section-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    &__form-row {
        padding: var(--g-spacing-5) 0 0;
        display: flex;
        flex-direction: column;
        gap: var(--g-spacing-2);

        &_switch {
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
        }
    }

    &__shape-and-width-controls {
        display: flex;
        gap: var(--g-spacing-2);
    }

    &__line-width-input {
        width: 120px;
    }

    &__shape-select {
        width: 112px;
    }

    &__shape-select-icon {
        display: flex;
        overflow: hidden;
    }

    &__widget-name {
        display: flex;
        align-items: center;
        gap: var(--g-spacing-1);
        padding-top: var(--g-spacing-2);
    }

    &__control-label {
        cursor: pointer;
    }

    &__label-with-hint {
        display: flex;
        gap: var(--g-spacing-1);
    }
}
