/* Scoped entirely under .clientreg-page: this stylesheet only ever loads on the
   plugin's own public pages (see setup.php's REQUEST_URI-based hook scoping), but
   every selector is still prefixed as a second, independent safeguard so it can
   never bleed into the Brandkit-styled login/lostpassword screens. */

.clientreg-page .clientreg-honeypot {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* --- Password strength meter --- */
.clientreg-page .clientreg-strength-bar {
    height: 6px;
    border-radius: 3px;
    background: #e9ecef;
    overflow: hidden;
}

.clientreg-page .clientreg-strength-bar > span {
    display: block;
    height: 100%;
    width: 0;
    background-color: #d63939;
}

@media (prefers-reduced-motion: no-preference) {
    .clientreg-page .clientreg-strength-bar > span {
        transition: width .2s ease, background-color .2s ease;
    }
}

.clientreg-page .clientreg-strength-text {
    font-size: .8125rem;
    font-weight: 600;
    margin-top: .25rem;
}

.clientreg-page .clientreg-strength-text.weak { color: #d63939; }
.clientreg-page .clientreg-strength-text.medium { color: #f59f00; }
.clientreg-page .clientreg-strength-text.strong { color: #2fb344; }

.clientreg-page .clientreg-requirements {
    list-style: none;
    padding: 0;
    margin: .35rem 0 0;
    font-size: .8125rem;
}

.clientreg-page .clientreg-requirements li {
    color: #d63939;
}

.clientreg-page .clientreg-requirements li.met {
    color: #2fb344;
}

.clientreg-page .clientreg-requirements li::before {
    content: "✕ ";
}

.clientreg-page .clientreg-requirements li.met::before {
    content: "✓ ";
}

.clientreg-page .clientreg-match-text {
    font-size: .8125rem;
}

.clientreg-page .clientreg-match-text.match { color: #2fb344; }
.clientreg-page .clientreg-match-text.mismatch { color: #d63939; }

.clientreg-page .form-check-label a {
    text-decoration: underline;
}

.clientreg-page .alert ul {
    list-style: disc;
}

@media (max-width: 576px) {
    .clientreg-page .form-control {
        font-size: 1rem;
    }
}