#chatbot-sidebar {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 320px; /* Adjusted for more width */
    transition: width 0.3s ease;
    background-color: #ffffff; /* White background for a modern look */
    border: 1px solid #ddd;
    border-radius: 15px; /* Rounded corners */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    overflow: hidden;
}
@media only screen and (min-width: 1000px){
    #chatbot-sidebar {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 320px; /* Adjusted for more width */
    transition: width 0.3s ease;
    background-color: #ffffff; /* White background for a modern look */
    border: 1px solid #ddd;
    border-radius: 15px; /* Rounded corners */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    overflow: hidden;
    z-index:99;
}  
}
#chatbot-sidebar.expanded {
    width: 500px; /* Expanded width */
}

#chatbot-header {
    background-color: #007bff;
    color: #fff;
    padding: 10px;
    text-align: center;
    font-weight: bold;
}

#chatbot-body {
    padding: 10px;
}

#chat-window {
    max-height: 350px; /* Increased for better display */
    overflow-y: auto;
    padding: 15px;
    background-color: #f5f7fa; /* Light grey background */
}
.bot-message {
    background-color: #e3f2fd; /* Light blue for bot messages */
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 8px;
    font-weight: bold;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1); /* Slight shadow */
}
.user-message {
    background-color: #ffffff; /* Change to white */
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 8px;
    text-align: right;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1); /* Slight shadow */
}
/* 
#chat-container {

z-index: 9999; 
position: fixed;
bottom: 20px;
right: 20px;
width: 300px;
background: white;
border: 1px solid #ccc;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
} */

#chat-container {
position: fixed;
bottom: 20px;
right: 20px;
width: 300px;
height: 400px;
border: 1px solid #ccc;
background-color: white;
z-index: 1000;
}
/*
#chat-container.enlarged {
    width: 400px;
    height: 600px;
} */

#chat-container.enlarged {
width: 500px;
height: 600px;
}


#user-input {
    width: calc(100% - 20px);
    margin: 10px;
    padding: 8px;
    border-radius: 10px;
    border: 1px solid #ccc;
    outline: none;
    box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.1); /* Subtle inset shadow */
}



button:hover {
    background-color: #0056b3; /* Darker blue on hover */
}

#summary-section {
    padding: 10px;
    background-color: #f1f1f1;
    border-top: 1px solid #ccc;
    border-radius: 0 0 10px 10px;
}

#summary-section h4 {
    margin-top: 0;
}

#summary-section input {
    width: 100%;
    padding: 8px;
    margin-bottom: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

#chat-controls {
display: flex;
justify-content: space-between;
background-color: #f5f5f5;
padding: 5px;
}

#chat-window {
height: calc(100% - 30px);
overflow-y: auto;
padding: 10px;
}

#chatbot-container {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 1000;
}

#chatbot-icon {
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 50px;
background-color: #ff9933;
color: #fff;
border-radius: 50%;
cursor: pointer;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
font-size: 24px;
}

#chatbot-sidebar {
display: none; /* Hidden by default */
position: fixed;
bottom: 80px;
right: 20px;
width: 300px;
background-color: #f9f9f9;
border-radius: 15px;
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
}

#chatbot-header {
background-color: #ff9933;
color: #fff;
padding: 15px;
border-radius: 15px 15px 0 0;
}

#chatbot-body {
padding: 15px;
}


#send-button {
background-color: #ff9933;
color: white;
border: none;
padding: 8px 15px;
border-radius: 15px;
cursor: pointer;
font-weight: bold;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
}

/* Small screen adjustments */
@media screen and (min-width: 768px) {
#chatbot-sidebar {
  
    right: 5%; /* Centered horizontally */
    
}


}
#chatbot-close {
background-color: red;
color: white;
border: none;
padding: 8px 15px;
border-radius: 15px;
cursor: pointer;
font-weight: bold;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
}