/* AI Order Bot - Structural CSS only. All visual styling is inline in bot.js */

#aob-launcher {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  z-index: 2147483640 !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 10px !important;
}

#aob-tip {
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  animation: aobTipPop .45s cubic-bezier(.34,1.56,.64,1) both !important;
}
@keyframes aobTipPop {
  from { opacity:0; transform:scale(.6) translateY(8px); }
  to   { opacity:1; transform:scale(1) translateY(0); }
}

.aob-wave {
  display: inline-block !important;
  transform-origin: 70% 70% !important;
  animation: aobWave 2.2s ease infinite !important;
}
@keyframes aobWave {
  0%,60%,100% { transform:rotate(0); }
  15% { transform:rotate(18deg); }
  30% { transform:rotate(-8deg); }
  45% { transform:rotate(14deg); }
}

#aob-open {
  position: relative !important;
  animation: aobRing 3s ease infinite !important;
}
#aob-open:hover { animation: none !important; }
@keyframes aobRing {
  0%,65%,100% { box-shadow:0 6px 22px rgba(108,99,255,.5),0 0 0 0 rgba(108,99,255,.35) !important; }
  35%         { box-shadow:0 6px 22px rgba(108,99,255,.5),0 0 0 13px rgba(108,99,255,0) !important; }
}

/* Window: fixed size, flex column — critical for layout */
#aob-win {
  position: fixed !important;
  bottom: 100px !important;
  right: 24px !important;
  z-index: 2147483639 !important;
  width: 370px !important;
  height: 590px !important;
  flex-direction: column !important;
  overflow: hidden !important;
  animation: aobWinIn .3s cubic-bezier(.34,1.2,.64,1) !important;
}
@keyframes aobWinIn {
  from { opacity:0; transform:translateY(20px) scale(.95); }
  to   { opacity:1; transform:translateY(0) scale(1); }
}

/* Header never shrinks */
#aob-hdr { flex: 0 0 auto !important; }

/* Messages fills all remaining space and scrolls */
#aob-body {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scroll-behavior: smooth !important;
}
#aob-body::-webkit-scrollbar { width: 4px !important; }
#aob-body::-webkit-scrollbar-thumb { background: rgba(108,99,255,.25) !important; border-radius: 4px !important; }

/* Typing row doesn't shrink */
#aob-typing-row { flex: 0 0 auto !important; }

/* Input area never shrinks */
#aob-inp-wrap { flex: 0 0 auto !important; }

/* Credit bar never shrinks */
#aob-credit { flex: 0 0 auto !important; }

/* Typing dot animation */
@keyframes aobDot {
  0%,60%,100% { transform:translateY(0); opacity:.35; }
  30% { transform:translateY(-6px); opacity:1; }
}
.t-dot { animation: aobDot 1.2s ease infinite !important; display:inline-block !important; }
.t-dot:nth-child(2) { animation-delay: .18s !important; }
.t-dot:nth-child(3) { animation-delay: .36s !important; }

/* Live dot pulse */
@keyframes aobLive { 0%,100%{opacity:1;} 50%{opacity:.3;} }
.hdr-live { animation: aobLive 2s ease infinite !important; }

/* Bubble slide-in */
@keyframes aobUp {
  from { opacity:0; transform:translateY(8px); }
  to   { opacity:1; transform:translateY(0); }
}
.aob-msg-in { animation: aobUp .22s ease both !important; }

/* Mic recording pulse */
@keyframes aobMicOn {
  0%,100% { box-shadow:0 0 0 0 rgba(239,68,68,.4) !important; }
  50%     { box-shadow:0 0 0 8px rgba(239,68,68,0) !important; }
}
#aob-mic.mic-on { animation: aobMicOn .75s ease infinite !important; }

/* Voice dot */
@keyframes aobVd { 0%,100%{opacity:1;transform:scale(1);} 50%{opacity:.4;transform:scale(.7);} }
.v-dot { animation: aobVd .8s ease infinite !important; }

@media (max-width: 480px) {
  #aob-launcher { bottom: 16px !important; right: 16px !important; }
  #aob-win {
    right: 8px !important;
    bottom: 86px !important;
    width: calc(100vw - 16px) !important;
    height: calc(100dvh - 108px) !important;
    border-radius: 16px !important;
  }
}


/* Cleaner launcher and tooltip */
#aob-launch{
  box-shadow: 0 10px 25px rgba(0,0,0,.18);
}
#aob-launch .aob-tip{
  position:absolute;
  right:72px;
  left:auto;
  top:50%;
  transform:translateY(-50%);
  white-space:nowrap;
  background:#fff;
  color:#222;
  padding:10px 16px;
  border-radius:16px;
  font-size:14px;
  font-weight:500;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
}
#aob-launch .aob-tip:after{
  content:'';
  position:absolute;
  right:-6px;
  top:50%;
  width:12px;
  height:12px;
  background:#fff;
  transform:translateY(-50%) rotate(45deg);
}
#aob-launch #aob-fab{
  position:relative;
  z-index:2;
}


/* Compact launcher */
#aob-launch{bottom:20px!important;right:20px!important;}
#aob-launch #aob-fab{
  width:56px!important;
  height:56px!important;
  border-radius:50%!important;
  box-shadow:0 8px 20px rgba(0,0,0,.15)!important;
}
#aob-launch #aob-fab *{
  transform:scale(0.82);
}
#aob-launch .aob-tip{
  right:64px!important;
  padding:8px 14px!important;
  font-size:14px!important;
  border-radius:14px!important;
  max-width:220px;
}
/* 1. Resize the button and icon */
#aob-open {
    width: 45px !important;
    height: 45px !important;
}

#aob-open svg {
    width: 30px !important;
    height: 30px !important;
}

/* 2. Stack elements vertically and align to the right */
#aob-launcher {
    display: flex !important;
    flex-direction: column !important; /* Stack vertically */
    align-items: flex-end !important;   /* Align items to the right side */
    gap: 8px !important;               /* Space between text and button */
}

/* 3. Style the text bubble */
#aob-tip {
    position: relative !important;
    margin: 0 !important;
    padding: 6px 12px !important;      /* Slimmer padding for a cleaner look */
    font-size: 12px !important;        /* Slightly smaller text to match button */
    white-space: nowrap !important;    /* Prevents text from breaking into two lines */
    box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important;
}

/* 4. Remove any hardcoded bottom/right positions from the tip */
div#aob-tip {
    bottom: auto !important;
    right: auto !important;
    left: auto !important;
}

#aob-close {
    display: none !important;
}


