/* Moo — the Millie Moo's chat helper (demo, Claude Haiku behind /api/moo-chat).
   Bottom-LEFT so it never fights the Cox demo badge (bottom-right) or the
   mobile sticky CTA (bottom:74px). Hidden while the booking overlay is open. */

.moo-fab{
  position:fixed;left:16px;bottom:16px;z-index:75;
  display:inline-flex;align-items:center;gap:.55rem;
  background:var(--card);border:2px solid var(--ink);border-radius:999px;
  padding:.45rem 1rem .45rem .5rem;cursor:pointer;
  font:700 .95rem/1 var(--font-body);color:var(--ink);
  box-shadow:var(--shadow);
  transition:transform .12s ease,background .12s ease;
}
.moo-fab:hover{background:var(--lilac)}
.moo-fab:active{transform:scale(.96)}
.moo-fab img{width:38px;height:36px}
.moo-fab .moo-fab-hi{
  position:absolute;top:-6px;right:-4px;width:14px;height:14px;border-radius:50%;
  background:var(--pink-deep);border:2px solid var(--cream);
}
.moo-fab[data-open="true"] .moo-fab-hi{display:none}
@keyframes moo-wiggle{
  0%,100%{transform:rotate(0)} 20%{transform:rotate(-6deg)}
  40%{transform:rotate(5deg)} 60%{transform:rotate(-3deg)} 80%{transform:rotate(2deg)}
}
.moo-fab img{animation:moo-wiggle 1.1s ease .9s 1}

.moo-panel{
  position:fixed;left:16px;bottom:84px;z-index:76;
  width:min(370px,calc(100vw - 32px));
  height:min(540px,calc(100vh - 120px));
  display:none;flex-direction:column;overflow:hidden;
  background:var(--cream);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:0 18px 50px rgba(59,34,71,.28);
}
.moo-panel.open{display:flex}

.moo-head{
  display:flex;align-items:center;gap:.7rem;
  background:var(--ink);color:#EFE6FA;padding:.7rem .9rem;
}
.moo-head .moo-avatar{
  width:40px;height:40px;border-radius:50%;background:#fff;flex:none;
  display:flex;align-items:center;justify-content:center;
}
.moo-head .moo-avatar img{width:30px;height:29px}
.moo-head-name{font-family:var(--font-display);font-weight:700;font-size:1.15rem;line-height:1.1}
.moo-head-sub{font-size:.72rem;color:#C9B6DC}
.moo-close{
  margin-left:auto;background:none;border:0;color:#EFE6FA;cursor:pointer;
  font:700 .85rem/1 var(--font-body);padding:.5rem;border-radius:8px;
}
.moo-close:hover{background:rgba(255,255,255,.14)}

.moo-msgs{
  flex:1;overflow-y:auto;padding:.9rem;display:flex;flex-direction:column;gap:.6rem;
  overscroll-behavior:contain;
}
.moo-msg{display:flex;gap:.5rem;align-items:flex-end;max-width:88%}
.moo-msg .bub{
  padding:.6rem .85rem;border-radius:16px;font-size:.94rem;line-height:1.45;
  white-space:pre-wrap;overflow-wrap:break-word;
}
.moo-msg.from-moo .bub{
  background:var(--card);border:1px solid var(--border);border-bottom-left-radius:4px;
  color:var(--ink);box-shadow:0 2px 8px rgba(59,34,71,.06);
}
.moo-msg.from-moo::before{
  content:"";flex:none;width:26px;height:25px;margin-bottom:2px;
  background:url("media/cow-logo.png") center/contain no-repeat;
}
.moo-msg.from-user{align-self:flex-end;flex-direction:row-reverse}
.moo-msg.from-user .bub{
  background:var(--lilac-deep);color:var(--ink);border-bottom-right-radius:4px;
}
.moo-msg.error .bub{background:#FDECEA;border:1px solid #E7B8B4}

.moo-typing .bub{display:inline-flex;gap:5px;align-items:center;padding:.8rem .9rem}
.moo-typing .d{
  width:7px;height:7px;border-radius:50%;background:var(--ink-soft);opacity:.4;
  animation:moo-dot 1s infinite;
}
.moo-typing .d:nth-child(2){animation-delay:.18s}
.moo-typing .d:nth-child(3){animation-delay:.36s}
@keyframes moo-dot{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}

.moo-chips{display:flex;flex-wrap:wrap;gap:.4rem;padding:0 .9rem .5rem}
.moo-chip{
  background:var(--lilac);border:1px solid var(--lilac-deep);border-radius:999px;
  font:600 .8rem/1.2 var(--font-body);color:var(--ink);padding:.45rem .8rem;cursor:pointer;
}
.moo-chip:hover{background:var(--lilac-deep)}

.moo-form{
  display:flex;gap:.5rem;padding:.7rem .9rem;background:var(--card);
  border-top:1px solid var(--border);
}
.moo-form input{
  flex:1;min-width:0;border:2px solid var(--border);border-radius:999px;
  padding:.6rem 1rem;font:400 .95rem/1.3 var(--font-body);color:var(--ink);
  background:var(--cream);
}
.moo-form input:focus{outline:none;border-color:var(--ink-soft)}
.moo-send{
  flex:none;background:var(--yellow);color:var(--ink);border:0;border-radius:999px;
  font:700 .9rem/1 var(--font-body);padding:.6rem 1.05rem;cursor:pointer;
  box-shadow:0 3px 10px rgba(59,34,71,.16);
}
.moo-send:hover{background:var(--yellow-press)}
.moo-send[disabled]{opacity:.45;cursor:not-allowed}
.moo-note{
  font-size:.66rem;color:var(--ink-soft);text-align:center;
  padding:0 .9rem .55rem;background:var(--card);margin:0;
}

/* booking overlay owns the screen */
body.overlay-open .moo-fab,body.overlay-open .moo-panel{display:none}

@media (max-width:640px){
  .moo-fab{left:10px;bottom:10px}
  .moo-fab .moo-fab-label{display:none}
  .moo-fab{padding:.45rem .5rem}
  .moo-panel{
    left:8px;right:8px;width:auto;bottom:8px;
    height:min(560px,calc(100dvh - 90px));
  }
}
@media (prefers-reduced-motion:reduce){
  .moo-fab img{animation:none}
  .moo-typing .d{animation:none;opacity:.7}
}