.mwai-chatgpt-theme .mwai-reply.mwai-ai {
  background: #ffffff;
  margin-left: 7px;
  margin-right: 7px;
  border-radius: 8px !important;
  background-color: #fff !important;
  border-radius: 8px;
  box-shadow: 0px 0.3px 0.9px rgb(48 44 44 / 27%), 0px 1.6px 3.6px rgb(0 0 0 / 3%) !important;
}

.chat-popup.maximized .mwai-conversation {
flex: auto;
max-height: none;
}


.mwai-chatbot {
height: 100%;
}

@media (max-width: 760px) {
.chat-popup.maximized .mwai-chatgpt-theme .mwai-input {
  margin-bottom: 24px !important;
}
}

.mwai-conversation {
overflow-y: auto;
}

.mwai-chatgpt-theme .mwai-input .mwai-input-text {
 box-shadow: 0px 0.3px 0.9px rgb(48 44 44 / 27%), 0px 1.6px 3.6px rgb(0 0 0 / 3%) !important;
  background-color: #fff !important;
}


@media only screen and (min-width: 981px) {
.chat-popup.maximized .sidenav	{
left: 0px !important;
}
}

@media only screen and (max-width: 780px) {
.chat-content {
  padding: 0px !important;
}
.chat-popup.maximized .mwai-conversation {
  max-height: 100% !important;
}	
}

.tablinks.disabled {
  pointer-events: none;
}
.sidenav {
 width: 230px;
 /*-webkit-transition: width .35s ease-in-out;
 transition: width .50s ease-in-out;*/
transition-timing-function: ease;
}


.chat-popup {
display: none;
overflow: hidden;
  position: fixed;
  bottom: 10px;
  right: 30px;
  width: 430px;
  min-height: 290px;
  background-color: #edf5f9;
 border-radius: 8px;
  z-index: 99999999999999;
box-shadow: 0 0 1px rgba(0, 0, 0, .08), 0 4px 12px rgba(0, 0, 0, .2);
}

.chat-popup.maximized {
  background-color: #ffffff;
}

.maximize-btn {
  margin-left: auto; 
}

.close-btn {
 margin-left: 24px;
}


.chat-title {
  font-weight: bold;
}

.chat-content {
  padding: 10px;
}

.mwai-content {
  border-top-right-radius: 0px !important;
  border-top-left-radius: 0px !important;
box-shadow: none;
}

/* Material Design Sidenav */
.sidenav {
/*width: 0px;*/
  height: calc(100% - 0px); /* Adjust the height to accommodate the chat-header */
  position: absolute; /* Position it relative to the chat-popup */
  z-index: 9998;
  left: -230px;
top: 0;
  background-color: #fff;
  overflow-x: hidden;
  /*transition: width 0.1s ease;*/ /* Smooth transition for opening */
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
border-radius: 8px;
}


.chat-popup.minimized .sidenav {
  transition: none; /* Disable transition when chat-popup is minimized */
}


.sidenav a {
  padding: 16px 16px;
  text-decoration: none;
  font-size: 16px;
  color: #000;
  display: block;
  transition: background-color 0.3s;
}

.sidenav a:hover {
  background-color: #f0f0f0;
}

.sidenav .closebtn {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 24px;
  color: #000;
cursor: pointer;
}

/* Material Design for active tab */
.tablinks.active {
  background-color: #e0e0e0;
}

/* Updated Material Design CSS for vertical tabs */
.vertical-tabs .tablinks {
  width: 90%;
  text-align: left;
margin-left: 10px;
  border-radius: 10px;
  padding: 8px 16px;
margin-top: 5px;
  border: none;
  background-color: #fff;
  cursor: pointer;
  transition: background-color 0.3s;
}

.vertical-tabs .tablinks:hover {
  background-color: #f0f0f0;
}

.lndjoRWjp3ye2x5XZ29y .smw5eGNuW8ar3Rq6KsU5 {
    min-height: 20vh !important;
}




