/* C2 Chat Widget styles */
.c2c-button {
  position: fixed; 
  right: 100px; 
  bottom: 16px;
  width: 56px; 
  height: 56px; 
  border-radius: 50%;
  background: #111; color: #fff; font-size: 14px; border: none; cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,.2); z-index: 9999;
}
/* C2 Chat Widget styles */
.c2c-bubble {
/*   position: fixed;  */
  right: 16px; 
  bottom: 16px;
/*   width: 56px;  */
/*   height: 56px;  */
  border-radius: 50%;
  background: #111; color: #fff; font-size: 14px; border: none; cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,.2); z-index: 9999;
}
.c2c-panel {
  position: fixed; right: 16px; bottom: 84px; width: 340px; max-width: 92vw; height: 460px;
  background: #fff; border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,.25);
  display: none; flex-direction: column; overflow: hidden; z-index: 9999;
}
.c2c-panel.open { display: flex; }
.c2c-head { padding: 12px 14px; background: #0f172a; color: #fff; display: flex; justify-content: space-between; align-items: center; }
.c2c-head .c2c-close { cursor: pointer; opacity: .8; }
.c2c-body { flex: 1; padding: 12px; overflow-y: auto; background: #f8fafc; }
.c2c-foot { padding: 10px; display: flex; gap: 8px; background: #fff; border-top: 1px solid #e2e8f0; }
.c2c-input { flex: 1; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 8px; }
.c2c-email { width: 45%; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 8px; }
.c2c-send { padding: 10px 12px; background: #111; color: #fff; border: none; border-radius: 8px; cursor: pointer; }
.c2c-row { display: flex; margin-bottom: 8px; }
.c2c-user { justify-content: flex-end; }
.c2c-bot { justify-content: flex-start; }
.c2c-bubble { max-width: 82%; padding: 10px 12px; border-radius: 12px; background: #111; color: #fff; }
.c2c-user .c2c-bubble { background: #0ea5e9; }
.c2c-typing { display: flex; gap: 4px; align-items: center; margin: 6px 0 4px 0; }
.c2c-typing span { width: 6px; height: 6px; border-radius: 50%; background: #94a3b8; display: inline-block; animation: c2c-blink 1.2s infinite; }
.c2c-typing span:nth-child(2){ animation-delay: .2s } .c2c-typing span:nth-child(3){ animation-delay: .4s }

/* CTA & errors */
.c2c-cta {
  display:inline-block; padding:8px 12px; background:#0ea5e9; color:#fff !important; border-radius:8px; text-decoration:none;
}
.c2c-cta:hover { background:#0284c7; color:#fff; }
.c2c-error { background:#b91c1c !important; color:#fff !important; }

/* Typeahead */
.c2c-input-wrap { position: relative; flex: 1; }
.c2c-typeahead { position: absolute; left: 0; right: 0; top: 100%; z-index: 99999; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; margin-top: 6px; display: none; max-height: 280px; overflow-y: auto; box-shadow: 0 10px 30px rgba(0,0,0,.12); }
.c2c-typeahead.open { display: block; }
.c2c-ta-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-bottom: 1px solid #f1f5f9; cursor: pointer; }
.c2c-ta-item:last-child { border-bottom: none; }
.c2c-thumb { width: 36px; height: 36px; object-fit: cover; border-radius: 6px; background: #f1f5f9; }
.c2c-ta-info { flex: 1; min-width: 0; }
.c2c-ta-name { font-weight: 600; font-size: 14px; color: #0f172a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.c2c-ta-meta { font-size: 12px; color: #475569; }
.c2c-ta-add { padding: 6px 10px; border: none; border-radius: 6px; background: #0ea5e9; color: #fff; cursor: pointer; }
.c2c-ta-add:hover { background: #0284c7; }

/* CTA & errors (reuse if not present) */
.c2c-cta { display:inline-block; padding:8px 12px; background:#0ea5e9; color:#fff; border-radius:8px; text-decoration:none; }
.c2c-cta:hover { background:#0284c7; color:#fff; }
.c2c-error { background:#b91c1c !important; color:#fff !important; }


@keyframes c2c-blink { 0%,80%,100%{ opacity:.3 } 40%{ opacity:1 } }
@media (max-width: 480px) {
  .c2c-panel { width: 92vw; height: 60vh; right: 4vw; bottom: 90px; }
}

