#chatbot-root {
--cb-primary: #2563eb;
--cb-bottom-offset: 24px;
--cb-side-offset: 24px;
}
.cb-hidden {
display: none !important;
} #cb-bubble {
position: fixed;
bottom: var(--cb-bottom-offset);
right: var(--cb-side-offset);
background: var(--cb-primary);
color: #fff;
border: none;
cursor: pointer;
z-index: 9999;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
transition: filter 0.2s, transform 0.2s;
display: flex;
align-items: center;
justify-content: center;
} #cb-bubble.cb-btn-bubble {
width: 56px;
height: 56px;
border-radius: 50%;
font-size: 24px;
} #cb-bubble.cb-btn-pill {
height: 48px;
border-radius: 24px;
padding: 0 20px;
font-size: 14px;
font-weight: 600;
gap: 6px;
white-space: nowrap;
}
#cb-bubble.cb-btn-pill::after {
content: none; } #cb-bubble.cb-btn-square {
width: 56px;
height: 56px;
border-radius: 12px;
font-size: 24px;
} #cb-bubble::after {
content: '💬 ¿Hablamos?';
position: absolute;
right: 70px;
bottom: 12px;
background: #111;
color: #fff;
padding: 8px 14px;
border-radius: 20px;
font-size: 14px;
white-space: nowrap;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
pointer-events: none;
}
#cb-bubble.cb-open::after {
display: none;
}
#cb-bubble:hover {
filter: brightness(0.88);
transform: scale(1.06);
}  .cb-position-left #cb-bubble,
.cb-position-left #cb-box {
right: auto;
left: var(--cb-side-offset);
}
.cb-position-left #cb-bubble::after {
right: auto;
left: 70px;
} #cb-box {
position: fixed;
bottom: calc(var(--cb-bottom-offset) + 68px);
right: var(--cb-side-offset);
width: 360px;
height: 500px;
background: #fff;
border-radius: 12px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
z-index: 9998;
display: flex;
flex-direction: column;
overflow: hidden;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
font-size: 14px;
} #cb-header {
background: var(--cb-primary);
color: #fff;
padding: 12px 16px;
display: flex;
align-items: center;
justify-content: space-between;
flex-shrink: 0;
}
#cb-title {
font-weight: 600;
font-size: 15px;
}
#cb-close {
background: transparent;
border: none;
color: #fff;
font-size: 18px;
cursor: pointer;
line-height: 1;
padding: 0 4px;
opacity: 0.8;
transition: opacity 0.15s;
}
#cb-close:hover {
opacity: 1;
} #cb-messages {
flex: 1;
overflow-y: auto;
padding: 16px;
display: flex;
flex-direction: column;
gap: 8px;
} .cb-msg {
max-width: 75%;
padding: 8px 12px;
border-radius: 16px;
line-height: 1.45;
word-break: break-word;
}
.cb-user {
align-self: flex-end;
background: var(--cb-primary);
color: #fff;
border-bottom-right-radius: 4px;
}
.cb-assistant {
align-self: flex-start;
background: #f1f5f9;
color: #1e293b;
border-bottom-left-radius: 4px;
} #cb-input-area {
display: flex;
border-top: 1px solid #e2e8f0;
flex-shrink: 0;
align-items: stretch;
}
#cb-input-wrap {
flex: 1;
position: relative;
display: flex;
align-items: center;
}
#cb-input {
width: 100%;
padding: 10px 52px 10px 12px;
border: none;
outline: none;
font-size: 14px;
color: #1e293b;
box-sizing: border-box;
} #cb-counter {
position: absolute;
right: 8px;
font-size: 10px;
color: #94a3b8;
pointer-events: none;
white-space: nowrap;
}
.cb-counter-warn {
color: #f59e0b;
}
.cb-counter-limit {
color: #ef4444;
} #cb-send {
padding: 10px 16px;
background: var(--cb-primary);
color: #fff;
border: none;
cursor: pointer;
font-size: 13px;
font-weight: 600;
transition: filter 0.15s;
flex-shrink: 0;
}
#cb-send:hover {
filter: brightness(0.88);
}
#cb-send:disabled,
#cb-input:disabled {
opacity: 0.6;
cursor: not-allowed;
} #cb-quick-buttons {
display: flex;
flex-direction: column;
gap: 6px;
align-self: stretch;
margin-top: 4px;
}
.cb-quick-btn {
padding: 9px 16px;
background: var(--cb-primary);
border: none;
color: #fff;
border-radius: 20px;
cursor: pointer;
font-size: 13px;
font-weight: 500;
text-align: left;
transition: filter 0.15s;
line-height: 1.4;
}
.cb-quick-btn:hover {
filter: brightness(0.88);
} .cb-assistant p {
margin: 0 0 8px 0;
}
.cb-assistant p:last-child {
margin-bottom: 0;
}
.cb-assistant strong {
font-weight: 600;
}
.cb-assistant ul, .cb-assistant ol {
margin: 4px 0 8px 16px;
padding: 0;
}
.cb-assistant li {
margin-bottom: 4px;
}
.cb-assistant h1,
.cb-assistant h2,
.cb-assistant h3,
.cb-assistant h4 {
font-size: 14px;
font-weight: 600;
margin: 8px 0 4px 0;
}  @media (max-width: 480px) {
#cb-bubble {
bottom: var(--cb-bottom-offset);
right: var(--cb-side-offset);
z-index: 9999;
}
.cb-position-left #cb-bubble {
right: auto;
left: var(--cb-side-offset);
}
#cb-bubble.cb-btn-bubble,
#cb-bubble.cb-btn-square {
width: 50px;
height: 50px;
font-size: 20px;
}
#cb-bubble::after {
font-size: 12px;
padding: 6px 10px;
right: 60px;
bottom: 10px;
}
.cb-position-left #cb-bubble::after {
right: auto;
left: 60px;
}
#cb-box {
bottom: 0;
right: 0;
left: 0;
top: 0;
width: 100%;
height: 100%;
height: 100dvh;
border-radius: 0;
box-shadow: none;
z-index: 99999;
}
}.footer-width-fixer {
width: 100%;
} .ehf-template-genesis.ehf-header .site-header .wrap,
.ehf-template-genesis.ehf-footer .site-footer .wrap,
.ehf-template-generatepress.ehf-header .site-header .inside-header {
width: 100%;
padding: 0;
max-width: 100%;
} .ehf-template-generatepress.ehf-header .site-header,
.ehf-template-generatepress.ehf-footer .site-footer {
width: 100%;
padding: 0;
max-width: 100%;
background-color: transparent !important; }
.bhf-hidden {
display: none
} .ehf-header #masthead {
z-index: 99;
position: relative;
}