#bcb-root{
  --bcb-ink:#3B2E22;
  --bcb-paper:#FFFFFF;
  --bcb-gold:#A9895F;
  --bcb-line:rgba(28,27,25,.14);
  --bcb-champagne:#F2EAE0;
  font-family:-apple-system, 'Helvetica Neue', Arial, sans-serif;
}

#bcb-toggle{
  position:fixed; bottom:22px; left:22px; z-index:120;
  width:58px; height:58px; border-radius:50%;
  background:var(--bcb-champagne); color:var(--bcb-ink); border:1px solid rgba(59,46,34,.2);
  font-size:22px; cursor:pointer; box-shadow:0 10px 26px rgba(59,46,34,.18);
  display:flex; align-items:center; justify-content:center;
  transition:transform .2s, opacity .2s;
}
#bcb-toggle:hover{transform:scale(1.06);}
#bcb-toggle.hidden-on-open{opacity:0; pointer-events:none; transform:scale(.8);}
.bcb-icon{display:block;}

#bcb-hint{
  position:fixed; bottom:34px; left:88px; z-index:119;
  background:var(--bcb-ink); color:var(--bcb-paper); padding:9px 15px; border-radius:100px;
  font-size:13px; white-space:nowrap; box-shadow:0 8px 20px rgba(0,0,0,.2);
  opacity:0; transform:translateX(-8px); transition:.3s; pointer-events:none;
}
#bcb-hint.show{opacity:1; transform:translateX(0);}
#bcb-hint::before{content:''; position:absolute; left:-5px; top:50%; transform:translateY(-50%); border:6px solid transparent; border-right-color:var(--bcb-ink);}
@media (max-width:480px){ #bcb-hint{left:76px; bottom:26px; font-size:12px;} }

#bcb-window{
  position:fixed; bottom:22px; left:22px; z-index:121;
  width:340px; max-width:90vw; height:460px; max-height:74vh;
  background:var(--bcb-paper); border-radius:6px;
  box-shadow:0 20px 50px rgba(0,0,0,.3);
  display:flex; flex-direction:column; overflow:hidden;
  transform:translateY(16px) scale(.96); opacity:0; pointer-events:none;
  transition:.25s;
}
#bcb-window.open{transform:translateY(0) scale(1); opacity:1; pointer-events:auto;}

#bcb-header{
  background:var(--bcb-ink); color:var(--bcb-paper); padding:14px 16px;
  display:flex; align-items:center; justify-content:space-between;
  font-family:'Playfair Display',Georgia,serif; font-size:16px; letter-spacing:0.03em;
}
#bcb-close{background:none; border:none; color:var(--bcb-paper); font-size:16px; cursor:pointer;}

#bcb-messages{
  flex:1; overflow-y:auto; padding:14px 14px 6px; display:flex; flex-direction:column; gap:8px;
}
.bcb-bubble{
  max-width:82%; padding:9px 13px; border-radius:14px; font-size:13.5px; line-height:1.5;
}
.bcb-bot{ background:#fff; color:var(--bcb-ink); align-self:flex-start; border:1px solid var(--bcb-line); border-bottom-left-radius:3px; }
.bcb-user{ background:var(--bcb-ink); color:var(--bcb-paper); align-self:flex-end; border-bottom-right-radius:3px; }

.bcb-quick{ display:flex; flex-wrap:wrap; gap:6px; padding:0 12px 10px; }
.bcb-chip{
  border:1px solid var(--bcb-ink); background:none; color:var(--bcb-ink);
  border-radius:100px; padding:6px 12px; font-size:11.5px; cursor:pointer; transition:.15s;
}
.bcb-chip:hover{ background:var(--bcb-ink); color:var(--bcb-paper); }

#bcb-form{ display:flex; border-top:1px solid var(--bcb-line); padding:8px; gap:6px; }
#bcb-input{ flex:1; border:1px solid var(--bcb-line); border-radius:100px; padding:9px 14px; font-size:13px; font-family:inherit; }
#bcb-form button{ width:36px; height:36px; border-radius:50%; border:none; background:var(--bcb-ink); color:var(--bcb-paper); font-size:15px; cursor:pointer; }

@media (max-width:480px){
  #bcb-window{ left:12px; right:12px; width:auto; bottom:12px; }
  #bcb-toggle{ left:16px; bottom:16px; }
}

/* живой чат */
.bcb-op{ position:relative; }
.bcb-op-name{ display:block; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; opacity:.6; margin-bottom:3px; }
#bcb-toggle.bcb-unread::after{ content:''; position:absolute; top:6px; right:6px; width:11px; height:11px; border-radius:50%; background:#C0563D; border:2px solid #fff; }