/* ==========================================================================
   DISEÑO MODERNO PARA ALERTAS CENTRADAS (Bootstrap 3.3)
   ========================================================================== */

/* Estilos compartidos para las alertas personalizadas (danger, success, info) */
.alert-danger.text-center,
.alert-success.text-center,
.alert-warning.text-center,
.alert-info.text-center {
    border: none !important;                 /* Quitamos el borde plano nativo */
    border-radius: 12px !important;          /* Bordes más redondeados y elegantes */
    color: #ffffff !important;               /* Texto blanco puro de alta visibilidad */
    padding: 25px 15px !important;           /* Más espacio interno para balancear el icono de 150px */
}

/* Rediseño del botón cerrar (X) para que resalte en blanco sobre los fondos encendidos */
.alert-danger.text-center .close,
.alert-success.text-center .close,
.alert-info.text-center .close {
    color: #ffffff !important;
    opacity: 0.7;
    font-size: 24px;
    text-shadow: none !important;
}

.alert-danger.text-center .close:hover,
.alert-success.text-center .close:hover,
.alert-info.text-center .close:hover {
    opacity: 1;
}




/* ==========================================================================
   VARIACIONES DE COLOR SEGÚN EL "TYPE"
   ========================================================================== */

/* --- TYPE: DANGER (Rojo Vivo Encendido con Sombra/Neón) --- */
.alert-danger.text-center {
    background: linear-gradient(135deg, #ff1e27 0%, #ff4b4b 100%) !important;
    box-shadow: 0 12px 30px rgba(255, 30, 39, 0.45) !important;
}

/* --- TYPE: SUCCESS (Verde Esmeralda Vitalizante) --- */
.alert-success.text-center {
    background: linear-gradient(135deg, #00b074 0%, #00e699 100%) !important;
    box-shadow: 0 12px 30px rgba(0, 176, 116, 0.4) !important;
}



/* --- TYPE: INFO (Azul Eléctrico) --- */
.alert-info.text-center {
    background: linear-gradient(135deg, #007bff 0%, #00c6ff 100%) !important;
    box-shadow: 0 12px 30px rgba(0, 123, 255, 0.4) !important;
}

.alert-warning.text-center {
    background: linear-gradient(135deg, #ff9900 0%, #ff5500 100%) !important;
    box-shadow: 0 12px 30px rgba(255, 85, 0, 0.45) !important;
    
    /* SOLUCIÓN AL COLOR CAFÉ: Forzamos todo el texto e iconos internos a blanco */
    color: #ffffff !important; 
}

.text-center [data-notify="icon"] {
    /* Aplica el relieve y profundidad a todos los iconos por igual */
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.25)) !important; 
}


