/* ─── Less-IT · AI Agent Chat Widget ─── */

/* ── Floating Action Button ── */
.chat-fab{position:fixed;bottom:1.5rem;right:1.5rem;z-index:10001;width:44px;height:44px;border-radius:10px;border:2px solid transparent;background:var(--bg-1);color:var(--t1);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,.2);transition:transform .2s var(--ease),box-shadow .3s,bottom .35s var(--ease);overflow:visible}
.chat-fab::before{content:'';position:absolute;inset:-2px;border-radius:12px;padding:2px;background:conic-gradient(from var(--fab-angle,0deg),#3b82f6,#60a5fa,#06b6d4,#10b981,#a855f7,#ec4899,#3b82f6);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;z-index:-1;animation:fab-glow-spin 3s linear infinite}
@property --fab-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes fab-glow-spin{to{--fab-angle:360deg}}
.chat-fab--raised{bottom:5.5rem}
.chat-fab:hover{transform:scale(1.08);box-shadow:0 0 20px rgba(59,130,246,.5),0 0 40px rgba(6,182,212,.3),0 0 60px rgba(168,85,247,.2)}
.chat-fab:active{transform:scale(.96)}
.chat-fab svg{width:36px;height:36px;transition:transform .2s}
.chat-fab.open svg{transform:rotate(90deg)}
.chat-fab .chat-fab__close{display:none}
.chat-fab.open .chat-fab__open{display:none}
.chat-fab.open .chat-fab__close{display:block}
.chat-fab__tooltip{position:fixed;bottom:2.2rem;right:3.75rem;z-index:10001;background:var(--bg-2);color:var(--t1);font-size:.8rem;font-family:var(--sans);padding:.4rem .75rem;border-radius:var(--r2);box-shadow:var(--shadow-lg);white-space:nowrap;pointer-events:none;opacity:0;transform:translateX(6px);transition:opacity .2s,transform .2s}
.chat-fab:hover+.chat-fab__tooltip,.chat-fab__tooltip.show,.chat-fab:hover~.chat-fab__tooltip{opacity:1;transform:translateX(0)}
.chat-fab__tooltip-icon{margin-right:.3rem;font-style:normal;display:inline-block;animation:chat-tooltip-pop .3s ease}@keyframes chat-tooltip-pop{0%{transform:scale(0);opacity:0}60%{transform:scale(1.2)}100%{transform:scale(1);opacity:1}}


.chat-fab__dot{position:absolute;top:4px;right:4px;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green);animation:chat-pulse 2.5s ease-in-out infinite}
.chat-fab.open .chat-fab__dot{display:none}
@keyframes chat-pulse{0%,100%{opacity:1;box-shadow:0 0 6px var(--green)}50%{opacity:.5;box-shadow:0 0 18px var(--green)}}

/* ── Chat Panel ── */
.chat-panel{position:fixed;bottom:5.5rem;right:1.5rem;z-index:10002;width:520px;max-width:calc(100vw - 2rem);height:650px;max-height:calc(100vh - 8rem);background:var(--bg);border:1px solid var(--border);border-radius:var(--r4);box-shadow:var(--shadow-xl);display:flex;flex-direction:column;transform:scale(.92) translateY(12px);opacity:0;pointer-events:none;visibility:hidden;transition:transform .25s var(--ease),opacity .2s,visibility 0s .25s,bottom .35s var(--ease);overflow:hidden}
.chat-panel.open{transform:scale(1) translateY(0);opacity:1;pointer-events:auto;visibility:visible;transition:transform .25s var(--ease),opacity .2s,visibility 0s 0s,bottom .35s var(--ease)}
.chat-panel--raised{bottom:9.5rem}

/* ── Docked Mode ── */
.chat-panel.chat-panel--docked{position:fixed;top:var(--nav-h,80px);right:0;bottom:0;left:auto;width:420px;min-width:420px;max-width:40vw;height:calc(100vh - var(--nav-h,80px));max-height:calc(100vh - var(--nav-h,80px));border-radius:0;border-right:none;border-top:none;border-bottom:none;box-shadow:-2px 0 16px rgba(0,0,0,.15);transform:none;transition:width .2s var(--ease),opacity .2s,visibility 0s;z-index:10002}
.chat-panel.chat-panel--docked.open{transform:none}
.chat-panel--docked .chat-header{border-radius:0}

/* ── Resize Handle ── */
.chat-resize-handle{display:none;position:absolute;top:0;left:0;width:5px;height:100%;cursor:col-resize;background:transparent;z-index:10003;transition:background .15s}
.chat-resize-handle:hover,.chat-resize-handle:active{background:var(--blue)}
.chat-panel--docked .chat-resize-handle{display:block}

/* ── Push page content when docked ── */
body.chat-docked{width:calc(100% - 420px);overflow-x:hidden}
body.chat-docked .dash-header{width:100vw}
body.chat-docked .search-overlay{z-index:10010}

/* ── Header ── */
.chat-header{display:flex;align-items:center;gap:.65rem;padding:.85rem 1rem;border-bottom:1px solid var(--border);background:var(--bg-1);flex-shrink:0;cursor:grab;user-select:none}
.chat-header:active{cursor:grabbing}
.chat-panel--docked .chat-header{cursor:default}
.chat-panel--dragging{transition:none!important}
.chat-header__avatar{width:40px;height:40px;border-radius:12px;border:2px solid var(--blue);background:var(--bg-1);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chat-header__info{flex:1;min-width:0}
.chat-header__name{font-size:.95rem;font-weight:700;color:var(--t1)}
.chat-header__status{font-size:.75rem;color:var(--green);display:flex;align-items:center;gap:.35rem}
.chat-header__status::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green)}
.chat-header__actions{display:flex;gap:.25rem}
.chat-header__btn{width:32px;height:32px;border:none;border-radius:var(--r2);background:transparent;color:var(--t3);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.chat-header__btn:hover{background:var(--bg-2);color:var(--t1)}
.chat-header__btn svg{width:16px;height:16px}
.chat-header__btn--dock:hover{background:rgba(59,130,246,.35);color:#2563eb}
.chat-header__btn--close:hover{background:rgba(239,68,68,.35);color:#dc2626}
.chat-header__btn--history:hover{background:rgba(168,85,247,.35);color:#7c3aed}
.chat-header__btn--new:hover{background:rgba(16,185,129,.35);color:#059669}
.chat-header__btn--clear:hover{background:rgba(245,158,11,.35);color:#d97706}

/* ── Messages ── */
.chat-messages{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.75rem;scroll-behavior:smooth;overscroll-behavior:contain}
.chat-messages::-webkit-scrollbar{width:4px}
.chat-messages::-webkit-scrollbar-track{background:transparent}
.chat-messages::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}

/* ── Message Bubbles ── */
.chat-msg{display:flex;gap:.5rem;max-width:100%;animation:chat-msg-in .25s var(--ease)}
.chat-msg--user{align-self:flex-end;flex-direction:row-reverse}
.chat-msg--bot{align-self:flex-start}
.chat-msg__avatar{width:28px;height:28px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.7rem;margin-top:.15rem}
.chat-msg--bot .chat-msg__avatar{background:var(--blue-a);color:var(--blue)}
.chat-msg--user .chat-msg__avatar{background:var(--blue-a);color:var(--blue)}
.chat-msg__bubble{padding:.7rem .9rem;border-radius:var(--r3);font-size:.9rem;line-height:1.6;color:var(--t1);word-break:break-word;overflow-x:auto;min-width:0}
.chat-msg--bot .chat-msg__bubble{background:var(--bg-1);border:1px solid var(--border);border-bottom-left-radius:var(--r1)}
.chat-msg--user .chat-msg__bubble{background:var(--blue);color:#fff;border-bottom-right-radius:var(--r1)}
.chat-msg__bubble p{margin:0 0 .5rem}
.chat-msg__bubble p:last-child{margin-bottom:0}
.chat-msg__bubble code{font-family:var(--mono);font-size:.82rem;background:rgba(0,0,0,.2);padding:.15rem .35rem;border-radius:4px}
.chat-msg--bot .chat-msg__bubble code{background:var(--bg-2)}
.chat-msg__bubble pre{overflow-x:auto;max-width:100%;white-space:pre;margin:.5rem 0;padding:.6rem .75rem;background:var(--bg-2);border-radius:var(--r2);font-size:.82rem}
.chat-msg__bubble strong{font-weight:700}
.chat-msg__bubble ul,.chat-msg__bubble ol{margin:.4rem 0;padding-left:1.2rem}
.chat-msg__bubble li{margin-bottom:.25rem;font-size:.88rem}
@keyframes chat-msg-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.chat-action-btn{background:none;border:none;padding:5px;cursor:pointer;color:var(--t3);display:flex;align-items:center;justify-content:center;border-radius:4px;transition:color .15s,background .15s}\n.chat-action-btn:hover{color:var(--t1);background:var(--bg-2)}\n.chat-action-btn.selected{opacity:1}
.chat-restoring,.chat-restoring *,.chat-restoring .chat-msg,.chat-restoring .chat-panel{animation:none!important;transition:none!important}
.chat-restoring .chat-messages{scroll-behavior:auto!important}

/* ── Typing ── */
.chat-typing{display:flex;align-items:center;gap:.5rem;padding:.4rem 0;align-self:flex-start}
.chat-typing__dots{display:flex;gap:4px}
.chat-typing__dot{width:6px;height:6px;border-radius:50%;background:var(--t4);animation:chat-bounce .6s ease-in-out infinite alternate}
.chat-typing__dot:nth-child(2){animation-delay:.15s}
.chat-typing__dot:nth-child(3){animation-delay:.3s}
@keyframes chat-bounce{to{opacity:.3;transform:translateY(-4px)}}

/* ── Input ── */
.chat-input{padding:.75rem 1rem;border-top:1px solid var(--border);background:var(--bg-1);flex-shrink:0}
.chat-panel--docked .chat-input{padding:1rem 1rem}
.chat-input__wrap{position:relative;display:flex;align-items:flex-end}
.chat-input__field{width:100%;resize:none;border:1px solid var(--border);border-radius:var(--r3);padding:.6rem 3rem .6rem .85rem;font-family:var(--sans);font-size:.9rem;color:var(--t1);background:var(--bg);line-height:1.5;max-height:160px;min-height:40px;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.chat-input__field::placeholder{color:var(--t4)}
.chat-input__field:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-a)}
.chat-input__send{position:absolute;right:6px;bottom:6px;width:30px;height:30px;border:none;border-radius:50%;background:var(--blue);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,transform .1s;flex-shrink:0}
.chat-input__send:hover{background:var(--cyan)}
.chat-input__send:active{transform:scale(.92)}
.chat-input__send:disabled{opacity:.4;cursor:not-allowed}
.chat-input__send svg{width:14px;height:14px;transform:rotate(45deg)}

/* ── Autocomplete ── */
.chat-autocomplete{position:absolute;bottom:100%;left:0;right:0;max-height:200px;overflow-y:auto;background:var(--bg);border:1px solid var(--border);border-radius:var(--r3);box-shadow:var(--shadow-lg);margin-bottom:4px;display:none;z-index:10}
.chat-autocomplete.open{display:block}
.chat-autocomplete__item{padding:.5rem .85rem;font-size:.85rem;color:var(--t2);cursor:pointer;transition:background .1s,color .1s;display:flex;flex-direction:column;gap:.15rem}
.chat-autocomplete__item:hover,.chat-autocomplete__item.active{background:var(--blue-a);color:var(--t1)}
.chat-autocomplete__item .ac-title{font-weight:600;color:var(--t1)}
.chat-autocomplete__item .ac-desc{font-size:.78rem;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-autocomplete__item .ac-hint{font-size:.7rem;color:var(--t4);font-style:italic}

/* ── Suggestions ── */
.chat-suggestions{display:flex;flex-wrap:wrap;gap:.4rem;padding:.5rem 1rem;border-top:1px solid var(--border);flex-shrink:0}
.chat-suggestions__chip{padding:.35rem .7rem;font-size:.78rem;font-weight:500;border:1px solid var(--border);border-radius:var(--r5);background:var(--bg);color:var(--t3);cursor:pointer;transition:all .15s;white-space:nowrap}
.chat-suggestions__chip:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-a)}

/* ── Bottom Action Bar (mobile) ── */
.chat-bottom-bar{display:none;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem;border-top:1px solid var(--border);background:var(--bg-1);flex-shrink:0}
.chat-bottom-bar__btn{display:flex;align-items:center;gap:.3rem;padding:.4rem .7rem;border:1px solid var(--border);border-radius:var(--r2);background:var(--bg);color:var(--t3);font-family:var(--sans);font-size:.75rem;font-weight:500;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.chat-bottom-bar__btn:hover{background:var(--bg-2);color:var(--t1);border-color:var(--blue)}
.chat-bottom-bar__btn svg{width:14px;height:14px;flex-shrink:0}

/* ── Chat History Panel ── */
.chat-history-panel{flex:1;overflow-y:auto;padding:.5rem}
.chat-history-list{display:flex;flex-direction:column;gap:.35rem}
.chat-history-item{display:block;width:100%;text-align:left;padding:.65rem .85rem;border:1px solid var(--border);border-radius:var(--r2);background:var(--bg);color:var(--t1);font-family:var(--sans);cursor:pointer;transition:all .15s}
.chat-history-item:hover{border-color:var(--blue);background:var(--blue-a)}
.chat-history-item__title{font-size:.84rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-history-item__meta{font-size:.7rem;color:var(--t3);margin-top:.2rem}

/* ── Clickable tiles in welcome ── */
.chat-tiles{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;padding:0 1rem .75rem}
.chat-tile{display:flex;align-items:center;gap:.6rem;padding:.65rem .75rem;border:1px solid var(--border);border-radius:var(--r3);background:var(--bg-1);color:var(--t1);font-family:var(--sans);font-size:.82rem;text-align:left;cursor:pointer;transition:all .2s;line-height:1.3}
.chat-tile:hover{border-color:var(--blue);background:var(--blue-a);transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,.1)}
.chat-tile__icon{width:32px;height:32px;border-radius:var(--r2);display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}
.chat-tile__text{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.chat-tile__text strong{font-size:.82rem;color:var(--t1)}
.chat-tile__desc{font-size:.7rem;color:var(--t3);font-weight:400}
@media(max-width:480px){
  .chat-tiles{grid-template-columns:1fr;gap:.4rem;padding:0 .75rem .5rem}
  .chat-tile{padding:.5rem .6rem}
}

/* ── Responsive ── */
@media(max-width:480px){
  .chat-fab{bottom:1rem;right:1rem;width:40px;height:40px}
  .chat-fab svg{width:32px;height:32px}
  .chat-fab__tooltip{bottom:1.8rem;right:3.5rem;font-size:.75rem}
  .chat-panel{top:.5rem;bottom:4.5rem;right:.5rem;left:.5rem;width:auto;max-width:none;height:auto;max-height:none;border-radius:var(--r3)}
  .chat-panel.chat-panel--docked{width:100vw;max-width:100vw;min-width:100vw}
  body.chat-docked{width:100%}
  .chat-resize-handle{display:none!important}
  .chat-bottom-bar{display:flex}
}
@media(max-width:768px) and (min-width:481px){
  .chat-panel{top:1rem;bottom:5.5rem;height:auto;max-height:none}
}