body.login svg#imgEye {
    fill: rgba(0,0,0,0.8);
    position: absolute;
    right: 14px;
    top: 14px;
    display: block;
}

body.login input:placeholder-shown ~ svg#imgEye {
    display: none;
}



.login-error, .form-error {
    background-color: rgba(var(--bs-danger-rgb),1) !important;
    color: #fff !important;
    border-radius: 3px;
    padding: 5px 10px;
    margin: 5px;
}

.form-error {
    display:none;
}

.form-error.active {
    display: block;
}

    .center * {
        text-align: center;
    }

.center .form-floating > .form-control ~ label, .center .form-floating > .form-select ~ label {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.center .form-floating > .form-control:focus ~ label,
.center .form-floating > .form-control:not(:placeholder-shown) ~ label,
.center .form-floating > .form-select:focus ~ label,
.center .form-floating > .form-select:not(:placeholder-shown) ~ label {
    opacity: 0.65;
    left: 50%;
    top: 30%;
    transform: scale(0.85) translate(-50%, -50%);
}

.rcpt {
    padding-top:5px;
    display: block;
    background-color: rgba(0,0,0,0.3);
    border-radius: 20px;
    border: solid rgba(255,255,255,0.3) 1px;
    min-height:40px;
}

.center a, .center a:visited {
    display: block;
    /*color: #ffffff;*/
    text-decoration: none;
    margin: 10px;
}
.form-select {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%23000000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>");
}

    .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"], .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"] {
        padding-right: 4.125rem;
        background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='%23000000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>"), url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'><circle cx='6' cy='6' r='4.5' fill='%23ffffff'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/></svg>");
        background-position: right .75rem center,center right 2.25rem;
        background-size: 16px 12px,calc(.75em + .375rem) calc(.75em + .375rem);
    }

.instr {
    padding: 20px 0 10px 0;
}

.instr.title {
    font-size:1.4rem;
}



#qr-code {
    height: 300px;
    width: 300px;
    background-color: #fff;
    border-radius: 20px;
    margin-bottom: 20px;
}



h1 {
    margin-top: 50px;
    text-align: center;
}

.pw-hints {
    margin: 10px 0;
    padding: 0;
}

    .pw-hints li {
        padding: 0 0 0 30px;
        list-style: none;
        background-image: none;
        background-position: 0 0;
        background-size: 20px 20px;
        background-repeat: no-repeat;
    }

        .pw-hints li.active {
            background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'> <circle fill='%23f9f9f9' cx='12' cy='12' r='12' /> <path fill='%2371b471' d='m 17.656855,4.9303133 -2.829809,2.8270462 0.0014,0.00138 -2.829807,2.8270455 0.0014,0.0014 -2.8284657,2.825666 -2.8256652,-2.825665 -2.8298081,2.827046 1.8851579,1.885157 0.9432692,0.94327 1.8851577,1.885158 0.9418885,0.941888 c 0.9422797,-0.942414 1.8860787,-1.886079 2.8284277,-2.828427 0.942279,-0.942414 1.884697,-1.884698 2.827045,-2.827046 0.942741,-0.942874 1.885619,-1.885618 2.828426,-2.828428 0.942742,-0.9428731 1.885621,-1.8856181 2.828428,-2.8284265 z' /> </svg>");
        }

            .pw-hints li.active.error {
                background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'> <circle fill='%23f9f9f9' cx='12' cy='12' r='12' /> <path fill='%23ff8080' d='M 13.997063,4.0012166 V 10.6681 14.001 C 12.663731,14.000763 11.330397,13.9999 9.9970626,13.9999 V 4.0044715 Z' /> <path fill='%23ff8080' d='m 9.9959775,19.999915 h 2.6668115 1.333188 c -9.4e-5,-1.333332 -4.34e-4,-2.666666 -4.34e-4,-4 H 9.9972795 Z' /> </svg>");
                color: #ff8080;
            }

.mflex-row {
    display: flex;
    flex-direction: row;
}

    .mflex-row > *:not(:first-child) {
        padding-left: 10px;
    }