/* Titi AI Bot — shared by the website and the client portal.
   Colours fall back to the brand values so it works on either page. */
.askwrap{position:fixed;z-index:70;left:clamp(16px,2.6vw,38px);bottom:clamp(16px,2.6vw,34px);
  display:flex;flex-direction:column-reverse;align-items:flex-start;gap:10px}
.askwrap[hidden]{display:none}
.askbtn{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--rule,#CEDCD1);
  background:var(--card,#FFFFFF);color:var(--pine,#15513D);border-radius:99px;padding:12px 20px;cursor:pointer;
  font:inherit;font-size:14.5px;font-weight:500;
  box-shadow:0 10px 30px -14px rgba(14,32,25,.5);
  transition:transform .18s var(--ease,cubic-bezier(.22,.61,.36,1)),background .18s}
.askbtn:hover{background:var(--rule-soft,#E1EAE1)}
.askbtn:active{transform:scale(.97)}
.askbtn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}

.askpanel{width:min(374px,calc(100vw - 32px));background:var(--card,#FFFFFF);border:1px solid var(--rule,#CEDCD1);
  border-radius:18px;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 26px 60px -26px rgba(14,32,25,.55)}
.askpanel[hidden]{display:none}
.askpanel header{display:flex;align-items:flex-start;gap:12px;padding:16px 18px;
  background:var(--pine,#15513D);color:#fff}
.askpanel header b{display:block;font-size:15px;font-weight:600}
.askpanel header span{display:block;font-size:12.5px;color:#BFD6C8;margin-top:2px}
.askpanel header div{flex:1}
.askclose{margin-left:auto;background:none;border:0;color:#BFD6C8;font-size:23px;line-height:1;
  cursor:pointer;padding:0 2px}
.askclose:hover{color:#fff}

.asklog{padding:16px 18px 4px;max-height:min(46vh,340px);overflow-y:auto;
  display:flex;flex-direction:column;gap:11px}
.asklog:empty{display:none}
.bubble{max-width:88%;padding:11px 14px;border-radius:14px;font-size:14.3px;line-height:1.55;
  white-space:pre-wrap;word-wrap:break-word}
.bubble.them{background:var(--paper,#F1F5EF);border:1px solid var(--rule-soft,#E1EAE1);align-self:flex-start;
  border-bottom-left-radius:5px;color:var(--ink,#0E2019)}
.bubble.you{background:var(--pine,#15513D);color:#fff;align-self:flex-end;border-bottom-right-radius:5px}
.bubble.wait{display:flex;gap:4px;align-items:center;padding:14px}
.bubble.wait i{width:6px;height:6px;border-radius:50%;background:var(--muted,#5A6B62);display:block;
  animation:blip 1.2s infinite}
.bubble.wait i:nth-child(2){animation-delay:.18s}
.bubble.wait i:nth-child(3){animation-delay:.36s}
@keyframes blip{0%,60%,100%{opacity:.25}30%{opacity:.9}}

.askchips{display:flex;flex-wrap:wrap;gap:6px;padding:12px 18px 4px}
.askchips[hidden]{display:none}
.askchips button{border:1px solid var(--rule-soft,#E1EAE1);background:var(--paper,#F1F5EF);color:var(--pine,#15513D);
  border-radius:99px;padding:7px 12px;font:inherit;font-size:12.5px;cursor:pointer;text-align:left}
.askchips button:hover{background:var(--rule-soft,#E1EAE1)}

.askform{display:flex;gap:8px;padding:12px 18px 0}
.askform input{flex:1;min-width:0;padding:11px 14px;border:1px solid var(--rule,#CEDCD1);border-radius:99px;
  font:inherit;font-size:14.3px;color:inherit;background:var(--card,#FFFFFF)}
.askform input:focus{outline:2px solid var(--stamp,#B7761C);outline-offset:1px;border-color:transparent}
.askform button{flex:none;width:42px;height:42px;border-radius:50%;border:0;background:var(--pine,#15513D);
  color:#fff;cursor:pointer;display:grid;place-items:center}
.askform button:disabled{opacity:.45;cursor:default}
.askform svg{width:17px;height:17px;fill:currentColor}
.askfoot{margin:12px 0 0;padding:12px 18px 16px;border-top:1px solid var(--rule-soft,#E1EAE1);
  font-size:11.5px;line-height:1.55;color:var(--muted,#5A6B62)}
.askfoot b{color:var(--ink,#0E2019);font-weight:600}
.askfoot a{color:var(--pine,#15513D);font-weight:600;text-decoration:none}

@media(max-width:880px){
  .askwrap{left:auto;right:14px;bottom:calc(16px + env(safe-area-inset-bottom,0px));
    align-items:flex-end}
  .askbtn span{display:none}
  .askbtn{width:50px;height:50px;padding:0;border-radius:50%;justify-content:center}
  .askbtn svg{width:20px;height:20px}
  .askwrap.open .askbtn{display:none}
  .askpanel{width:calc(100vw - 28px)}
  .asklog{max-height:44vh}
}
@media(prefers-reduced-motion:reduce){.bubble.wait i{animation:none;opacity:.55}}