/* Estilos personalizados para el chatbot */
.bp-web-widget {
    --bp-primary-color: #444b54;
    --bp-secondary-color: #2f3640;
}

/* Estilo del botón flotante */
.bp-widget-btn {
    border: 3px solid #444b54 !important;
    box-shadow: 0 4px 12px rgba(68, 75, 84, 0.9) !important;
    background-color: white !important;
}

/* Mensaje "Hola! soy Vic!" alrededor del icono */
.bp-widget-btn::after {
    content: "Hola! soy Vic!";
    position: absolute;
    right: 70px;
    top: 50%;
    transform: translateY(-50%);
    white-space: nowrap;
    background-color: white;
    color: #444b54;
    font-weight: bold;
    padding: 6px 12px;
    border-radius: 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    border: 2px solid #444b54;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.bp-widget-btn:hover::after {
    opacity: 1;
}

/* Estilo del contenedor del chat */
.bp-widget-side {
    border-left: 3px solid #444b54 !important;
}

/* Estilo de los mensajes del bot */
.bp-message-bot {
    background-color: #444b54 !important;
    color: white !important;
}

/* Estilo de los botones */
.bp-btn {
    background-color: #444b54 !important;
    border-color: #2f3640 !important;
}

.bp-btn:hover {
    background-color: #2f3640 !important;
}

/* Estilo del encabezado */
.bp-header {
    background-color: #444b54 !important;
    color: white !important;
}