﻿.pwstrength-wrapper,
.pwstrength-inputwrapper {
	position:relative;
}

.pwstrength-togglebutton {
	position:absolute;
	right:0;
	top:50%;
	transform:translateY(-50%);
	padding: 5px 15px;
	cursor: pointer;
	color: inherit;
	&:hover {
		color: inherit;
	}
}

.pwstrength-wrapper:has(input:placeholder-shown) .pwstrength-togglebutton {
	display: none;
}

.pwstrength-rating {
	color:#fff !important;
	padding:5px 10px;
	display:inline-block;
	pointer-events:none;
	margin-top:5px;
}

.pwstrength-rating:empty {
	display:none;
}

.pwstrength-rating-insufficient,
.pwstrength-rating-weak {
	background:red;
}

.pwstrength-rating-good {
	background:orange;
}

.pwstrength-rating-strong {
	background:green;
}

.pwstrength-requirements {
	padding:10px 0;
}
.pwstrength-requirements:empty {
	display:none;
}

.pwstrength-requirement-passed:before {
	content:'✔ ';
	color:green;
}
.pwstrength-requirement-notpassed:before {
	content:'✖ ';
	color:red;
}