/* Agregar a tu archivo CSS */
.password-strength-container {
    margin-top: 10px;
}

.password-strength-bar {
    width: 100%;
    height: 8px;
    background-color: #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 8px;
}

.password-strength-fill {
    height: 100%;
    width: 0%;
    transition: width 0.3s ease, background-color 0.3s ease;
    border-radius: 4px;
}

.password-strength-fill.muy-debil { background-color: #d32f2f; width: 20%; }
.password-strength-fill.debil { background-color: #f57c00; width: 40%; }
.password-strength-fill.media { background-color: #fbc02d; width: 60%; }
.password-strength-fill.fuerte { background-color: #7cb342; width: 80%; }
.password-strength-fill.muy-fuerte { background-color: #388e3c; width: 100%; }

.password-strength-text {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 5px;
}

.password-strength-text.muy-debil { color: #d32f2f; }
.password-strength-text.debil { color: #f57c00; }
.password-strength-text.media { color: #fbc02d; }
.password-strength-text.fuerte { color: #7cb342; }
.password-strength-text.muy-fuerte { color: #388e3c; }

.password-strength-feedback {
    list-style: none;
    padding: 0;
    margin: 5px 0 0 0;
    font-size: 12px;
    color: #666;
}

.password-strength-feedback li {
    padding: 2px 0;
}

.password-strength-feedback li:before {
    content: "• ";
    color: #999;
}