/**
 * Mensajes de validación en español (módulo form-validation.js).
 *
 * Independiente de Bootstrap: los mismos estilos valen para el login,
 * que no carga la librería. El tema oscuro es el predeterminado de la
 * aplicación y el claro se activa con body.light-theme.
 */

.fv-error {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.875rem;
    line-height: 1.35;
    color: #ff8fa3;
    /* tema oscuro (predeterminado): rojo claro sobre fondo oscuro */
}

body.light-theme .fv-error {
    color: #a71d2a;
    /* tema claro: rojo legible sobre fondo blanco */
}

/* Borde del campo con error: vale con y sin Bootstrap */
input.is-invalid,
select.is-invalid,
textarea.is-invalid {
    border-color: #dc3545;
}

input.is-invalid:focus,
select.is-invalid:focus,
textarea.is-invalid:focus {
    border-color: #dc3545;
    box-shadow: none;
}

/* ------------------------------------------------------------------ */
/* Pista dinámica de la contraseña (lista de requisitos en vivo)    */
/* ------------------------------------------------------------------ */

.pw-rules {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
    font-size: 0.875rem;
    line-height: 1.4;
}

.pw-rules li {
    margin: 0.15rem 0;
    color: #94a3b8;
    /* tema oscuro (predeterminado): pendiente */
}

.pw-rules li::before {
    content: "○ ";
}

.pw-rules li.pw-rule-ok {
    color: #4ade80;
    /* cumplido */
}

.pw-rules li.pw-rule-ok::before {
    content: "✓ ";
}

.pw-rules li.pw-rule-ko {
    color: #ff8fa3;
    /* falta: mismo rojo que los errores */
}

.pw-rules li.pw-rule-ko::before {
    content: "✗ ";
}

body.light-theme .pw-rules li {
    color: #64748b;
}

body.light-theme .pw-rules li.pw-rule-ok {
    color: #198754;
}

body.light-theme .pw-rules li.pw-rule-ko {
    color: #a71d2a;
}