/* ==========================================================================
   geo-pwstrength.css — the live password-strength meter (geo_password_strength.js),
   loaded by templates/includes/_password_strength.html on the four pages that set
   a new password. Self-contained: the pages around it use different stylesheets.
   The level is always a WORD + an icon, never the colour alone.
   ========================================================================== */
.geo-pwstrength {
	--pw-level: #98a6b5;
	margin: -4px 0 12px; font-size: 12px; line-height: 1.35; text-align: left;
	font-family: var(--geo-font-body, inherit); font-variant-numeric: lining-nums;
}
.geo-pwstrength.is-weak { --pw-level: #c62828; }
.geo-pwstrength.is-fair { --pw-level: #b06a00; }
.geo-pwstrength.is-good { --pw-level: #2e8a57; }
.geo-pwstrength.is-strong { --pw-level: #17703f; }

.geo-pwstrength-meter { display: flex; align-items: center; gap: 10px; min-height: 18px; }
.geo-pwstrength-bar { flex: 1; max-width: 240px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3px; }
.geo-pwstrength-bar span { height: 5px; border-radius: 3px; background: #e3e8ee; }
.geo-pwstrength-bar span.is-on { background: var(--pw-level); }
.geo-pwstrength-label { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; color: var(--pw-level); white-space: nowrap; }

.geo-pwstrength-rules { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; color: #6b7a8a; }
.geo-pwstrength-rules li { display: flex; align-items: baseline; gap: 6px; }
.geo-pwstrength-rules li .bi { flex: none; font-size: 11px; color: #a9b5c2; }
.geo-pwstrength-rules li.is-ok { color: #1a6f40; }
.geo-pwstrength-rules li.is-ok .bi { color: #1a9e5f; }
.geo-pwstrength-rules li.is-bad { color: #b42323; }
.geo-pwstrength-rules li.is-bad .bi { color: #c62828; }