@import 'variables';

main#app {
    margin-top: 20px;
}

.wizard-header {
    display: flex;
    flex-direction: row;
    align-items: baseline;

    .app-back-button {
        padding: 5px;
        margin-right: 10px;
        height: 100%;
        line-height: normal;
    }
}

.app-cta-container {
    display: flex;
    justify-content: flex-end;
    margin: 10px 0;
}

.action-button-row {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: flex-end;

    @include mobile {
        flex-wrap: wrap;

        .button,
        button {
            width: 100%;
            flex: 0 0 100%;
        }
    }

    .button-primary {
        order: -1;
    }
}

.imap-import-modal {
    .imap-import-progress {
        border-radius: 25px;
        width: 100%;
        height: 5px;

        &::-webkit-progress-value {
            background-color: $primary-color;
            border-radius: 25px;
        }
        &::-moz-progress-bar {
            background-color: $primary-color;
            border-radius: 25px;
        }
    }
}
