#form-wrapper { position: relative; clear: both; display: inline-block; }

#form-overlay { 
    display: none; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    z-index: 10; 
    align-items: center; 
    justify-content: center; 
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

#overlay-output, 
#overlay-loading {
    line-height: 1;
    flex-direction: column; 
    align-items: center; 
    justify-content: center; 
    text-align: center;
    width: calc(100% - 20px);
    max-width: 360px; 
    max-height: 140px; 
    padding: 20px;
    border-radius: 4px; 
}

#overlay-loading .loading { margin-bottom: 15px; font-weight: 600; }
#overlay-loading svg { width: 40px; height: 40px; margin-bottom: 10px; }

.output-header { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 5px;}
#output-title { margin: 0; font-size: 1.6em; font-weight: 700; color: inherit; }
#output-text { margin: 0; font-size: 1rem; line-height: 1.4; }
#output-icon svg { width: 28px; height: 28px; display: block; stroke: currentColor; stroke-width: 0.5; transform: translateY(-2px); }

/* --- MODOS: Aplicados al cartel central --- */

/* ÉXITO */
#form-overlay.success-mode #overlay-output { background-color: #d1e7dd !important; border: 1px solid #2e7d32 !important; }
#form-overlay.success-mode .output-header, #form-overlay.success-mode #output-title { color: #2e7d32 !important; } 
#form-overlay.success-mode #output-text { color: #0a3622 !important; }

/* ATENCIÓN */
#form-overlay.alert-mode #overlay-output { background-color: #fff3cd !important; border: 1px solid #ef6c00 !important; }
#form-overlay.alert-mode .output-header, #form-overlay.alert-mode #output-title { color: #ef6c00 !important; }
#form-overlay.alert-mode #output-text { color: #443402 !important; }

/* ERROR */
#form-overlay.error-mode #overlay-output { background-color: #f8d7da !important; border: 1px solid #c62828 !important; }
#form-overlay.error-mode .output-header, #form-overlay.error-mode #output-title { color: #c62828 !important; }
#form-overlay.error-mode #output-text { color: #58151c !important; }

.hp-field { display: none !important; }