/* Set the body background with your uploaded robot image */
body {
    background-image: url('https://raw.githubusercontent.com/Chatbots-automated/Voiceflow-test/refs/heads/Main/human-robot-hands-reaching-out-each-other-black-background-technology-meets-humanity-background-modern-human-hand-catching-robot-hand-ai-generated_538213-7843.avif'); /* Background image */
    background-size: cover; /* Ensures the image covers the whole background */
    background-position: center; /* Centers the image */
    background-repeat: no-repeat; /* Prevents the image from repeating */
    color: #ffffff; /* Set default text color to white for visibility */
}

/* Red Theme Chatbot CSS */

/* Customize the page that the chat bubble lives on */
.voiceflow-chat {
    background-color: #330000; /* Dark red background color */
    color: #ffffff; /* Light text color */
}

/* Launcher Button */
.voiceflow-chat .vfrc-launcher {
    background-color: #660000; /* Darker red button */
    border-color: #ff4d4d; /* Lighter red border */
}

/* Chat Widget Header */
.voiceflow-chat .vfrc-header {
    background-color: #330000; /* Dark red header */
    color: #ffffff; /* White text */
}
.voiceflow-chat .vfrc-assistant-info--title {
    color: #ff4d4d; /* Light red title */
}
.voiceflow-chat .vfrc-assistant-info--description {
    color: #ffcccc; /* Very light red description */
}

/* Chat Messages */
.voiceflow-chat .vfrc-system-response .vfrc-message {
    background-color: #660000; /* Darker red for assistant messages */
    color: #ffffff; /* White text */
}

.voiceflow-chat .vfrc-user-response .vfrc-message {
    background-color: #ff4d4d; /* Light red for user messages */
    color: #ffffff; /* White text */
}

/* Message Input */
.voiceflow-chat .vfrc-input {
    background-color: #660000; /* Darker red for input area */
    color: #ffffff; /* White text */
    border-color: #ff4d4d; /* Light red border */
}

/* Timestamps and Metadata */
.voiceflow-chat .vfrc-timestamp {
    color: #ffcccc; /* Very light red for timestamps */
}