.button-green,
.button-green.e-btn,
.button-green.e-btn.e-active,
.button-gray-green {
    justify-content: center;
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 0;
    background-color: var(--ProconomSuperLightGreen);
    color: var(--ProconomDarkGreen);
}

.button-green:enabled:active:hover,
.button-green:enabled:focus:hover,
.button-green:enabled:hover,
.button-green.e-btn:enabled:active:hover,
.button-green.e-btn:enabled:focus:hover,
.button-green.e-btn:enabled:hover,
.button-gray-green:enabled:active:hover,
.button-gray-green:enabled:focus:hover,
.button-gray-green:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-green > .iconify,
.button-green > .iconify:hover,
.button-gray-green > .iconify,
.button-gray-green > .iconify:hover {
    transform: scale(1) !important;
}

.button-green:disabled,
.button-green:disabled:hover,
.button-green.e-btn:disabled,
.button-green.e-btn:disabled:hover,
.button-gray-green:disabled,
.button-gray-green:disabled:hover {
    background-color: var(--ProconomLightGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-green:active,
.button-green.e-btn:active,
.button-gray-green:active {
    background-color: var(--ProconomDarkGreen) !important;
    color: var(--ProconomWhite) !important;
}

.button-green:hover,
.button-green:focus,
.button-green.e-btn:hover,
.button-green.e-btn:focus,
.button-gray-green:hover,
.button-gray-green:focus {
    background-color: var(--ProconomSuperLightGreen);
    color: var(--ProconomDarkGreen);
}

.button-gray-green:not(:active) {
    background-color: var(--ProconomWhite);
}

.button-outline-green,
.button-outline-green:hover,
.button-outline-green:focus,
.button-gray-outline-green,
.button-gray-outline-green:hover,
.button-gray-outline-green:focus {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 1px solid;
    background-color: var(--ProconomWhite) !important;
    border-color: var(--ProconomDarkGreen);
    color: var(--ProconomDarkGreen);
}

.button-outline-green:enabled:active:hover,
.button-outline-green:enabled:focus:hover,
.button-outline-green:enabled:hover,
.button-outline-green:hover:enabled:active:hover,
.button-outline-green:hover:enabled:focus:hover,
.button-outline-green:hover:enabled:hover,
.button-outline-green:focus:enabled:active:hover,
.button-outline-green:focus:enabled:focus:hover,
.button-outline-green:focus:enabled:hover,
.button-gray-outline-green:enabled:active:hover,
.button-gray-outline-green:enabled:focus:hover,
.button-gray-outline-green:enabled:hover,
.button-gray-outline-green:hover:enabled:active:hover,
.button-gray-outline-green:hover:enabled:focus:hover,
.button-gray-outline-green:hover:enabled:hover,
.button-gray-outline-green:focus:enabled:active:hover,
.button-gray-outline-green:focus:enabled:focus:hover,
.button-gray-outline-green:focus:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-outline-green > .iconify,
.button-outline-green > .iconify:hover,
.button-outline-green:hover > .iconify,
.button-outline-green:hover > .iconify:hover,
.button-outline-green:focus > .iconify,
.button-outline-green:focus > .iconify:hover,
.button-gray-outline-green > .iconify,
.button-gray-outline-green > .iconify:hover,
.button-gray-outline-green:hover > .iconify,
.button-gray-outline-green:hover > .iconify:hover,
.button-gray-outline-green:focus > .iconify,
.button-gray-outline-green:focus > .iconify:hover {
    transform: scale(1) !important;
}

.button-outline-green:disabled,
.button-outline-green:disabled:hover,
.button-outline-green:hover:disabled,
.button-outline-green:hover:disabled:hover,
.button-outline-green:focus:disabled,
.button-outline-green:focus:disabled:hover,
.button-gray-outline-green:disabled,
.button-gray-outline-green:disabled:hover,
.button-gray-outline-green:hover:disabled,
.button-gray-outline-green:hover:disabled:hover,
.button-gray-outline-green:focus:disabled,
.button-gray-outline-green:focus:disabled:hover {
    border-color: var(--ProconomDarkGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-outline-green:active,
.button-outline-green:hover:active,
.button-outline-green:focus:active,
.button-gray-outline-green:active,
.button-gray-outline-green:hover:active,
.button-gray-outline-green:focus:active {
    background-color: var(--ProconomSuperLightGreen) !important;
    border-color: transparent;
}

.button-blue,
.button-gray-blue {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 0;
    background-color: var(--ProconomSuperLightBlue);
    color: var(--ProconomNormalBlue);
}

.button-blue:enabled:active:hover,
.button-blue:enabled:focus:hover,
.button-blue:enabled:hover,
.button-gray-blue:enabled:active:hover,
.button-gray-blue:enabled:focus:hover,
.button-gray-blue:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-blue > .iconify,
.button-blue > .iconify:hover,
.button-gray-blue > .iconify,
.button-gray-blue > .iconify:hover {
    transform: scale(1) !important;
}

.button-blue:disabled,
.button-blue:disabled:hover,
.button-gray-blue:disabled,
.button-gray-blue:disabled:hover {
    background-color: var(--ProconomLightGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-blue:active,
.button-gray-blue:active {
    background-color: var(--ProconomNormalBlue) !important;
    color: var(--ProconomWhite) !important;
}

.button-blue:hover,
.button-blue:focus,
.button-gray-blue:hover,
.button-gray-blue:focus {
    background-color: var(--ProconomSuperLightBlue);
    color: var(--ProconomNormalBlue);
}

.button-gray-blue:not(:active) {
    background-color: var(--ProconomWhite);
}

.button-outline-blue,
.button-outline-blue:hover,
.button-outline-blue:focus,
.button-gray-outline-blue,
.button-gray-outline-blue:hover,
.button-gray-outline-blue:focus {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 1px solid;
    background-color: var(--ProconomWhite) !important;
    border-color: var(--ProconomNormalBlue);
    color: var(--ProconomNormalBlue);
}

.button-outline-blue:enabled:active:hover,
.button-outline-blue:enabled:focus:hover,
.button-outline-blue:enabled:hover,
.button-outline-blue:hover:enabled:active:hover,
.button-outline-blue:hover:enabled:focus:hover,
.button-outline-blue:hover:enabled:hover,
.button-outline-blue:focus:enabled:active:hover,
.button-outline-blue:focus:enabled:focus:hover,
.button-outline-blue:focus:enabled:hover,
.button-gray-outline-blue:enabled:active:hover,
.button-gray-outline-blue:enabled:focus:hover,
.button-gray-outline-blue:enabled:hover,
.button-gray-outline-blue:hover:enabled:active:hover,
.button-gray-outline-blue:hover:enabled:focus:hover,
.button-gray-outline-blue:hover:enabled:hover,
.button-gray-outline-blue:focus:enabled:active:hover,
.button-gray-outline-blue:focus:enabled:focus:hover,
.button-gray-outline-blue:focus:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-outline-blue > .iconify,
.button-outline-blue > .iconify:hover,
.button-outline-blue:hover > .iconify,
.button-outline-blue:hover > .iconify:hover,
.button-outline-blue:focus > .iconify,
.button-outline-blue:focus > .iconify:hover,
.button-gray-outline-blue > .iconify,
.button-gray-outline-blue > .iconify:hover,
.button-gray-outline-blue:hover > .iconify,
.button-gray-outline-blue:hover > .iconify:hover,
.button-gray-outline-blue:focus > .iconify,
.button-gray-outline-blue:focus > .iconify:hover {
    transform: scale(1) !important;
}

.button-outline-blue:disabled,
.button-outline-blue:disabled:hover,
.button-outline-blue:hover:disabled,
.button-outline-blue:hover:disabled:hover,
.button-outline-blue:focus:disabled,
.button-outline-blue:focus:disabled:hover,
.button-gray-outline-blue:disabled,
.button-gray-outline-blue:disabled:hover,
.button-gray-outline-blue:hover:disabled,
.button-gray-outline-blue:hover:disabled:hover,
.button-gray-outline-blue:focus:disabled,
.button-gray-outline-blue:focus:disabled:hover {
    border-color: var(--ProconomDarkGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-outline-blue:active,
.button-outline-blue:hover:active,
.button-outline-blue:focus:active,
.button-gray-outline-blue:active,
.button-gray-outline-blue:hover:active,
.button-gray-outline-blue:focus:active {
    background-color: var(--ProconomSuperLightBlue) !important;
    border-color: transparent;
}

.button-red,
.button-gray-red {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 0;
    background-color: var(--ProconomSuperLightRed);
    color: var(--ProconomRed);
}

.button-red:enabled:active:hover,
.button-red:enabled:focus:hover,
.button-red:enabled:hover,
.button-gray-red:enabled:active:hover,
.button-gray-red:enabled:focus:hover,
.button-gray-red:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-red > .iconify,
.button-red > .iconify:hover,
.button-gray-red > .iconify,
.button-gray-red > .iconify:hover {
    transform: scale(1) !important;
}

.button-red:disabled,
.button-red:disabled:hover,
.button-gray-red:disabled,
.button-gray-red:disabled:hover {
    background-color: var(--ProconomLightGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-red:active,
.button-gray-red:active {
    background-color: var(--ProconomRed) !important;
    color: var(--ProconomWhite) !important;
}

.button-red:hover,
.button-red:focus,
.button-gray-red:hover,
.button-gray-red:focus {
    background-color: var(--ProconomSuperLightRed);
    color: var(--ProconomRed);
}

.button-gray-red:not(:active) {
    background-color: var(--ProconomWhite);
}

.button-outline-red,
.button-outline-red:hover,
.button-outline-red:focus,
.button-gray-outline-red,
.button-gray-outline-red:hover,
.button-gray-outline-red:focus {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 1px solid;
    background-color: var(--ProconomWhite) !important;
    border-color: var(--ProconomRed);
    color: var(--ProconomRed);
}

.button-outline-red:enabled:active:hover,
.button-outline-red:enabled:focus:hover,
.button-outline-red:enabled:hover,
.button-outline-red:hover:enabled:active:hover,
.button-outline-red:hover:enabled:focus:hover,
.button-outline-red:hover:enabled:hover,
.button-outline-red:focus:enabled:active:hover,
.button-outline-red:focus:enabled:focus:hover,
.button-outline-red:focus:enabled:hover,
.button-gray-outline-red:enabled:active:hover,
.button-gray-outline-red:enabled:focus:hover,
.button-gray-outline-red:enabled:hover,
.button-gray-outline-red:hover:enabled:active:hover,
.button-gray-outline-red:hover:enabled:focus:hover,
.button-gray-outline-red:hover:enabled:hover,
.button-gray-outline-red:focus:enabled:active:hover,
.button-gray-outline-red:focus:enabled:focus:hover,
.button-gray-outline-red:focus:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-outline-red > .iconify,
.button-outline-red > .iconify:hover,
.button-outline-red:hover > .iconify,
.button-outline-red:hover > .iconify:hover,
.button-outline-red:focus > .iconify,
.button-outline-red:focus > .iconify:hover,
.button-gray-outline-red > .iconify,
.button-gray-outline-red > .iconify:hover,
.button-gray-outline-red:hover > .iconify,
.button-gray-outline-red:hover > .iconify:hover,
.button-gray-outline-red:focus > .iconify,
.button-gray-outline-red:focus > .iconify:hover {
    transform: scale(1) !important;
}

.button-outline-red:disabled,
.button-outline-red:disabled:hover,
.button-outline-red:hover:disabled,
.button-outline-red:hover:disabled:hover,
.button-outline-red:focus:disabled,
.button-outline-red:focus:disabled:hover,
.button-gray-outline-red:disabled,
.button-gray-outline-red:disabled:hover,
.button-gray-outline-red:hover:disabled,
.button-gray-outline-red:hover:disabled:hover,
.button-gray-outline-red:focus:disabled,
.button-gray-outline-red:focus:disabled:hover {
    border-color: var(--ProconomDarkGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-outline-red:active,
.button-outline-red:hover:active,
.button-outline-red:focus:active,
.button-gray-outline-red:active,
.button-gray-outline-red:hover:active,
.button-gray-outline-red:focus:active {
    background-color: var(--ProconomSuperLightRed) !important;
    border-color: transparent;
}

.button-gray,
.button-gray-gray {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 0;
    background-color: var(--ProconomNormalGray);
    color: gray;
}

.button-gray:enabled:active:hover,
.button-gray:enabled:focus:hover,
.button-gray:enabled:hover,
.button-gray-gray:enabled:active:hover,
.button-gray-gray:enabled:focus:hover,
.button-gray-gray:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-gray > .iconify,
.button-gray > .iconify:hover,
.button-gray-gray > .iconify,
.button-gray-gray > .iconify:hover {
    transform: scale(1) !important;
}

.button-gray:disabled,
.button-gray:disabled:hover,
.button-gray-gray:disabled,
.button-gray-gray:disabled:hover {
    background-color: var(--ProconomLightGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-gray:active,
.button-gray-gray:active {
    background-color: gray !important;
    color: var(--ProconomWhite) !important;
}

.button-gray:hover,
.button-gray:focus,
.button-gray-gray:hover,
.button-gray-gray:focus {
    background-color: var(--ProconomNormalGray);
    color: gray;
}

.button-gray-gray:not(:active) {
    background-color: var(--ProconomWhite);
}

.button-outline-gray,
.button-outline-gray:hover,
.button-outline-gray:focus,
.button-gray-outline-gray,
.button-gray-outline-gray:hover,
.button-gray-outline-gray:focus {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 1px solid;
    background-color: var(--ProconomWhite) !important;
    border-color: gray;
    color: gray;
}

.button-outline-gray:enabled:active:hover,
.button-outline-gray:enabled:focus:hover,
.button-outline-gray:enabled:hover,
.button-outline-gray:hover:enabled:active:hover,
.button-outline-gray:hover:enabled:focus:hover,
.button-outline-gray:hover:enabled:hover,
.button-outline-gray:focus:enabled:active:hover,
.button-outline-gray:focus:enabled:focus:hover,
.button-outline-gray:focus:enabled:hover,
.button-gray-outline-gray:enabled:active:hover,
.button-gray-outline-gray:enabled:focus:hover,
.button-gray-outline-gray:enabled:hover,
.button-gray-outline-gray:hover:enabled:active:hover,
.button-gray-outline-gray:hover:enabled:focus:hover,
.button-gray-outline-gray:hover:enabled:hover,
.button-gray-outline-gray:focus:enabled:active:hover,
.button-gray-outline-gray:focus:enabled:focus:hover,
.button-gray-outline-gray:focus:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-outline-gray > .iconify,
.button-outline-gray > .iconify:hover,
.button-outline-gray:hover > .iconify,
.button-outline-gray:hover > .iconify:hover,
.button-outline-gray:focus > .iconify,
.button-outline-gray:focus > .iconify:hover,
.button-gray-outline-gray > .iconify,
.button-gray-outline-gray > .iconify:hover,
.button-gray-outline-gray:hover > .iconify,
.button-gray-outline-gray:hover > .iconify:hover,
.button-gray-outline-gray:focus > .iconify,
.button-gray-outline-gray:focus > .iconify:hover {
    transform: scale(1) !important;
}

.button-outline-gray:disabled,
.button-outline-gray:disabled:hover,
.button-outline-gray:hover:disabled,
.button-outline-gray:hover:disabled:hover,
.button-outline-gray:focus:disabled,
.button-outline-gray:focus:disabled:hover,
.button-gray-outline-gray:disabled,
.button-gray-outline-gray:disabled:hover,
.button-gray-outline-gray:hover:disabled,
.button-gray-outline-gray:hover:disabled:hover,
.button-gray-outline-gray:focus:disabled,
.button-gray-outline-gray:focus:disabled:hover {
    border-color: var(--ProconomDarkGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-outline-gray:active,
.button-outline-gray:hover:active,
.button-outline-gray:focus:active,
.button-gray-outline-gray:active,
.button-gray-outline-gray:hover:active,
.button-gray-outline-gray:focus:active {
    background-color: var(--ProconomNormalGray) !important;
    border-color: transparent;
}

.button-gray-outline-green:active,
.button-gray-outline-blue:active,
.button-gray-outline-red:active,
.button-gray-outline-gray:active {
    background-color: var(--ProconomWhite) !important;
    border-color: transparent;
}

.button-white,
.button-white-white {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 0;
    background-color: var(--ProconomWhite);
    color: gray;
}

.button-white:enabled:active:hover,
.button-white:enabled:focus:hover,
.button-white:enabled:hover,
.button-white-white:enabled:active:hover,
.button-white-white:enabled:focus:hover,
.button-white-white:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-white > .iconify,
.button-white > .iconify:hover,
.button-white-white > .iconify,
.button-white-white > .iconify:hover {
    transform: scale(1) !important;
}

.button-white:disabled,
.button-white:disabled:hover,
.button-white-white:disabled,
.button-white-white:disabled:hover {
    background-color: var(--ProconomLightGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-white:active,
.button-white-white:active {
    background-color: gray !important;
    color: var(--ProconomWhite) !important;
}

.button-white:hover,
.button-white:focus,
.button-white-white:hover,
.button-white-white:focus {
    background-color: var(--ProconomWhite);
    color: gray;
}

.button-light-gray {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 0;
    background-color: var(--ProconomLightGray);
    color: gray;
}

.button-light-gray:enabled:active:hover,
.button-light-gray:enabled:focus:hover,
.button-light-gray:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-light-gray > .iconify,
.button-light-gray > .iconify:hover {
    transform: scale(1) !important;
}

.button-light-gray:disabled,
.button-light-gray:disabled:hover {
    background-color: var(--ProconomLightGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-light-gray:active {
    background-color: gray !important;
    color: var(--ProconomWhite) !important;
}

.button-light-gray:hover,
.button-light-gray:focus {
    background-color: var(--ProconomLightGray);
    color: gray;
}

.button-transparent {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 0;
    background-color: transparent;
    color: gray;
}

.button-transparent:enabled:active:hover,
.button-transparent:enabled:focus:hover,
.button-transparent:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-transparent > .iconify,
.button-transparent > .iconify:hover {
    transform: scale(1) !important;
}

.button-transparent:disabled,
.button-transparent:disabled:hover {
    background-color: var(--ProconomLightGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-transparent:active {
    background-color: gray !important;
    color: var(--ProconomWhite) !important;
}

.button-transparent:hover,
.button-transparent:focus {
    background-color: transparent;
    color: gray;
}

.button-gray-green-pressed {
    border-radius: 8px;
    font-weight: 500;
    height: fit-content;
    display: flex;
    align-items: center;
    border: 0;
    background-color: var(--ProconomDarkGreen) !important;
    color: var(--ProconomWhite) !important;
}

.button-gray-green-pressed:enabled:active:hover,
.button-gray-green-pressed:enabled:focus:hover,
.button-gray-green-pressed:enabled:hover {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.button-gray-green-pressed > .iconify,
.button-gray-green-pressed > .iconify:hover {
    transform: scale(1) !important;
}

.button-gray-green-pressed:disabled,
.button-gray-green-pressed:disabled:hover {
    background-color: var(--ProconomLightGray) !important;
    color: var(--ProconomDarkGray) !important;
}

.button-gray-green-pressed:disabled,
.button-gray-green-pressed:disabled:hover {
    background-color: var(--ProconomDarkGreen) !important;
    color: var(--ProconomWhite) !important;
}

.button-blue.pcm-small,
.button-gray-blue.pcm-small,
.button-outline-blue.pcm-small,
.button-gray-outline-blue.pcm-small,
.button-gray.pcm-small,
.button-gray-gray.pcm-small,
.button-outline-gray.pcm-small,
.button-gray-outline-gray.pcm-small,
.button-green.pcm-small,
.button-gray-green.pcm-small,
.button-outline-green.pcm-small,
.button-gray-outline-green.pcm-small,
.button-red.pcm-small,
.button-gray-red.pcm-small,
.button-outline-red.pcm-small,
.button-gray-outline-red.pcm-small {
    padding: 2px 12px 2px !important;
}

.button-blue.pcm-big,
.button-gray-blue.pcm-big,
.button-outline-blue.pcm-big,
.button-gray-outline-blue.pcm-big,
.button-gray.pcm-big,
.button-gray-gray.pcm-big,
.button-outline-gray.pcm-big,
.button-gray-outline-gray.pcm-big,
.button-green.pcm-big,
.button-gray-green.pcm-big,
.button-outline-green.pcm-big,
.button-gray-outline-green.pcm-big,
.button-red.pcm-big,
.button-gray-red.pcm-big,
.button-outline-red.pcm-big,
.button-gray-outline-red.pcm-big {
    padding: 9px 12px 7px !important;
}

.adsk-button.toggled {
    background-color: var(--ProconomSuperLightGreen) !important;
    color: var(--ProconomDarkGreen) !important;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}

.adsk-button.active {
    box-shadow: inset 3px 3px 6px #d9d9d9, inset -3px -3px 6px #e8e8e8 !important;
}
