/* =========================================================
   Chatbot Cañadas del Sur — burbuja y ventana de chat
   ========================================================= */
.cb{
  --cb-bosque:#0B1F16;--cb-bosque-2:#12301F;--cb-bosque-3:#1C4230;
  --cb-oro:#C2A15A;--cb-oro-claro:#DCC48E;--cb-piedra:#ECEEE7;
  --cb-tinta:#16271D;--cb-niebla:#A7B5AB;--cb-blanco:#FBFBF8;
  --cb-ease:cubic-bezier(.33,1,.68,1);
  position:fixed;right:24px;bottom:24px;z-index:120;
  font-family:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.cb *{box-sizing:border-box}

/* ---------- Botón flotante ---------- */
.cb__fab{
  position:relative;display:flex;align-items:center;gap:10px;
  height:56px;padding:0 20px 0 8px;border:1px solid rgba(194,161,90,.55);border-radius:999px;
  background:var(--cb-bosque);color:var(--cb-blanco);cursor:pointer;
  box-shadow:0 14px 32px -14px rgba(11,31,22,.8),0 2px 6px rgba(11,31,22,.18);
  font:inherit;font-size:12.8px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;
  transition:transform .4s var(--cb-ease),background .35s,box-shadow .35s,opacity .3s;
}
.cb__fab:hover{background:var(--cb-bosque-2);transform:translateY(-2px);box-shadow:0 18px 36px -14px rgba(11,31,22,.85),0 2px 6px rgba(11,31,22,.2)}
.cb__fab:focus-visible,.cb button:focus-visible,.cb a:focus-visible{outline:2px solid var(--cb-oro);outline-offset:3px}
.cb__fab-ico{
  flex:none;width:42px;height:42px;border-radius:50%;
  background:var(--cb-piedra);display:flex;align-items:center;justify-content:center;
  box-shadow:inset 0 0 0 1px rgba(194,161,90,.35);
}
.cb__fab-ico img{width:34px;height:auto;display:block;transform:translateX(.75px)}
.cb__fab-txt{white-space:nowrap}
.cb.is-open .cb__fab,.cb.is-open .cb__wa{opacity:0;pointer-events:none;transform:translateY(8px) scale(.96)}

/* ---------- WhatsApp directo ---------- */
.cb__stack{display:flex;flex-direction:column;align-items:flex-end;gap:12px;transition:opacity .45s var(--cb-ease),transform .5s var(--cb-ease)}
.cb.is-tucked:not(.is-open) .cb__stack{opacity:0;transform:translateY(24px);pointer-events:none}
.cb__wa{
  display:grid;place-items:center;width:52px;height:52px;margin-right:2px;border-radius:50%;
  background:#25D366;color:#fff;text-decoration:none;
  box-shadow:0 12px 26px -12px rgba(11,31,22,.75),0 2px 6px rgba(11,31,22,.15);
  transition:transform .4s var(--cb-ease),opacity .3s,box-shadow .35s;
}
.cb__wa:hover{transform:translateY(-2px) scale(1.04)}
.cb__wa svg{width:28px;height:28px}

/* Globito de bienvenida */
.cb__hint{
  position:absolute;right:calc(100% + 12px);bottom:4px;width:max-content;max-width:230px;
  background:var(--cb-blanco);color:var(--cb-tinta);border-radius:14px 14px 4px 14px;
  padding:12px 34px 12px 14px;font-size:14px;line-height:1.4;font-weight:500;
  box-shadow:0 14px 30px -14px rgba(11,31,22,.55),0 0 0 1px rgba(22,39,29,.08);
  opacity:0;transform:translateY(8px);pointer-events:none;
  transition:opacity .45s var(--cb-ease),transform .45s var(--cb-ease);
}
.cb__hint.is-on{opacity:1;transform:none;pointer-events:auto}
.cb__hint button{
  position:absolute;top:6px;right:6px;width:22px;height:22px;border:0;border-radius:50%;
  background:transparent;color:#6E8274;font-size:16px;line-height:1;cursor:pointer;
}
.cb__hint button:hover{background:var(--cb-piedra)}
.cb.is-open .cb__hint{display:none}

/* ---------- Ventana ---------- */
.cb__panel{
  position:absolute;right:0;bottom:0;width:384px;height:min(600px,calc(100vh - 120px));height:min(600px,calc(100dvh - 120px));
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--cb-blanco);color:var(--cb-tinta);border-radius:22px;
  box-shadow:0 30px 70px -24px rgba(11,31,22,.65),0 0 0 1px rgba(22,39,29,.08);
  transform-origin:bottom right;opacity:0;transform:translateY(16px) scale(.97);visibility:hidden;
  transition:opacity .4s var(--cb-ease),transform .45s var(--cb-ease),visibility 0s .45s;
}
.cb.is-open .cb__panel{opacity:1;transform:none;visibility:visible;transition:opacity .4s var(--cb-ease),transform .45s var(--cb-ease),visibility 0s}

