/* AI Assistant Chatbot - frontend.
   Everything is scoped under .aac-root and the important properties use !important,
   so theme or page-builder styles for buttons/textareas cannot change the widget. */

.aac-root{--aac-color:#4f46e5;--aac-size:92;--aac-x:20px;--aac-y:20px;font-size:15px;line-height:1.45;color:#1f2430;box-sizing:border-box}
.aac-root,.aac-root button,.aac-root textarea{font-family:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif!important}
.aac-root *,.aac-root *::before,.aac-root *::after{box-sizing:border-box}
.aac-root button{cursor:pointer;margin:0!important;text-transform:none!important;letter-spacing:normal!important;text-shadow:none!important;min-width:0!important;min-height:0!important;box-shadow:none!important}

/* ---------- Avatar ---------- */
.aac-root .aac-avatar{display:block;width:100%;height:100%}
.aac-root .aac-avatar svg,.aac-root .aac-avatar img{display:block;width:100%;height:100%;max-width:none;object-fit:contain}
.aac-eye,.aac-mouth,.aac-brows{transform-box:fill-box;transform-origin:center}
.aac-head{transform-box:view-box;transform-origin:50px 74px}
.aac-body{transform-box:view-box;transform-origin:50px 100px}
.aac-wave,.aac-squish{transform-box:fill-box}

/* Idle life, only on the closed launcher (keeps the page light):
   head sway, breathing, eyes that look around, soft blinking, rare eyebrow lift. */
.aac-launcher .aac-head{animation:aac-sway 7s ease-in-out infinite}
.aac-launcher .aac-body{animation:aac-breathe 4.2s ease-in-out infinite}
.aac-launcher .aac-gaze{animation:aac-gaze 8s ease-in-out infinite}
.aac-launcher .aac-eye{animation:aac-blink 5.5s infinite}
.aac-launcher .aac-brows{animation:aac-brow-idle 9s ease-in-out infinite}
.aac-launcher .aac-wave{transform-origin:50% 100%;animation:aac-wave 2.6s ease-in-out infinite}
.aac-launcher .aac-squish{transform-origin:50% 100%;animation:aac-squish 3.2s ease-in-out infinite}
@keyframes aac-sway{0%,100%{transform:rotate(0) translateY(0)}30%{transform:rotate(1.5deg) translateY(-.3px)}65%{transform:rotate(-1.3deg) translateY(.2px)}}
@keyframes aac-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.008,1.016)}}
@keyframes aac-gaze{0%,100%{transform:translate(0,0)}20%{transform:translate(.9px,.2px)}45%{transform:translate(-.8px,-.2px)}70%{transform:translate(.4px,.4px)}}
@keyframes aac-blink{0%,91%,100%{transform:scaleY(1)}93.5%{transform:scaleY(.08)}96%{transform:scaleY(1)}}
@keyframes aac-brow-idle{0%,80%,100%{transform:translateY(0)}86%{transform:translateY(-.7px)}93%{transform:translateY(0)}}
@keyframes aac-wave{0%,60%,100%{transform:rotate(0)}70%{transform:rotate(-14deg)}80%{transform:rotate(8deg)}90%{transform:rotate(-10deg)}}
@keyframes aac-squish{0%,100%{transform:scale(1,1)}50%{transform:scale(1.03,.97)}}

/* Talking (only while the AI is answering): lips, nodding, expressive eyebrows, blinking. */
.aac-talking .aac-head{animation:aac-nod .9s ease-in-out infinite}
.aac-talking .aac-brows{animation:aac-brow-talk 1.3s ease-in-out infinite}
.aac-talking .aac-eye{animation:aac-blink 3.6s infinite}
.aac-talking .aac-mouth{transform-origin:50% 15%;animation:aac-talk .62s linear infinite}
.aac-talking .aac-squish{transform-origin:50% 100%;animation:aac-squish .7s ease-in-out infinite}
.aac-talking .aac-avatar img{animation:aac-bounce .45s ease-in-out infinite alternate}
@keyframes aac-nod{0%,100%{transform:rotate(0) translateY(0)}25%{transform:rotate(-1.2deg) translateY(.5px)}50%{transform:rotate(1deg) translateY(0)}75%{transform:rotate(-.6deg) translateY(.6px)}}
@keyframes aac-brow-talk{0%,100%{transform:translateY(0)}20%{transform:translateY(-1px)}45%{transform:translateY(.3px)}70%{transform:translateY(-.8px)}}
@keyframes aac-talk{0%{transform:scale(1,.7)}12%{transform:scale(1.04,1.9)}24%{transform:scale(.94,1)}38%{transform:scale(1.08,2.2)}52%{transform:scale(1,1.2)}66%{transform:scale(1.06,1.7)}80%{transform:scale(.96,.9)}100%{transform:scale(1,.7)}}
@keyframes aac-bounce{from{transform:translateY(0) scale(1)}to{transform:translateY(-2px) scale(1.025)}}

