@import '../../styles/colors', '../../styles/fonts', '../../styles/fontSizeCalculator', '../../styles/variables';

.ui.prompt {
    position: relative;
    &-inline {
        .prompt-actions {
            .prompt- {
                &message, &no-btn, &yes-btn { white-space: nowrap; }
                &message {
                    background-color: color(backgroundColorStatic);
                    border-bottom-left-radius: 3px;
                    border-top-left-radius: 3px;
                    line-height: 33px;
                    padding: 0 11px;
                    &.promp-message-alert { background-color: color(backgroundColorAlert); }
                    &.promp-message-success { background-color: color(backgroundColorSuccess); }
                    &.promp-message-warning { background-color: color(backgroundColorWarning); }
                }
            }
        }
        &.prompt-show .prompt-actions { animation: animateInActions 200ms ease-out forwards; display: inline-flex; }
    }
    .prompt-action {
        &-disable { cursor: default; }
    }
}

@keyframes animateInActions {
    0% { opacity: 0; transform: translateY(-11px); }
    50% { transform: translateY(0); }
    100% { opacity: 1; }
}