.btn.btn-default {
    color: #333;
    background: #eee;
}

.btn span.refresh {
    -webkit-mask-image: url(images/icons/icon-refresh.svg);
    mask-image: url(images/icons/icon-refresh.svg);
    display: inline-block;
    height: 20px;
    width: 20px;
    vertical-align: middle;
    margin-top: -5px;
    margin-right: 4px;
    transition-duration: 2s;
    transition-property: transform;
}

.btn:active span.refresh {
    transform: rotate(360deg);
}

.btn.btn-secondary {
    color: var(--secondary-action-color);
    border: 1px solid var(--secondary-action-color);
    background: unset;
    font-size: 15px;
    border-radius: 7px;
    margin: 5px 9px;
    padding: 0 12px;
    min-width: 100px;
    height: 40px;
}

    .btn.btn-secondary.primary {
        color: var(--primary-action-color);
        border: 1px solid var(--primary-action-color);
    }

        .btn.btn-secondary.primary:hover {
            background: var(--primary-action-color-active);
            color: var(--white);
        }

            .btn.btn-secondary.primary:hover span.refresh {
                background-color: var(--white);
            }

        .btn.btn-secondary.primary span.refresh {
            background-color: var(--primary-action-color);
        }

.btn.btn-primary {
    color: var(--white);
    background: var(--primary-action-color);
    font-size: 15px;
    border-radius: 7px;
    margin: 5px 9px;
    padding: 0 12px;
    min-width: 100px;
    height: 40px;
}

    .btn.btn-primary:active {
        background: var(--primary-action-color-active);
    }

    .btn.btn-primary:hover {
        background: var(--primary-action-color-active);
    }

    .btn.btn-primary.green {
        color: var(--white);
        background: var(--green);
    }

        .btn.btn-primary.green:active {
            background: var(--green-active);
        }

        .btn.btn-primary.green:hover {
            background: var(--green-active);
        }


.btn.btn-double-size {
    min-width: 180px;
}

.btn.btn-double-height {
    height: 60px;
}

.btn.btn-double-height p {
     line-height: 20px;
}


.btn.btn-green, .btn.btn-success {
    color: var(--white);
    background: #22B745;
}

    .btn.btn-green:active, .btn.btn-success:active {
        background: #4cac51;
    }

.btn.btn-red, .btn.btn-error {
    color: var(--white);
    background: var(--primary-action-error-color);
}

    .btn.btn-red:active,
    .btn.btn-red:hover,
    .btn.btn-error:active,
    .btn.btn-error:hover {
        color: var(--white);
        background: var(--primary-action-error-color-active);
    }

.no-touch .btn.btn-red:active,
.no-touch .btn.btn-red:hover,
.no-touch .btn.btn-error:active,
.no-touch .btn.btn-error:hover {
    color: var(--white);
    background: var(--primary-action-error-color-active);
}

.btn-link {
    color: var(--secondary-action-color);
    font-size: 15px;
    line-height: 40px;
}

    .btn-link:hover {
        text-decoration: underline;
    }

.btn.btn-transparent {
    color: #3888AD;
    background: transparent;
}

    .btn.btn-transparent:active {
        color: #3888AD;
        background: transparent;
    }

.no-touch .btn.btn-transparent:active {
    color: #3888AD;
    background: transparent;
}

.form.form-center {
    display: flex;
    justify-content: center;
}

.payment-terminal__footer {
    margin-bottom: 20px;
    text-align: center;
}

.payment-terminal-status-icon {
    margin-bottom: 20px;
}

.payment-terminal-error-status {
    color: #ec4a41;
    font-family: 'Roboto Medium';
}

.approval-modal {
    min-height: 460px;
    width: 536px !important;
    background-color: white;
    display: flex;
    flex-direction: column;
}

    .approval-modal .payment-processing-message {
        margin-top: 8px;
    }

        .approval-modal .payment-processing-message .processing-message-title {
            display: block;
            text-align: left;
            padding-left: 30px;
        }

        .approval-modal .payment-processing-message .processing-message-content {
            text-align: left;
            border: 1px solid grey;
            min-height: 80px;
            padding: 10px;
            display: block;
            word-wrap: break-word;
            margin: 10px 30px 0 30px;
        }


.split-add-payment-btn {
    color: #3888AD;
    background: #ecf7fd;
}

.onboarding-submit-btn {
    position: absolute;
    right: 47px;
    bottom: 23px;
    border: 0;
    cursor: pointer;
}


.activation-status {
    font-size: 13px;
}

    .activation-status.pending {
        color: #333333;
    }

    .activation-status.activated {
        color: #22B745;
    }

    .activation-status.action_required {
        color: #F57E20;
    }

    .activation-status.failed {
        color: #F81D1D;
    }

    .activation-status.details {
        text-decoration: underline;
        font-size: 10px;
        color: #26A1DA;
    }