/* ============================================================
   LETUR ESTATE — AI Property Assistant widget
   Inherits the site design system (css/styles.css variables):
   --paper, --paper-2, --beige, --sand, --sea, --ink, --ink-soft,
   --gold, --line, --sans, --serif, --shadow
   ============================================================ */

/* ---- Launcher ---- */
.ai-launcher{position:fixed;right:clamp(1rem,3vw,2rem);bottom:clamp(1rem,3vw,2rem);z-index:90;width:60px;height:60px;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:var(--ink);color:var(--paper);cursor:pointer;box-shadow:var(--shadow);transition:background .4s ease,transform .4s ease}
.ai-launcher:hover{background:var(--sea);transform:translateY(-2px)}
.ai-launcher svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.5}
.ai-launcher__dot{position:absolute;top:4px;right:4px;width:12px;height:12px;border-radius:50%;background:var(--gold);border:2px solid var(--paper);animation:ai-pulse 2.4s infinite}
@keyframes ai-pulse{0%{box-shadow:0 0 0 0 rgba(179,147,92,.45)}70%{box-shadow:0 0 0 9px rgba(179,147,92,0)}100%{box-shadow:0 0 0 0 rgba(179,147,92,0)}}
.ai-launcher[hidden]{display:none}

/* ---- Panel ---- */
.ai-panel{position:fixed;right:clamp(1rem,3vw,2rem);bottom:clamp(1rem,3vw,2rem);z-index:95;width:min(400px,calc(100vw - 2rem));height:min(620px,calc(100svh - 4rem));display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:5px;box-shadow:var(--shadow);overflow:hidden;animation:ai-pop .4s cubic-bezier(.22,.61,.36,1)}
.ai-panel[hidden]{display:none}
@keyframes ai-pop{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}

