.rag-chatbot-container {
position: fixed;
bottom: 20px;
right: 20px;
width: 380px;
max-width: calc(100vw - 40px);
height: 600px;
max-height: calc(100vh - 40px);
background: #ffffff;
border-radius: 8px;
box-shadow: 0 2px 16px rgba(0, 0, 0, 0.12);
border: 1px solid #e5e7eb;
display: none;
flex-direction: column;
z-index: 999999;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
overflow: hidden;
}
.rag-chatbot-container.rag-chatbot-open {
display: flex;
}
.rag-chatbot-header {
background: #ffffff;
color: #1f2937;
padding: 16px 20px;
border-bottom: 1px solid #e5e7eb;
display: flex;
justify-content: space-between;
align-items: center;
}
.rag-chatbot-header h3 {
margin: 0;
font-size: 16px;
font-weight: 600;
color: #111827;
}
.rag-chatbot-close {
background: transparent;
border: none;
color: #111827 !important;
cursor: pointer;
padding: 4px;
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
transition: background-color 0.2s, color 0.2s;
line-height: 1;
}
.rag-chatbot-close svg {
width: 16px;
height: 16px;
stroke: currentColor;
}
.rag-chatbot-close:hover {
background-color: #f3f4f6;
color: #111827;
}
.rag-chatbot-messages {
flex: 1;
overflow-y: auto;
padding: 20px;
display: flex;
flex-direction: column;
gap: 16px;
background: #ffffff;
}
.rag-chatbot-message {
display: flex;
flex-direction: column;
max-width: 85%;
animation: fadeIn 0.3s ease-in;
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.rag-chatbot-message.rag-chatbot-user {
align-self: flex-end;
}
.rag-chatbot-message.rag-chatbot-bot {
align-self: flex-start;
}
.rag-chatbot-message-content {
padding: 12px 16px;
border-radius: 18px;
line-height: 1.5;
word-wrap: break-word;
}
.rag-chatbot-user .rag-chatbot-message-content {
background: #111827;
color: #ffffff;
border-bottom-right-radius: 4px;
}
.rag-chatbot-bot .rag-chatbot-message-content {
background: #f9fafb;
color: #111827;
border: 1px solid #e5e7eb;
border-bottom-left-radius: 4px;
}
.rag-chatbot-message-content p {
margin: 0 0 8px 0;
}
.rag-chatbot-message-content p:last-child {
margin-bottom: 0;
}
.rag-chatbot-sources {
margin-top: 12px;
padding-top: 12px;
border-top: 1px solid #e5e7eb;
font-size: 12px;
}
.rag-chatbot-sources-title {
font-weight: 600;
margin-bottom: 8px;
color: #6b7280;
text-transform: uppercase;
letter-spacing: 0.5px;
font-size: 11px;
}
.rag-chatbot-sources-list {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.rag-chatbot-source {
margin: 0;
}
.rag-chatbot-source a {
color: #111827;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 4px;
padding: 4px 8px;
background: #f9fafb;
border: 1px solid #e5e7eb;
border-radius: 4px;
font-size: 11px;
transition: background-color 0.2s, border-color 0.2s;
}
.rag-chatbot-source a:hover {
color: #111827;
background: #f3f4f6;
border-color: #d1d5db;
text-decoration: none;
}
.rag-chatbot-input-container {
padding: 16px;
background: #ffffff;
border-top: 1px solid #e5e7eb;
}
.rag-chatbot-form {
display: flex;
gap: 8px;
align-items: center;
}
.rag-chatbot-input {
flex: 1;
padding: 10px 14px;
border: 1px solid #d1d5db;
border-radius: 6px;
font-size: 14px;
outline: none;
transition: border-color 0.2s, box-shadow 0.2s;
background: #ffffff;
color: #111827;
}
.rag-chatbot-input:focus {
border-color: #111827;
box-shadow: 0 0 0 3px rgba(17, 24, 39, 0.1);
}
.rag-chatbot-input::placeholder {
color: #9ca3af;
}
.rag-chatbot-send {
background: #111827;
border: none;
color: #ffffff;
width: 40px;
height: 40px;
border-radius: 6px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background-color 0.2s;
flex-shrink: 0;
padding: 0;
}
.rag-chatbot-send:hover {
background: #374151;
}
.rag-chatbot-send:active {
background: #1f2937;
}
.rag-chatbot-send:disabled {
opacity: 0.5;
cursor: not-allowed;
background: #111827;
}
.rag-chatbot-loading {
padding: 12px 20px;
display: flex;
align-items: center;
gap: 12px;
color: #6b7280;
font-size: 14px;
}
.rag-chatbot-spinner {
width: 16px;
height: 16px;
border: 2px solid #e5e7eb;
border-top-color: #111827;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
.rag-chatbot-messages::-webkit-scrollbar {
width: 6px;
}
.rag-chatbot-messages::-webkit-scrollbar-track {
background: transparent;
}
.rag-chatbot-messages::-webkit-scrollbar-thumb {
background: #d1d5db;
border-radius: 3px;
}
.rag-chatbot-messages::-webkit-scrollbar-thumb:hover {
background: #9ca3af;
}
@media (max-width: 480px) {
.rag-chatbot-container {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
bottom: 0;
right: 0;
border-radius: 0;
border: none;
}
.rag-chatbot-header {
border-radius: 0;
}
.rag-chatbot-input-container {
border-radius: 0;
}
}.cmplz-video.cmplz-iframe-styles{background-color:transparent}.cmplz-video.cmplz-hidden{visibility:hidden !important}.cmplz-blocked-content-notice{display:none}.cmplz-placeholder-parent{height:inherit}.cmplz-optin .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optin .cmplz-wp-video .cmplz-blocked-content-notice,.cmplz-optout .cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-optout .cmplz-wp-video .cmplz-blocked-content-notice{display:block}.cmplz-blocked-content-container,.cmplz-wp-video{animation-name:cmplz-fadein;animation-duration:600ms;background:#FFF;border:0;border-radius:3px;box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15);display:flex;justify-content:center;align-items:center;background-repeat:no-repeat !important;background-size:cover !important;height:inherit;position:relative}.cmplz-blocked-content-container.gmw-map-cover,.cmplz-wp-video.gmw-map-cover{max-height:100%;position:absolute}.cmplz-blocked-content-container.cmplz-video-placeholder,.cmplz-wp-video.cmplz-video-placeholder{padding-bottom:initial}.cmplz-blocked-content-container iframe,.cmplz-wp-video iframe{visibility:hidden;max-height:100%;border:0 !important}.cmplz-blocked-content-container .cmplz-custom-accept-btn,.cmplz-wp-video .cmplz-custom-accept-btn{white-space:normal;text-transform:initial;cursor:pointer;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:200px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-custom-accept-btn:focus,.cmplz-wp-video .cmplz-custom-accept-btn:focus{border:1px dotted #cecece}.cmplz-blocked-content-container .cmplz-blocked-content-notice,.cmplz-wp-video .cmplz-blocked-content-notice{white-space:normal;text-transform:initial;position:absolute !important;width:100%;top:50%;left:50%;transform:translate(-50%,-50%);max-width:300px;font-size:14px;padding:10px;background-color:rgba(0,0,0,0.5);color:#fff;text-align:center;z-index:98;line-height:23px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links{display:block;margin-bottom:10px}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-links a,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-links a{color:#fff}.cmplz-blocked-content-container .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body,.cmplz-wp-video .cmplz-blocked-content-notice .cmplz-blocked-content-notice-body{display:block}.cmplz-blocked-content-container div div{display:none}.cmplz-wp-video .cmplz-placeholder-element{width:100%;height:inherit}@keyframes cmplz-fadein{from{opacity:0}to{opacity:1}}