/* ---------- Floating widget ---------- */
.aac-root.aac-floating{position:fixed;bottom:var(--aac-y);z-index:99990}
.aac-root.aac-floating.aac-pos-left{left:var(--aac-x)}
.aac-root.aac-floating.aac-pos-right{right:var(--aac-x)}

.aac-root .aac-launcher{display:block!important;width:calc(var(--aac-size) * 1px)!important;height:calc(var(--aac-size) * 1px)!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;will-change:transform;animation:aac-float 3.6s ease-in-out infinite;transition:transform .2s;-webkit-tap-highlight-color:transparent}
.aac-root .aac-launcher:hover{transform:scale(1.07);animation-play-state:paused}
@keyframes aac-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.aac-root.aac-floating.aac-open .aac-launcher{display:none!important}
.aac-root .aac-launcher:focus-visible,.aac-root .aac-greet-open:focus-visible,.aac-root .aac-greet-x:focus-visible,.aac-root .aac-send:focus-visible,.aac-root .aac-close:focus-visible,.aac-root .aac-reset:focus-visible{outline:3px solid var(--aac-color);outline-offset:2px}

/* ---------- Greeting bubble ---------- */
.aac-root .aac-greet{position:absolute;bottom:calc(var(--aac-size) * 1px + 8px);display:flex;align-items:flex-start;width:max-content;max-width:min(240px,calc(100vw - 60px));background:#fff;color:#1f2430;border-radius:14px;box-shadow:0 6px 24px rgba(20,24,40,.22);animation:aac-pop .25s ease-out}
.aac-root .aac-greet[hidden]{display:none}
.aac-pos-left .aac-greet{left:calc(var(--aac-size) * .3px)}
.aac-pos-right .aac-greet{right:calc(var(--aac-size) * .3px)}
.aac-root .aac-greet::after{content:"";position:absolute;bottom:-6px;width:14px;height:14px;background:#fff;transform:rotate(45deg);border-radius:2px}
.aac-pos-left .aac-greet::after{left:18px}
.aac-pos-right .aac-greet::after{right:18px}
.aac-root .aac-greet-open{flex:1;padding:11px 4px 11px 14px!important;border:0!important;background:transparent!important;color:inherit!important;text-align:left;font-size:15px!important;line-height:1.35!important}
.aac-root .aac-greet-x{width:26px!important;height:26px!important;margin:4px 4px 0 0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;color:#7b8294!important;font-size:18px!important;line-height:1!important}
.aac-root .aac-greet-x:hover{background:#eef0f5!important}
.aac-root.aac-floating.aac-open .aac-greet{display:none}

/* ---------- Chat panel (medium size) ---------- */
.aac-root .aac-panel{display:flex;flex-direction:column;background:#fff;border-radius:16px;box-shadow:0 12px 40px rgba(20,24,40,.28);overflow:hidden;margin:0}
.aac-root .aac-panel[hidden]{display:none}
.aac-root.aac-floating .aac-panel{position:absolute;bottom:0;width:320px;max-width:calc(100vw - 32px);height:400px;max-height:calc(100vh - var(--aac-y) - 16px);max-height:calc(100dvh - var(--aac-y) - 16px);animation:aac-pop .18s ease-out}
.aac-pos-left .aac-panel{left:0;transform-origin:bottom left}
.aac-pos-right .aac-panel{right:0;transform-origin:bottom right}
@keyframes aac-pop{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
.aac-root.aac-inline{width:100%;max-width:480px;margin:1.5em 0}
.aac-root.aac-inline .aac-panel{height:400px;border:1px solid #e3e6ee;box-shadow:0 4px 18px rgba(20,24,40,.1)}

.aac-root .aac-header{display:flex;align-items:center;gap:10px;padding:9px 12px;background:var(--aac-color);color:#fff}
.aac-root .aac-avatar-sm{width:42px;height:42px;flex:none;border-radius:50%;overflow:hidden;background:rgba(255,255,255,.92)}
.aac-root .aac-title{flex:1;min-width:0;font-weight:600;font-size:16px;line-height:1.2;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aac-root .aac-close,.aac-root .aac-reset{display:grid!important;place-items:center;width:32px!important;height:32px!important;padding:0!important;border:0!important;border-radius:8px!important;background:transparent!important;color:#fff!important}
.aac-root .aac-close:hover,.aac-root .aac-reset:hover{background:rgba(255,255,255,.2)!important}

.aac-root .aac-messages{flex:1;overflow-y:auto;padding:12px;background:#f5f6fa;display:flex;flex-direction:column;gap:9px;overscroll-behavior:contain}
.aac-root .aac-msg{max-width:84%;padding:8px 12px;border-radius:14px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.45;margin:0}
.aac-root .aac-msg-bot{align-self:flex-start;background:#fff;color:#1f2430;border:1px solid #e3e6ee;border-bottom-left-radius:4px}
.aac-root .aac-msg-user{align-self:flex-end;background:var(--aac-color);color:#fff;border-bottom-right-radius:4px}
.aac-root .aac-msg-error{align-self:flex-start;background:#fdecec;border:1px solid #f3b9b9;color:#8a1c1c;border-bottom-left-radius:4px}
.aac-root .aac-typing{display:inline-flex;gap:4px;padding:12px 14px}
.aac-root .aac-typing i{width:6px;height:6px;border-radius:50%;background:#9aa1b2;animation:aac-dot 1s infinite}
.aac-root .aac-typing i:nth-child(2){animation-delay:.15s}
.aac-root .aac-typing i:nth-child(3){animation-delay:.3s}
@keyframes aac-dot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}

.aac-root .aac-form{display:flex;align-items:flex-end;gap:8px;padding:9px;border-top:1px solid #e3e6ee;background:#fff}
.aac-root .aac-input{flex:1 1 auto;width:auto!important;min-width:0;height:40px;min-height:40px;max-height:110px;resize:none;margin:0!important;padding:9px 12px!important;border:1px solid #d5d9e4!important;border-radius:12px!important;font-size:15px!important;line-height:1.4!important;color:#1f2430!important;background:#fff!important;outline:none;box-shadow:none!important;overflow-y:auto}
.aac-root .aac-input:focus{border-color:var(--aac-color)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--aac-color) 20%,transparent)!important}
.aac-root .aac-send{display:grid!important;place-items:center;width:40px!important;height:40px!important;flex:none;padding:0!important;border:0!important;border-radius:12px!important;background:var(--aac-color)!important;color:#fff!important;transition:opacity .15s}
.aac-root .aac-send:disabled{opacity:.45;cursor:not-allowed}

/* ---------- Mobile: compact card, slightly smaller agent ---------- */
@media (max-width:520px){
  .aac-root .aac-launcher{width:calc(var(--aac-size) * .85px)!important;height:calc(var(--aac-size) * .85px)!important;min-width:56px!important;min-height:56px!important}
  .aac-root .aac-greet{bottom:calc(var(--aac-size) * .85px + 6px);max-width:min(220px,calc(100vw - 60px))}
  .aac-root.aac-floating .aac-panel{position:fixed;left:12px;right:12px;bottom:12px;width:auto;max-width:none;height:min(60vh,400px);height:min(60dvh,400px);max-height:none}
  .aac-root .aac-input{font-size:16px!important} /* prevents iOS zoom on focus */
}

@media (prefers-reduced-motion:reduce){
  .aac-root *,.aac-root *::before,.aac-root *::after{animation:none!important;transition:none!important}
}