.cb__head{
  position:relative;display:flex;align-items:center;gap:12px;padding:18px 16px 18px 18px;
  background:var(--cb-bosque);color:var(--cb-blanco);
}
.cb__head::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:1px;background:linear-gradient(90deg,var(--cb-oro),transparent)}
.cb__avatar{flex:none;width:42px;height:42px;border-radius:50%;background:var(--cb-bosque-2);border:1px solid rgba(194,161,90,.5);display:grid;place-items:center}
.cb__avatar img{width:30px;height:auto}
.cb__title{flex:1;min-width:0}
.cb__title strong{display:block;font-size:15px;font-weight:700;letter-spacing:-.01em}
.cb__title span{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--cb-niebla);margin-top:2px}
.cb__title span::before{content:"";width:7px;height:7px;border-radius:50%;background:#5BD38A}
.cb__iconbtn{
  flex:none;width:36px;height:36px;border:0;border-radius:50%;display:grid;place-items:center;
  background:transparent;color:var(--cb-blanco);cursor:pointer;transition:background .25s;
}
.cb__iconbtn:hover{background:rgba(251,251,248,.1)}
.cb__iconbtn svg{width:18px;height:18px}

/* Mensajes */
.cb__body{
  flex:1;overflow-y:auto;overscroll-behavior:contain;padding:18px 16px 8px;
  display:flex;flex-direction:column;gap:10px;background:var(--cb-piedra);
  scrollbar-width:thin;scrollbar-color:rgba(22,39,29,.2) transparent;
}
.cb__msg{
  max-width:86%;padding:11px 14px;border-radius:16px;font-size:14.5px;line-height:1.5;
  overflow-wrap:anywhere;animation:cbIn .4s var(--cb-ease) both;
}
.cb__msg p{margin:0}
.cb__msg p+p,.cb__msg p+ul,.cb__msg ul+p{margin-top:8px}
.cb__msg ul{margin:6px 0 0;padding-left:18px}
.cb__msg li{margin:2px 0}
.cb__msg li::marker{color:var(--cb-oro)}
.cb__msg strong{font-weight:700}
.cb__msg a{color:inherit;text-decoration:underline;text-decoration-color:var(--cb-oro);text-underline-offset:3px}
.cb__msg--bot{align-self:flex-start;background:var(--cb-blanco);border-bottom-left-radius:4px;box-shadow:0 1px 0 rgba(22,39,29,.06)}
.cb__msg--user{align-self:flex-end;background:var(--cb-bosque-3);color:var(--cb-blanco);border-bottom-right-radius:4px}
.cb__msg--err{background:#FFF5EC;color:#7A4A1E}
@keyframes cbIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.cb__typing{display:inline-flex;gap:4px;padding:4px 2px}
.cb__typing i{width:7px;height:7px;border-radius:50%;background:var(--cb-oro);opacity:.35;animation:cbDot 1.1s infinite}
.cb__typing i:nth-child(2){animation-delay:.15s}
.cb__typing i:nth-child(3){animation-delay:.3s}
@keyframes cbDot{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}

/* Sugerencias */
.cb__chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.cb__chip{
  border:1px solid rgba(28,66,48,.28);background:var(--cb-blanco);color:var(--cb-bosque-3);
  border-radius:999px;padding:8px 12px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;
  transition:background .25s,border-color .25s,color .25s;
}
.cb__chip:hover{background:var(--cb-bosque-3);border-color:var(--cb-bosque-3);color:var(--cb-blanco)}

/* Asesor (WhatsApp) */
.cb__cta{
  align-self:flex-start;display:inline-flex;align-items:center;gap:8px;margin-top:2px;
  background:var(--cb-oro);color:var(--cb-bosque);border-radius:10px;padding:10px 14px;
  font-size:12.5px;font-weight:700;letter-spacing:.01em;text-transform:uppercase;text-decoration:none;
  transition:background .3s;animation:cbIn .4s var(--cb-ease) both;
}
.cb__cta:hover{background:var(--cb-oro-claro)}
.cb__cta svg{width:16px;height:16px}

/* Escribir */
.cb__form{display:flex;align-items:flex-end;gap:8px;padding:12px 12px 10px;background:var(--cb-blanco);border-top:1px solid rgba(22,39,29,.08)}
.cb__input{
  flex:1;min-height:44px;max-height:120px;resize:none;border:1px solid rgba(22,39,29,.16);border-radius:14px;
  padding:11px 14px;font:inherit;font-size:16px;line-height:1.35;color:var(--cb-tinta);background:var(--cb-blanco);
  transition:border-color .25s;
}
.cb__input::placeholder{color:#8E9C92}
.cb__input:focus{outline:none;border-color:var(--cb-oro)}
.cb__send{
  flex:none;width:44px;height:44px;border:0;border-radius:12px;display:grid;place-items:center;
  background:var(--cb-bosque);color:var(--cb-oro);cursor:pointer;transition:background .25s,opacity .25s;
}
.cb__send:hover{background:var(--cb-bosque-3)}
.cb__send:disabled{opacity:.4;cursor:default}
.cb__send svg{width:18px;height:18px}
.cb__legal{padding:0 14px 10px;background:var(--cb-blanco);font-size:11px;line-height:1.35;color:#7C8F81;text-align:center}

/* ---------- Celular ---------- */
@media (max-width:560px){
  .cb{right:16px;bottom:16px}
  .cb__fab{height:52px;padding:0 6px}
  .cb__fab-txt{display:none}
  .cb__hint{max-width:calc(100vw - 100px)}
  .cb__fab-ico{width:44px;height:44px}
  .cb__fab-ico img{width:36px}
  .cb__panel{
    position:fixed;inset:auto 0 0 0;width:100%;height:100%;height:100dvh;border-radius:0;
    transform-origin:bottom center;
  }
  .cb__head{padding-top:max(18px,env(safe-area-inset-top))}
  .cb__legal{padding-bottom:max(10px,env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){
  .cb *,.cb *::before,.cb *::after{animation:none!important;transition:none!important}
}
