.toggle-button-container {

    .MuiButtonBase-root {
        &.MuiToggleButton-root {
            height: 2.5rem;
            padding: 0 1rem;

            font-size: var(--font-size-small);
            font-weight: 400;
            text-transform: none;

            --button-toggle-color: #287fce;

            color: var(--aisera-uicomponents-toggle-button-color, #5f6878);
            border: 1px solid var(--aisera-uicomponents-toggle-button-border, #a8b0c2);
            background-color: var(--aisera-uicomponents-toggle-button-bgcolor);

            svg {
                height: 1.5rem;
                width: 1.5rem;

                path {
                    fill: var(--aisera-uicomponents-toggle-button-icon-color, #5F6878)
                }
            }

            &.Mui-selected {
                --aisera-uicomponents-toggle-button-color: var(--button-toggle-color);
                --aisera-uicomponents-toggle-button-border: var(--button-toggle-color);
                --aisera-uicomponents-toggle-button-icon-color: var(--button-toggle-color);
                border-left: 1px solid var(--aisera-uicomponents-toggle-button-border);

                &:hover {
                    background-color: var(--aisera-uicomponents-toggle-button-bgcolor, rgba(38, 51, 63, 0.04));
                }
            }

            &:hover {
                --aisera-uicomponents-toggle-button-color: var(--button-toggle-color);
                --aisera-uicomponents-toggle-button-bgcolor: rgba(38, 51, 63, 0.04);
                --aisera-uicomponents-toggle-button-icon-color: var(--button-toggle-color);

            }

        }
    }
}