/* ExcelChat Bot – widget styles. Colors come from CSS variables set in Settings. */
.ecb,.ecb *,.ecb *::before,.ecb *::after{box-sizing:border-box}
.ecb{--ecb-primary:#0b6bcb;--ecb-secondary:#e9edf2;--ecb-text:#1d2327;--ecb-radius:16px;
  position:fixed;z-index:99999;width:60px;height:60px;
  font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ecb-text)}
.ecb--bottom-right{bottom:24px;right:24px}
.ecb--bottom-left{bottom:24px;left:24px}
.ecb [hidden]{display:none!important}
.ecb-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0;white-space:nowrap}

/* Toggle */
.ecb__toggle{width:60px;height:60px;border-radius:50%;border:0;padding:0;cursor:pointer;color:#fff;background:var(--ecb-primary);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  box-shadow:0 6px 20px rgba(0,0,0,.25);transition:transform .2s ease,box-shadow .2s ease}
.ecb__toggle:hover{transform:scale(1.07);box-shadow:0 8px 24px rgba(0,0,0,.3)}
.ecb__toggle:focus-visible,.ecb button:focus-visible,.ecb input:focus-visible,.ecb select:focus-visible,.ecb textarea:focus-visible,.ecb__messages:focus-visible{outline:3px solid #ffb900;outline-offset:2px}
.ecb__toggle-img{width:100%;height:100%;object-fit:cover}

/* Panel */
.ecb__panel{position:absolute;bottom:76px;right:0;width:376px;max-width:calc(100vw - 32px);height:580px;max-height:calc(100vh - 120px);
  display:flex;flex-direction:column;background:#fff;border-radius:var(--ecb-radius);overflow:hidden;
  box-shadow:0 12px 48px rgba(0,0,0,.28);transform-origin:bottom right;animation:ecb-pop .22s ease-out}
.ecb--align-left .ecb__panel{left:0;right:auto;transform-origin:bottom left}
.ecb--align-top .ecb__panel{top:76px;bottom:auto}
@keyframes ecb-pop{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}

.ecb__header{display:flex;align-items:center;gap:10px;padding:14px 14px;background:var(--ecb-primary);color:#fff}
.ecb__avatar{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;overflow:hidden;flex:none}
.ecb__avatar img{width:100%;height:100%;object-fit:cover}
.ecb__title-wrap{flex:1;min-width:0}
.ecb__title{margin:0;padding:0;font-size:16px;line-height:1.2;font-weight:600;color:#fff;border:0}
.ecb__sub{font-size:12px;opacity:.85}
.ecb__close{background:transparent;border:0;color:#fff;cursor:pointer;padding:6px;border-radius:50%;line-height:0}
.ecb__close:hover{background:rgba(255,255,255,.18)}

.ecb__body{flex:1;min-height:0;display:flex;flex-direction:column;background:#f7f8fa}
.ecb__messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}

/* Bubbles */
.ecb__msg{display:flex;flex-direction:column;max-width:84%;animation:ecb-in .18s ease-out}
.ecb__msg--user{align-self:flex-end;align-items:flex-end}
.ecb__msg--bot{align-self:flex-start;align-items:flex-start}
.ecb__bubble{padding:9px 13px;border-radius:16px;word-wrap:break-word;overflow-wrap:anywhere}
.ecb__msg--user .ecb__bubble{background:var(--ecb-primary);color:#fff;border-bottom-right-radius:4px}
.ecb__msg--bot .ecb__bubble{background:var(--ecb-secondary);color:var(--ecb-text);border-bottom-left-radius:4px}
.ecb__msg--bot .ecb__bubble a{color:var(--ecb-primary);text-decoration:underline}
.ecb__time{font-size:11px;color:#6b7280;margin-top:3px;padding:0 4px}
.ecb__inline-btn{margin-top:8px;display:inline-block;background:var(--ecb-primary);color:#fff;border:0;border-radius:999px;padding:7px 14px;font:inherit;font-weight:600;cursor:pointer}
@keyframes ecb-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Typing indicator */
.ecb__typing .ecb__bubble{display:flex;gap:4px;align-items:center;padding:12px 14px}
.ecb__dot{width:7px;height:7px;border-radius:50%;background:#7b8794;animation:ecb-bounce 1.2s infinite ease-in-out}
.ecb__dot:nth-child(2){animation-delay:.15s}.ecb__dot:nth-child(3){animation-delay:.3s}
@keyframes ecb-bounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}

/* Input */
.ecb__form{display:flex;gap:8px;padding:10px;background:#fff;border-top:1px solid #e5e7eb}
.ecb__input{flex:1;min-width:0;border:1px solid #cfd6dd;border-radius:999px;padding:10px 14px;font:inherit;color:var(--ecb-text);background:#fff;margin:0;height:auto;box-shadow:none}
.ecb__send{flex:none;width:42px;height:42px;border-radius:50%;border:0;background:var(--ecb-primary);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.ecb__send:disabled{opacity:.5;cursor:not-allowed}
.ecb__footer{padding:8px 10px 10px;background:#fff;text-align:center}
.ecb__human{background:transparent;border:1px solid var(--ecb-primary);color:var(--ecb-primary);border-radius:999px;padding:7px 14px;font:inherit;font-weight:600;cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.ecb__human:hover{background:var(--ecb-primary);color:#fff}

/* Lead form */
.ecb__lead{flex:1;overflow-y:auto;padding:14px}
.ecb__lead-title{margin:0 0 10px;font-size:15px;font-weight:600;color:var(--ecb-text)}
.ecb__field{margin-bottom:10px;flex:1}
.ecb__row{display:flex;gap:8px}
.ecb__field label{display:block;font-size:12px;font-weight:600;margin-bottom:3px;color:#374151}
.ecb__field input[type=text],.ecb__field input[type=email],.ecb__field input[type=tel],.ecb__field input[type=date],.ecb__field input[type=number],.ecb__field select,.ecb__field textarea{
  width:100%;border:1px solid #cfd6dd;border-radius:8px;padding:8px 10px;font:inherit;background:#fff;color:var(--ecb-text);margin:0;box-shadow:none}
.ecb__field--check label{display:flex;gap:8px;font-weight:400;align-items:flex-start}
.ecb__field--check input{margin-top:3px}
.ecb__field [aria-invalid=true]{border-color:#b32d2e}
.ecb__err,.ecb__form-error{display:block;color:#b32d2e;font-size:12px;margin-top:2px;min-height:0}
.ecb__lead-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:6px}
.ecb__btn{background:var(--ecb-primary);color:#fff;border:0;border-radius:999px;padding:9px 18px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;display:inline-block;text-align:center}
.ecb__btn:disabled{opacity:.6;cursor:wait}
.ecb__btn--ghost{background:transparent;color:var(--ecb-text);border:1px solid #cfd6dd}
.ecb__btn--wa{background:#25d366;color:#08320f}

/* Handoff */
.ecb__handoff{flex:1;overflow-y:auto;padding:20px 16px;display:flex;flex-direction:column;gap:12px;align-items:stretch;text-align:center}
.ecb__handoff p{margin:0}
.ecb__note{font-size:12px;color:#4b5563}

/* Mobile: full screen */
@media (max-width:480px){
  .ecb__panel{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;border-radius:0;animation:none}
  .ecb[data-state=open] .ecb__toggle{display:none}
  .ecb__input,.ecb__field input,.ecb__field select,.ecb__field textarea{font-size:16px} /* prevent iOS zoom */
}
@media (prefers-reduced-motion:reduce){
  .ecb *,.ecb *::before,.ecb *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}