/* ============================================================
   TUKI HOUSE — Asistente comercial (widget de chat en la web)
   ============================================================
   Reutiliza las variables de color/tipografía/radios definidas
   en style.css (--tuki-*, --font-*) para mantener la misma
   estética premium oscuro/dorado/crema del resto del sitio.
   ============================================================ */

.tuki-chat-bubble{
  position:fixed; right:18px; bottom:90px; z-index:71; width:56px; height:56px; border-radius:50%;
  background:var(--tuki-gold); color:#211809; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; box-shadow:0 14px 30px rgba(0,0,0,.45);
  transition:transform .2s ease, background .2s ease;
}
.tuki-chat-bubble:hover{ background:var(--tuki-gold-light); transform:translateY(-2px); }
.tuki-chat-bubble svg{ width:26px; height:26px; }
.tuki-chat-bubble.is-hidden{ display:none; }

.tuki-chat-backdrop{ z-index:96; }

.tuki-chat-panel{
  position:fixed; z-index:97; right:0; bottom:0; left:0; top:auto; max-height:82vh;
  background:var(--tuki-bg-soft); border-top:1px solid var(--tuki-card-border);
  border-radius:22px 22px 0 0; transform:translateY(110%); transition:transform .3s ease;
  display:flex; flex-direction:column;
}
.tuki-chat-panel.open{ transform:translateY(0); }

.tuki-chat-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
  padding:16px 18px 12px; border-bottom:1px solid var(--tuki-card-border);
}
.tuki-chat-head strong{ font-family:var(--font-display); font-size:1.05rem; color:var(--tuki-cream); display:block; }
.tuki-chat-head span{ font-size:.74rem; color:var(--tuki-cream-dim); line-height:1.4; display:block; margin-top:2px; }
.tuki-chat-close{
  width:34px; height:34px; border-radius:50%; background:var(--tuki-card); border:1px solid var(--tuki-card-border);
  display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--tuki-cream);
}
.tuki-chat-close svg{ width:16px; height:16px; }

.tuki-chat-mensajes{
  flex:1; overflow-y:auto; padding:14px 16px; display:flex; flex-direction:column; gap:10px; min-height:220px;
}
.tuki-chat-msg{ max-width:86%; display:flex; flex-direction:column; gap:8px; }
.tuki-chat-msg p{
  margin:0; padding:10px 13px; border-radius:var(--tuki-radius-md); font-size:.9rem; line-height:1.45;
  white-space:pre-line;
}
.tuki-chat-msg--bot{ align-self:flex-start; }
.tuki-chat-msg--bot p{ background:var(--tuki-card); border:1px solid var(--tuki-card-border); color:var(--tuki-cream); border-bottom-left-radius:4px; }
.tuki-chat-msg--cliente{ align-self:flex-end; }
.tuki-chat-msg--cliente p{ background:var(--tuki-gold); color:#211809; border-bottom-right-radius:4px; font-weight:500; }
.tuki-chat-msg-wa{
  align-self:flex-start; display:inline-flex; align-items:center; gap:8px; font-size:.82rem;
  padding:9px 14px; width:auto;
}
.tuki-chat-msg-wa svg{ width:16px; height:16px; }

.tuki-chat-chips{ display:flex; flex-wrap:wrap; gap:8px; padding:0 16px 12px; }
.tuki-chat-chip{
  background:transparent; border:1px solid var(--tuki-card-border); color:var(--tuki-cream-dim);
  border-radius:999px; padding:7px 13px; font-size:.78rem; cursor:pointer; transition:.2s;
}
.tuki-chat-chip:hover{ border-color:var(--tuki-gold); color:var(--tuki-gold-light); }

.tuki-chat-form{ display:flex; gap:8px; padding:10px 16px; border-top:1px solid var(--tuki-card-border); }
.tuki-chat-form input{
  flex:1; background:var(--tuki-card); border:1px solid var(--tuki-card-border); border-radius:999px;
  padding:11px 16px; color:var(--tuki-cream); font-size:.9rem; font-family:var(--font-body);
}
.tuki-chat-form input:focus{ outline:none; border-color:var(--tuki-gold); }
.tuki-chat-form input::placeholder{ color:var(--tuki-cream-dim); opacity:.7; }
.tuki-chat-form button{
  width:42px; height:42px; border-radius:50%; background:var(--tuki-gold); border:none; color:#211809;
  display:flex; align-items:center; justify-content:center; flex-shrink:0; cursor:pointer;
}
.tuki-chat-form button svg{ width:18px; height:18px; }

.tuki-chat-wa{
  display:flex; align-items:center; justify-content:center; gap:8px; margin:0 16px 14px; padding:11px 16px;
  font-size:.84rem;
}
.tuki-chat-wa svg{ width:16px; height:16px; }

@media (min-width:640px){
  .tuki-chat-panel{ left:auto; right:18px; bottom:90px; width:380px; max-height:min(600px,78vh); border-radius:var(--tuki-radius-lg); border:1px solid var(--tuki-card-border); box-shadow:var(--tuki-shadow); transform:translateY(16px) scale(.98); opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s ease; }
  .tuki-chat-panel.open{ transform:translateY(0) scale(1); opacity:1; pointer-events:auto; }
}