/* ---- Header ---- */
.ai-head{display:flex;align-items:center;gap:.9rem;padding:1.1rem 1.3rem;background:var(--sea);color:#fff;flex-shrink:0}
.ai-head__avatar{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ai-head__avatar svg{width:20px;height:20px;fill:none;stroke:var(--gold-soft);stroke-width:1.5}
.ai-head__title{font-size:.78rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase}
.ai-head__title span{color:var(--gold-soft)}
.ai-head__status{display:flex;align-items:center;gap:.4rem;font-size:.66rem;letter-spacing:.1em;color:rgba(255,255,255,.72);margin-top:.2rem}
.ai-head__status::before{content:"";width:7px;height:7px;border-radius:50%;background:#8fc6a5}
.ai-head__close{margin-left:auto;width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:50%;color:rgba(255,255,255,.8);font-size:1.5rem;line-height:1;cursor:pointer;transition:.3s}
.ai-head__close:hover{background:rgba(255,255,255,.12);color:#fff}

/* ---- Messages ---- */
.ai-body{flex:1;overflow-y:auto;padding:1.3rem;display:flex;flex-direction:column;gap:.9rem;scroll-behavior:smooth;background:var(--paper-2)}
.ai-msg{max-width:86%;padding:.85rem 1.05rem;border-radius:4px;font-size:.92rem;font-weight:300;line-height:1.55;animation:ai-fade .35s ease}
@keyframes ai-fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ai-msg--bot{align-self:flex-start;background:var(--paper);border:1px solid var(--line);color:var(--ink)}
.ai-msg--user{align-self:flex-end;background:var(--ink);color:var(--paper)}
.ai-msg a{color:var(--gold);text-decoration:underline}
.ai-msg--user a{color:var(--gold-soft)}

/* Typing indicator */
.ai-typing{align-self:flex-start;display:flex;gap:5px;padding:.95rem 1.05rem;background:var(--paper);border:1px solid var(--line);border-radius:4px}
.ai-typing span{width:6px;height:6px;border-radius:50%;background:var(--ink-soft);animation:ai-blink 1.2s infinite}
.ai-typing span:nth-child(2){animation-delay:.18s}
.ai-typing span:nth-child(3){animation-delay:.36s}
@keyframes ai-blink{0%,80%,100%{opacity:.25}40%{opacity:1}}

/* ---- Quick reply chips ---- */
.ai-chips{display:flex;flex-wrap:wrap;gap:.5rem;align-self:flex-start;max-width:95%;animation:ai-fade .35s ease}
.ai-chips button{padding:.55rem 1rem;border:1px solid var(--line);border-radius:2px;background:var(--paper);cursor:pointer;font-family:var(--sans);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);transition:.3s;white-space:nowrap}
.ai-chips button:hover{border-color:var(--ink);color:var(--ink)}

/* ---- Property cards inside chat ---- */
.ai-cards{display:flex;flex-direction:column;gap:.8rem;align-self:stretch;animation:ai-fade .35s ease}
.ai-card{display:grid;grid-template-columns:110px 1fr;background:var(--paper);border:1px solid var(--line);border-radius:4px;overflow:hidden}
.ai-card__media{position:relative;min-height:110px;background:var(--sand)}
.ai-card__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ai-card__body{padding:.75rem .9rem;display:flex;flex-direction:column;gap:.25rem}
.ai-card__price{font-size:1.02rem;font-weight:400;color:var(--sea)}
.ai-card__loc{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}
.ai-card__meta{font-size:.76rem;color:var(--ink-soft)}
.ai-card__desc{font-size:.76rem;color:var(--ink-soft);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ai-card__btn{margin-top:.45rem;align-self:flex-start;background:none;border:none;padding:0;cursor:pointer;font-family:var(--sans);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);transition:.25s}
.ai-card__btn:hover{color:var(--sea)}

/* ---- Lead form inside chat ---- */
.ai-form{align-self:stretch;display:flex;flex-direction:column;gap:.7rem;background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:1.1rem;animation:ai-fade .35s ease}
.ai-form input{padding:.8rem .2rem;border:none;border-bottom:1px solid var(--line);background:transparent;font-family:var(--sans);font-size:.92rem;font-weight:300;color:var(--ink);transition:border-color .3s}
.ai-form input::placeholder{color:var(--ink-soft)}
.ai-form input:focus{outline:none;border-color:var(--sea)}
.ai-form input.is-invalid{border-color:#b3635c}
.ai-form .btn{margin-top:.4rem;padding:.9rem 1.2rem;font-size:.66rem}
.ai-form__note{font-size:.68rem;color:var(--ink-soft);line-height:1.5}

/* ---- Share buttons ---- */
.ai-share{display:flex;flex-wrap:wrap;gap:.5rem;align-self:flex-start;animation:ai-fade .35s ease}
.ai-share a,.ai-share button{display:inline-flex;align-items:center;gap:.45rem;padding:.7rem 1.1rem;border:1px solid var(--line);border-radius:2px;background:var(--paper);cursor:pointer;font-family:var(--sans);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);transition:.3s;text-decoration:none}
.ai-share a:hover,.ai-share button:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.ai-share svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6}

/* ---- Input ---- */
.ai-input{display:flex;align-items:center;gap:.6rem;padding:.9rem 1.1rem;border-top:1px solid var(--line);background:var(--paper);flex-shrink:0}
.ai-input input{flex:1;border:none;background:transparent;font-family:var(--sans);font-size:.95rem;font-weight:300;color:var(--ink);padding:.4rem 0}
.ai-input input::placeholder{color:var(--ink-soft)}
.ai-input input:focus{outline:none}
.ai-input button{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:var(--ink);color:var(--paper);cursor:pointer;flex-shrink:0;transition:background .35s}
.ai-input button:hover{background:var(--sea)}
.ai-input button:disabled{opacity:.4;cursor:not-allowed}
.ai-input svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}

/* ---- Mobile ---- */
@media(max-width:560px){
  .ai-panel{right:0;bottom:0;width:100vw;height:100svh;border-radius:0;border:none}
  .ai-launcher{right:1rem;bottom:1rem}
}