/* Estilos mejorados para validación de formularios */

/* Campos con error - Borde rojo más visible y sombra */
.form-control.is-invalid,
.form-icons.is-invalid,
.select-active.is-invalid {
    border-color: #dc3545 !important;
    border-width: 2px !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.15) !important;
    background-color: #fff5f5 !important;
}

/* Focus en campos con error */
.form-control.is-invalid:focus,
.form-icons.is-invalid:focus,
.select-active.is-invalid:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.4rem rgba(220, 53, 69, 0.25) !important;
}

/* Mensajes de error más visibles */
.invalid-feedback,
.text-danger {
    color: #dc3545 !important;
    font-size: 0.875rem;
    margin-top: 0.5rem;
    display: flex;
    align-items: center;
    font-weight: 500;
}

/* Icono de error antes del mensaje */
.invalid-feedback:before {
    content: "⚠ ";
    margin-right: 5px;
    font-size: 1rem;
}

/* Animación shake para campos con error */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }
    20%, 40%, 60%, 80% { transform: translateX(5px); }
}

.shake-error {
    animation: shake 0.5s;
}

/* Campos válidos (opcional - feedback positivo) */
.form-control.is-valid,
.form-icons.is-valid {
    border-color: #28a745 !important;
    border-width: 1px;
    box-shadow: none !important;
}

.form-control.is-valid:focus,
.form-icons.is-valid:focus {
    border-color: #28a745 !important;
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.15) !important;
}

/* Placeholder más visible */
.form-control::placeholder {
    color: #6c757d;
    opacity: 0.7;
    font-style: italic;
}

.form-control:focus::placeholder {
    opacity: 0.5;
}

/* Grupo de formulario con error - margen superior para separación */
.form-group .is-invalid {
    margin-bottom: 0.25rem;
}

/* Resaltar label de campos con error */
.form-group:has(.is-invalid) label {
    color: #dc3545;
    font-weight: 600;
}

/* Tooltip de ayuda para campos con error */
.form-control.is-invalid + .form-text {
    color: #dc3545;
}

/* Alert general de errores en el formulario */
.alert-form-errors {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
    padding: 1rem;
    margin-bottom: 1.5rem;
    border-radius: 0.375rem;
    display: flex;
    align-items: center;
}

.alert-form-errors:before {
    content: "⚠";
    font-size: 1.5rem;
    margin-right: 1rem;
}

/* Mejora para textareas con error */
textarea.is-invalid {
    border-color: #dc3545 !important;
    border-width: 2px !important;
    background-color: #fff5f5 !important;
}

/* Select2 y selectores personalizados con error */
.select2-container--default .select2-selection--single.is-invalid,
.select-style .is-invalid {
    border-color: #dc3545 !important;
    border-width: 2px !important;
}