/* Other styles */
.maximize-btn, .close-btn {
  cursor: pointer;
}

/* Chat Popup Maximized */
.chat-popup.maximized {
  width: 95%;
  height: 100%;
  top: 12%;
  margin: 0 auto;
left: 0;
right: 0;
 max-height: 78%;
}

.chat-popup.maximized .chat-header {
background-color: #fff;
  border-top-right-radius: 10px;
border-top-left-radius: 10px;
}

.chat-popup.maximized .chat-content {
  height: calc(100% - 31px); /* Adjust height to accommodate chat header */
width: 77%;
float: right;
background-color: #edf5f8;
}


.show-chatbot {
  display: block !important; /* Override any previous 'display: none' setting */
}



/* Updated CSS for vertical tabs */
.vertical-tabs {
  display: flex;
  flex-direction: column;
}



.vertical-tabs .tablinks:hover {
  background-color: #f2f2f2;
}

/* Add CSS for active tab and hide inactive tabs */
.tabcontent {
  display: none;
}

.tabcontent.active {
  display: block;
}

.tablinks.active {
  background-color: #ddd;
}

/*** Other Custom CSS ***/

.chat-content .yAdyblrtoeLBR0jQpw50 .mwCGHr8abHQqvLOrnOHj {
  display: block;
}

.chat-content .yAdyblrtoeLBR0jQpw50 .mwCGHr8abHQqvLOrnOHj button {
margin-top: 10px;
float: right;
}


/**Maximize button icon**/
.maximize-btn:before {
height: 12px;
  width: 12px;
  transition: all 0.2s ease-out;
  content: ' ';
  cursor: pointer;
  position: absolute;
  border: 1px solid #000;
 
}

.chat-popup .chat-header .maximize-btn {
   display: flex;
  justify-content: center;
  align-items: center;
}

.maximize-btn:hover:before {
  width: 16px;
  height: 16px;
}

/** Header Close button ***/
.close-btn:after {
height: 18px;
content: ' ';
  cursor: pointer;
  position: absolute;
  width: 1px;
  background-color: #000;
      transition: all 0.2s ease-out;
  transform: translate(16px, 5px) rotate(-45deg);
}

.close-btn:before {
height: 18px;
content: ' ';
  cursor: pointer;
  position: absolute;
  width: 1px;
  background-color: #000;
      transition: all 0.2s ease-out;
     transform: translate(16px, 5px) rotate(45deg);
}

.close-btn:hover:before {
  background-color: #fff;
  opacity: 1;
  transform: translate(16px, 5px) rotate(135deg);
}

.close-btn:hover:after {
  background-color: #fff;
      opacity: 1;
  transform: translate(16px, 5px) rotate(45deg);
}

.close-btn:hover {
  background-color: #c32921;

}

.chat-popup .chat-header .close-btn {
  height: 27px;
  width: 33px;
}




.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 85%);
  display: none;
  z-index: 9998;
}

.overlay.active {
  display: block;
}

/***Other**/

@media only screen and (min-width: 781px) {
.chat-popup.maximized .tabcontent, .chat-popup.maximized .mwai-chatbot-container, .chat-popup.maximized .mwai-chat, .chat-popup.maximized .mwai-content {
height: 100%;
    box-shadow: none !important;
}

.chat-popup.maximized .mwai-input {
background-color: #edf5f8;
margin-bottom: 24px;
}

.chat-popup.maximized .mwai-content {
  border-radius: 0px;
    border-bottom-right-radius: 10px;
}	

.chat-popup.maximized .mwai-conversation {
   flex: auto;
  max-height: none;
}

.chat-content {
padding: 0px;
}

.chat-popup.maximized .closebtn {
  display: none;
}
}

.mwai-conversation {
  max-height: 380px;
margin-top: 10px;
  min-height: 160px;
}

