/* Add custom CSS to modify your agent's appearance across all environments */
.scroll-container {
  overflow: hidden !important;
}

/* Change the size of the window of your chatbot */
#vg-mother-container {
  width: 400px !important; 
  height: 600px !important; 
}

/* Target the inner container if needed */
#vg-inner-container {
  width: 100% !important; 
  height: 100% !important;
}

/* Position the agent bubble on the page (Adjust values to reposition as needed.)*/
.vg-root {
  bottom: 20px !important;
  right: 20px !important;
}

/* Adjust the size of the overlay */
.vg-overlay-root-container {
  width: 450px !important; 
  height: 650px !important; 
}

/* Add extra padding to widget controls */
.vg-widget-controls-container {
  padding-bottom: 200px !important
}

/* Uncomment for automatic aspect ratio on images */
/* .vg-card-image {
    aspect-ratio: auto !important;
} */

/* Hide proactive popup messages */
.vg-proactive-message--container {
  display: none !important;
}

.vg-proactive-message {
  display: none !important;
}

/* Customize the action button style. */
.vg-action-btn {
  background-color: #0078d7 !important;
  color: white !important;
  font-size: 16px !important;
  font-family: 'Roboto', sans-serif !important;
}

/* Display the “open vapi” footer button. */
.vg-footer-open-vapi {
  display: block !important;
}

/* Hide the “open vapi” footer button. */
.vg-footer-open-vapi {
  display: none !important;
}

/*  Turn off the ratings at the end */
.vg-chat-end {
  display: none !important;
}