/* Formulario condensado - Sin espacios innecesarios */
.du-formulario-container{max-width:500px;margin:0 auto;padding:15px;background:#fff;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,0.1);}
.du-mensaje{padding:10px;margin-bottom:15px;border-radius:4px;font-size:13px;}
.du-exito{background:#d4edda;color:#155724;border:1px solid #c3e6cb;}
.du-error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb;}
.du-formulario .du-campo{margin-bottom:12px;}
.du-formulario label{display:block;margin-bottom:4px;font-weight:600;color:#333;font-size:13px;}
.du-formulario input[type="text"],
.du-formulario input[type="email"],
.du-formulario textarea,
.du-formulario input[type="file"]{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px;font-size:13px;box-sizing:border-box;}
.du-formulario input:focus,
.du-formulario textarea:focus{border-color:#0073aa;outline:none;box-shadow:0 0 0 2px rgba(0,115,170,0.1);}
.du-formulario textarea{resize:vertical;min-height:80px;font-family:inherit;}
.du-descripcion{font-size:11px;color:#666;margin-top:3px;}
.du-contador{font-size:11px;color:#666;text-align:right;margin-top:3px;}
.du-vista-previa{margin-top:8px;}
.du-vista-previa img{max-width:120px;max-height:120px;border-radius:3px;border:1px solid #ddd;padding:3px;background:#f9f9f9;}
.du-boton{background:#0073aa;color:white;border:none;padding:10px 25px;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:background 0.2s;width:100%;margin-top:5px;}
.du-boton:hover{background:#005a87;}
.du-boton:disabled{background:#ccc;cursor:not-allowed;}
.du-spinner:after{content:"";display:inline-block;width:14px;height:14px;margin-left:6px;border:2px solid rgba(255,255,255,0.3);border-radius:50%;border-top-color:#fff;animation:du-spin 1s ease-in-out infinite;}
@keyframes du-spin{to{transform:rotate(360deg);}}
/* Estados de validación */
.du-campo-error label{color:#dc3232;}
.du-campo-error input,
.du-campo-error textarea{border-color:#dc3232!important;background-color:#fff8f8;}
.du-mensaje-error{color:#dc3232;font-size:11px;margin-top:3px;padding:4px;background-color:#fff8f8;border-radius:2px;border-left:2px solid #dc3232;}
.du-error-texto{color:#dc3232!important;font-weight:bold;}
.du-advertencia-texto{color:#ff9800!important;}
/* Estilos para el botón de eliminar imagen */
.du-eliminar-imagen{position:absolute;top:-8px;right:-8px;background:#dc3232;color:white;border:none;border-radius:50%;width:20px;height:20px;font-size:12px;cursor:pointer;line-height:1;padding:0;}
.du-eliminar-imagen:hover{background:#a00;}
/* Responsive */
@media (max-width:600px){
.du-formulario-container{padding:12px;margin:0 10px;}
.du-formulario input[type="text"],
.du-formulario input[type="email"],
.du-formulario textarea{padding:7px;font-size:12px;}
.du-boton{padding:9px 20px;font-size:13px;}
}

/* Clases para validación JS */
.du-campo-error input,
.du-campo-error textarea {
    border-color: #dc3545 !important;
    background-color: #fff8f8;
}

.du-mensaje-error {
    color: #dc3545;
    font-size: 11px;
    margin-top: 2px;
}

.du-error-texto {
    color: #dc3545;
    font-weight: bold;
}

.du-advertencia-texto {
    color: #ff9800;
}

.du-contenedor-previa {
    position: relative;
    display: inline-block;
    margin-top: 5px;
}

.du-imagen-previa {
    max-width: 100px;
    max-height: 100px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

.du-eliminar-imagen {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #dc3545;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
    padding: 0;
}