.tablinks {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.tablinks img {
  margin-right: 8px; 
  width: 30px;
}

/*** Mobile Responsive***/
@media (max-width: 768px) {
.chat-popup {
right: 7px;
width: calc(100% - 14px);
}
}

/**Dark Mode**/

  html[data-user-theme="dark"] .sidenav {
  background: #313436;
  }
  
  html[data-user-theme="dark"] .line {
    background-color: #fff;
  }
  
  html[data-user-theme="dark"] .vertical-tabs .tablinks {
    background: #313436;
        color: #fff;
  }
  
  html[data-user-theme="dark"] .tablinks.active {
    background: #4e5254;
  }
  
  html[data-user-theme="dark"] .vertical-tabs .tablinks:hover {
      background-color: #2c2c2c;
  }
  
  html[data-user-theme="dark"] .chat-popup.maximized .mwai-input {
    background-color: #2c2c2c;
  }
  
  html[data-user-theme="dark"] .chat-popup {
    background-color: #313436;
  }
  
  html[data-user-theme="dark"] .maximize-btn:before {
        border: 1px solid #fff;
  }
  
  html[data-user-theme="dark"] .close-btn:before {
        background-color: #fff;
  }
  
  html[data-user-theme="dark"] .close-btn:after {
        background-color: #fff;
  }
  
  
  /**blue mode**/
  html[data-user-theme="blue"] .sidenav {
  background: #293644;
  }
  
  html[data-user-theme="blue"] .chat-header {
    background-color: #293644 !important;
  }
  
  html[data-user-theme="blue"] .vertical-tabs .tablinks {
    background: #353b43;
        color: #fff;
  }
  
  html[data-user-theme="blue"] .tablinks.active {
    background: #2d5474;
  }
  
  html[data-user-theme="blue"] .vertical-tabs .tablinks:hover {
      background-color: #24435d;
  }
  
  
 html[data-user-theme="blue"] .chat-popup {
  background: #293644;
}
   
  html[data-user-theme="blue"] .maximize-btn:before {
        border: 1px solid #fff;
  }
  
  html[data-user-theme="blue"] .close-btn:before {
        background-color: #fff;
  }
  
  html[data-user-theme="blue"] .close-btn:after {
        background-color: #fff;
  }
  
  html[data-user-theme="blue"] .line {
    background-color: #fff;
  }
  



@media only screen and (max-width: 1140px) {
.chat-popup.maximized .chat-content {
width: 100%;
float: none;
}
.chat-popup.maximized.td-container {
padding: 0px !important;
}	
.chat-popup.maximized {
width: 100%;
top: 0%;
max-height: 100%;
}
.chat-popup.maximized .tabcontent, .chat-popup.maximized .mwai-chatbot-container, .chat-popup.maximized .mwai-chat, .chat-popup.maximized .mwai-content {
height: 100%;
}	
}	



/** Additional CSS**/

.chat-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 2px 6px 2px 6px;
background-color: #edf5f9;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}


.model-selector-menu.maximized-view:before {
content: "SELECT MODEL";
  display: block;
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #222;
  margin-top: -18px;
}


.model-selector {
position: relative;
}

.model-selector-toggle {
display: flex;
align-items: center;
gap: 8px;
background: none;
border: none;
cursor: pointer;
padding: 8px 12px;
font-size: 14px;
border-radius: 6px;
transition: background-color 0.2s;
}

.model-selector-toggle:hover {
background-color: rgba(0, 0, 0, 0.05);
}

.model-selector-toggle img {
width: 24px;
height: 24px;
object-fit: contain;
}

.chevron-icon {
width: 10px;
height: 10px;
border-style: solid;
border-width: 0 2px 2px 0;
display: inline-block;
padding: 2px;
transform: rotate(45deg);
transition: transform 0.2s;
margin-top: -3px;
}

.model-selector-toggle.open .chevron-icon {
transform: rotate(-135deg);
margin-top: 6px;
}

.chat-popup.maximized .model-selector-menu.maximized-view {
background-color: transparent;
}


.model-selector-menu {
display: none;
position: absolute;
top: 100%;
left: 0;
min-width: 200px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
border-radius: 8px;
padding: 4px;
margin-top: 4px;
z-index: 1000;
background-color: #fff;
}

.model-selector-menu.show {
display: block;
}

.model-selector-item {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 12px;
text-decoration: none;
color: inherit;
border-radius: 4px;
transition: background-color 0.2s;
}

.model-selector-item:hover {
background-color: rgba(0, 0, 0, 0.05);
}

.model-selector-item img {
width: 24px;
height: 24px;
object-fit: contain;
}

.pro-badge {
background-color: #ffd700;
color: #000;
padding: 2px 6px;
border-radius: 4px;
font-size: 11px;
font-weight: 500;
margin-left: auto;
}

.maximize-btn,
.close-btn {
cursor: pointer;
}


.model-selector-toggle:hover {
background-color: rgba(0, 0, 0, 0.05);
}


.model-selector-item {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 12px;
width: 100%;
text-align: left;
background: none;
border: none;
color: inherit;
font-size: inherit;
cursor: pointer;
border-radius: 4px;
transition: background-color 0.2s;
}

.model-selector-item:hover {
background-color: rgba(0, 0, 0, 0.05);
}

.model-selector-item:focus {
outline: 2px solid #269bce;
outline-offset: -2px;
}

.model-selector-item.active {
background-color: rgba(0, 0, 0, 0.05);
font-weight: 500;
}


@media (min-width: 1141px) {
.model-selector-menu.maximized-view {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 250px;
  margin: 0;
  padding: 12px;
  border-radius: 0;
  box-shadow: none;
}

.chat-popup.maximized {
  height: 80vh;
  top: 10vh;
  border-radius: 12px;
}


.chat-popup.maximized .chat-header {
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  height: 55px;
}


.chat-popup.maximized .mwai-input {
  padding: 16px 24px;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
  margin-bottom: 24px;
}

.model-selector-menu.maximized-view .model-selector-item {
  padding: 12px;
  margin-bottom: 4px;
  border-radius: 8px;
  background-color: #edf5fa;
}

.model-selector-menu.maximized-view .model-selector-item.active {
  background-color: rgba(0, 0, 0, 0.05);
}

.chat-popup.maximized .model-selector-toggle {
  display: none;
}

.model-selector-menu.maximized-view .model-selector-item:hover {
  background-color: rgba(0, 0, 0, 0.08);
}
}

.model-selector-item {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 12px;
text-decoration: none;
color: inherit;
border-radius: 4px;
transition: background-color 0.2s;
cursor: pointer;
}

.model-selector-item.active {
background-color: rgba(0, 0, 0, 0.05);
}

.model-selector-item:hover {
background-color: rgba(0, 0, 0, 0.05);
}




html[data-user-theme="blue"] .model-selector-menu.maximized-view:before {
 color: #ebebeb;
}


html[data-user-theme="blue"] .chevron-icon {
color: #ebebeb;
}

html[data-user-theme="blue"] span.model-name {
 color: #ebebeb;
}

html[data-user-theme="blue"] .chat-popup.maximized .mwai-input {
background-color: #293644;
}

html[data-user-theme="blue"] .chat-popup.maximized .chat-header {  
border-bottom: 1px solid #3f4f61;
  }

html[data-user-theme="blue"] .model-selector-item {
  color: #fff;
}

html[data-user-theme="blue"] .model-selector-menu.maximized-view .model-selector-item {
background-color: #3e4a57;
}

html[data-user-theme="blue"] .model-selector-menu.maximized-view .model-selector-item.active {
background-color: #4f5a66;
border: 1px solid #636d78;
}

html[data-user-theme="blue"] .model-selector-menu.maximized-view .model-selector-item:hover {
background-color: #4f5a66;
}

html[data-user-theme="blue"] .model-selector-menu {
  background-color: #293644;
}

html[data-user-theme="blue"] .model-selector-item:hover {
  background-color: #3b4855;
}

html[data-user-theme="blue"] .model-selector-item.active {
  background-color: #3b4855;
      border: 1px solid #269bce;
}


/** Dark Mode**/

html[data-user-theme="dark"] .model-selector-menu.maximized-view:before {
 color: #e5e5e5;
}

html[data-user-theme="dark"] .chevron-icon {
color: #e5e5e5;
} 

html[data-user-theme="dark"] span.model-name {
 color: #e5e5e5;
}

html[data-user-theme="blue"] .chat-popup.maximized .mwai-input {
background-color: #293644;
}

html[data-user-theme="dark"] .chat-popup.maximized .chat-header {  
border-bottom: 1px solid #46484a;
  }

html[data-user-theme="dark"] .model-selector-item {
  color: #e5e5e5;
}

html[data-user-theme="dark"] .model-selector-menu.maximized-view .model-selector-item {
background-color: #46484a;
}

html[data-user-theme="dark"] .model-selector-menu.maximized-view .model-selector-item.active {
background-color: #5a5d5e
}

html[data-user-theme="dark"] .model-selector-menu.maximized-view .model-selector-item:hover {
background-color: #5a5d5e;
}

html[data-user-theme="dark"] .model-selector-menu {
background-color: #313436;
}

html[data-user-theme="dark"] .model-selector-item:hover {
background-color: #434647;
}

html[data-user-theme="dark"] .model-selector-item.active {
background-color: #5a5d5e;
}


/**New**/

html[data-user-theme="blue"] .mwai-chatgpt-theme .mwai-content {
background: #293644 !important;
}

html[data-user-theme="blue"] .mwai-chatgpt-theme .mwai-reply.mwai-ai {
background: #3a4a61 !important;
}

html[data-user-theme="blue"] .mwai-chatgpt-theme .mwai-reply .mwai-text > *:last-child {
  color: white !important;
}

html[data-user-theme="blue"] .mwai-chatgpt-theme .mwai-reply.mwai-user {
  background: #293644;
}

html[data-user-theme="blue"] .mwai-chatgpt-theme .mwai-input {
  border-top: 1px solid #334253;
}


html[data-user-theme="blue"] .mwai-chatgpt-theme .mwai-input .mwai-input-text {
  background-color: #3b4855 !important;
}

html[data-user-theme="blue"] .mwai-chatgpt-theme .mwai-input .mwai-input-text textarea {
color: #fff !important;  
}


html[data-user-theme="blue"] .mwai-chatgpt-theme .mwai-input .mwai-input-text textarea::placeholder {
  color: #ffffff;
}

html[data-user-theme="blue"] .chat-popup.maximized .chat-content {
background-color: #293644; 
}


/* Dark Theme*/

html[data-user-theme="dark"] .mwai-chatgpt-theme .mwai-content {
background: #313436 !important;
}

html[data-user-theme="dark"] .mwai-chatgpt-theme .mwai-reply.mwai-ai {
background: #55585a !important;
}

html[data-user-theme="dark"] .chat-header {
background-color: #313436 !important; 
}

html[data-user-theme="dark"] .mwai-chatgpt-theme .mwai-reply .mwai-text > *:last-child {
  color: white !important;
}

html[data-user-theme="dark"] .mwai-chatgpt-theme .mwai-reply.mwai-user {
  background: #313436;
}

html[data-user-theme="dark"] .mwai-chatgpt-theme .mwai-input {
  border-top: 1px solid #55585a;
}


html[data-user-theme="dark"] .mwai-chatgpt-theme .mwai-input .mwai-input-text {
  background-color: #434647 !important;
}

html[data-user-theme="dark"] .mwai-chatgpt-theme .mwai-input .mwai-input-text textarea {
color: #fff !important;  
}


html[data-user-theme="dark"] .mwai-chatgpt-theme .mwai-input .mwai-input-text textarea::placeholder {
  color: #ffffff;
}

html[data-user-theme="dark"] .chat-popup.maximized .chat-content {
background-color: #313436; 
}