﻿.jq-password-validator__popover {
    background: #fff;
    border-radius: 3px;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    color: #4E44A6;
    padding: 1.5rem;
    transition: all 0.2s;
}

    .jq-password-validator__popover header {
        font-weight: normal;
        margin-bottom: 0.5rem;
    }

.is-valid {
    color: #4E44A6;
}

.jq-password-validator__rule.is-valid .jq-password-validator__checkmark {
    transform: scale(1);
    visibility: visible;
}

.jq-password-validator__checkmark {
    height: 1em;
    fill: #111111;
    margin-right: 0.5em;
    transition: all 0.5s;
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
    width: 1em;
}

.jq-password-validator__checkmark {
    fill: #44A64D;
}

.jq-password-validator__popover {
    background: white;
    border-radius: 3px;
    box-sizing: border-box;
    color: #111111;
    left: 0;
    opacity: 0;
    margin-top: 0.5rem;
    padding: 1rem;
    position: relative;
    right: 0;
    text-align: left;
    transition: all 0.5s;
    z-index: 999;
}

.jq-password-validator {
    position: relative;
}

    .jq-password-validator.is-hidden .jq-password-validator__popover {
        opacity: 0;
    }

    .jq-password-validator.is-visible .jq-password-validator__popover {
        opacity: 1;
    }

.jq-password-validator__checkmark {
    height: 1em;
    margin-right: 0.5em;
    transition: all 0.5s;
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
    width: 1em;
}

.jq-password-validator__rule {
    overflow: hidden;
}

    .jq-password-validator__rule.is-invalid .jq-password-validator__checkmark {
        transform: scale(0);
        visibility: hidden;
    }

    .jq-password-validator__rule.is-valid .jq-password-validator__checkmark {
        transform: scale(1);
        visibility: visible;
    }
