/* ── Base ─────────────────────────────────────────────────────────────── */
.pcm-chatbot-v0{
  max-width:720px;margin:24px auto;
  border:1px solid #e5e7eb;border-radius:18px;overflow:hidden;
  background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.06);
  font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}

/* ── Header ───────────────────────────────────────────────────────────── */
.pcm-chatbot-v0__header{
  display:flex;align-items:center;gap:12px;
  padding:13px 14px;
  background:linear-gradient(135deg,#6d28d9 0%,#800BC3 60%,#9333ea 100%);
  color:#fff;min-height:58px;
}
.pcm-chatbot-v0__header-avatar{
  width:24px;height:24px;border-radius:50%;
  background:rgba(255,255,255,.2);
  overflow:hidden;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  border:2px solid rgba(255,255,255,.35);
  font-size:12px;line-height:1;
}
.pcm-chatbot-v0__header-avatar img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.pcm-chatbot-v0__header-info{
  flex:1;min-width:0;
}
.pcm-chatbot-v0__header-title{
  font-size:14px;font-weight:700;display:block;line-height:1.15;
}
.pcm-chatbot-v0__header-status{
  font-size:11px;opacity:.85;display:flex;align-items:center;gap:5px;
  margin-top:1px;
}
.pcm-chatbot-v0__header-status::before{
  content:'';width:7px;height:7px;border-radius:50%;
  background:#4ade80;display:inline-block;flex-shrink:0;
  box-shadow:0 0 0 2px rgba(74,222,128,.35);
}
.pcm-chatbot-v0__header-close{
  background:rgba(255,255,255,.15);border:none;color:#fff;
  width:28px;height:28px;border-radius:50%;
  cursor:pointer;font-size:14px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:background .15s;
}
.pcm-chatbot-v0__header-close:hover{background:rgba(255,255,255,.3)}

/* ── Messages area ────────────────────────────────────────────────────── */
.pcm-chatbot-v0__messages{
  padding:16px;min-height:260px;max-height:520px;
  overflow:auto;background:#f8fafc;
}
.pcm-chatbot-v0__row{display:flex;margin:0 0 12px}
.pcm-chatbot-v0__row--user{justify-content:flex-end}
.pcm-chatbot-v0__row--bot{justify-content:flex-start}
.pcm-chatbot-v0__bubble{max-width:85%;padding:12px 14px;border-radius:16px}
.pcm-chatbot-v0__bubble--user{
  background:linear-gradient(135deg,#7c3aed,#9333ea);
  color:#fff;border-bottom-right-radius:4px;
}
.pcm-chatbot-v0__bubble--bot{
  background:#fff;color:#111827;
  border:1px solid #e5e7eb;border-bottom-left-radius:4px;
  box-shadow:0 1px 4px rgba(0,0,0,.05);
}
.pcm-chatbot-v0__intro{font-weight:600;margin-bottom:8px;line-height:1.4}

/* ── Cards (lista de productos de pedido) ─────────────────────────────── */
.pcm-chatbot-v0__card{padding:10px 0;border-top:1px solid #eef2f7}
.pcm-chatbot-v0__card:first-of-type{border-top:none}
.pcm-chatbot-v0__card--selected{background:#faf5ff;border-radius:12px;padding:12px;border:1px solid #e9d5ff}
.pcm-chatbot-v0__title{display:block;font-weight:600;color:#111827;text-decoration:none;margin-bottom:4px}
.pcm-chatbot-v0__title:hover{color:#7c3aed}
.pcm-chatbot-v0__meta{color:#6b7280;font-size:13px}

/* ── Chips de acción ──────────────────────────────────────────────────── */
.pcm-chatbot-v0__actions{display:flex;gap:8px;flex-wrap:wrap;padding-top:10px}
.pcm-chatbot-v0__actionchip{
  border:1px solid #d8ccff;background:#f7f2ff;color:#5b21b6;
  padding:7px 12px;border-radius:999px;cursor:pointer;font:inherit;
  font-size:13px;font-weight:500;transition:background .12s,border-color .12s;
}
.pcm-chatbot-v0__actionchip:hover{background:#ede9fe;border-color:#a78bfa}
.pcm-chatbot-v0__actionchip--link{
  display:inline-flex;align-items:center;gap:4px;
  text-decoration:none;color:inherit;
}

/* ── Form ─────────────────────────────────────────────────────────────── */
.pcm-chatbot-v0__form{
  display:flex;gap:10px;padding:12px 14px;
  border-top:1px solid #e5e7eb;background:#fff;
}
.pcm-chatbot-v0__form input{
  flex:1;border:1px solid #d1d5db;border-radius:24px;
  padding:10px 16px;font:inherit;font-size:14px;
  outline:none;transition:border-color .15s;
}
.pcm-chatbot-v0__form input:focus{border-color:#800BC3;box-shadow:0 0 0 3px rgba(128,11,195,.1)}
.pcm-chatbot-v0__form button{
  border:none;border-radius:50%;width:42px;height:42px;min-width:42px;
  background:linear-gradient(135deg,#7c3aed,#9333ea);
  color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;transition:transform .12s,box-shadow .12s;
}
.pcm-chatbot-v0__form button:hover{transform:scale(1.07);box-shadow:0 4px 12px rgba(124,58,237,.4)}

/* ── Misc ─────────────────────────────────────────────────────────────── */
.pcm-chatbot-v0__empty{color:#6b7280;font-size:13px;padding-top:4px}
.pcm-chatbot-v0__quick{display:none}
.pcm-chatbot-v0__quickbtn{display:none}
.pcm-chatbot-v0__welcome-title{font-weight:700;line-height:1.45;margin-bottom:6px}
.pcm-chatbot-v0__privacy{font-size:12px;line-height:1.45;color:#9ca3af;margin-top:4px}
.pcm-chatbot-v0__privacy a{color:#800BC3;text-decoration:none;font-weight:600}

/* ── Visual rail (carrusel de productos) ──────────────────────────────── */
.pcm-chatbot-v0__vrail{
  display:flex;gap:10px;overflow-x:auto;
  scroll-snap-type:x proximity;padding:4px 2px 8px;
  scrollbar-width:thin;scrollbar-color:rgba(128,11,195,.2) transparent;
}
.pcm-chatbot-v0__vcard{
  min-width:178px;max-width:178px;display:flex;flex-direction:column;
  border:1px solid rgba(128,11,195,.12);border-radius:14px;
  background:linear-gradient(180deg,#fff 0%,#fcf8ff 100%);
  box-shadow:0 4px 14px rgba(128,11,195,.07);
  overflow:hidden;text-decoration:none;color:inherit;
  scroll-snap-align:start;transition:box-shadow .15s,border-color .15s;
}
.pcm-chatbot-v0__vcard:hover{box-shadow:0 6px 20px rgba(128,11,195,.14);border-color:rgba(128,11,195,.28)}
.pcm-chatbot-v0__vcard--large{min-width:100%;max-width:100%;flex-direction:row}
.pcm-chatbot-v0__vcard-media{background:#fff;aspect-ratio:1/1;border-bottom:1px solid rgba(0,0,0,.05)}
.pcm-chatbot-v0__vcard--large .pcm-chatbot-v0__vcard-media{width:132px;min-width:132px;aspect-ratio:auto;border-bottom:0;border-right:1px solid rgba(0,0,0,.05)}
.pcm-chatbot-v0__vcard-img{width:100%;height:100%;object-fit:contain;display:block}
.pcm-chatbot-v0__vcard-body{padding:9px 10px 10px}
.pcm-chatbot-v0__vcard-badge{display:inline-flex;padding:4px 8px;border-radius:999px;background:#f3e8ff;color:#6b21a8;font-size:11px;font-weight:700;margin-bottom:7px;width:max-content}
.pcm-chatbot-v0__vcard-title{font-size:13px;font-weight:800;line-height:1.25;margin-bottom:7px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcm-chatbot-v0__vcard--large .pcm-chatbot-v0__vcard-title{font-size:15px;-webkit-line-clamp:3}
.pcm-chatbot-v0__vcard-blurb{font-size:12px;line-height:1.4;color:#374151;margin-bottom:8px}
.pcm-chatbot-v0__vcard-chips{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px}
.pcm-chatbot-v0__vchip{display:inline-flex;padding:3px 7px;border-radius:999px;background:#f3f4f6;font-size:11px;line-height:1.1}
.pcm-chatbot-v0__vchip.is-ok{background:#ecfdf5;color:#166534}
.pcm-chatbot-v0__vchip.is-off{background:#fef2f2;color:#991b1b}
.pcm-chatbot-v0__vcard-price{font-size:16px;font-weight:800;color:#800BC3}
.pcm-chatbot-v0__relatedtitle{font-size:13px;font-weight:700;margin:12px 0 8px;color:#374151}
@media (max-width:640px){
  .pcm-chatbot-v0__vcard{min-width:160px;max-width:160px}
  .pcm-chatbot-v0__vcard--large .pcm-chatbot-v0__vcard-media{width:110px;min-width:110px}
}

/* ── Comparador VS ────────────────────────────────────────────────────── */
.pcm-chatbot-v0__vs-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:start;margin-top:10px}
.pcm-chatbot-v0__vs-sep{display:flex;align-items:center;justify-content:center;padding-top:52px}
.pcm-chatbot-v0__vs-badge{background:#7c3aed;color:#fff;font-size:11px;font-weight:900;border-radius:999px;padding:4px 8px;letter-spacing:.04em}
.pcm-chatbot-v0__vs-card{display:flex;flex-direction:column;border:1px solid rgba(128,11,195,.15);border-radius:14px;background:linear-gradient(180deg,#fff 0%,#fcf8ff 100%);box-shadow:0 4px 14px rgba(128,11,195,.07);overflow:hidden;text-decoration:none;color:inherit}
.pcm-chatbot-v0__vs-card:hover{border-color:rgba(128,11,195,.35)}
.pcm-chatbot-v0__vs-card-a{border-top:3px solid #22c55e}
.pcm-chatbot-v0__vs-card-b{border-top:3px solid #3b82f6}
.pcm-chatbot-v0__vs-media{background:#fff;aspect-ratio:1/1;border-bottom:1px solid rgba(0,0,0,.05)}
.pcm-chatbot-v0__vs-img{width:100%;height:100%;object-fit:contain;display:block}
.pcm-chatbot-v0__vs-body{padding:9px 10px 10px}
.pcm-chatbot-v0__vs-pos{font-size:10px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;margin-bottom:5px}
.pcm-chatbot-v0__vs-card-a .pcm-chatbot-v0__vs-pos{color:#16a34a}
.pcm-chatbot-v0__vs-card-b .pcm-chatbot-v0__vs-pos{color:#2563eb}
.pcm-chatbot-v0__vs-name{font-size:12px;font-weight:800;line-height:1.25;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pcm-chatbot-v0__vs-chips{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:7px}
.pcm-chatbot-v0__vs-price{font-size:15px;font-weight:800;color:#800BC3;margin-top:auto}
@media(max-width:480px){
  .pcm-chatbot-v0__vs-grid{gap:5px}
  .pcm-chatbot-v0__vs-name{font-size:11px}
  .pcm-chatbot-v0__vs-price{font-size:13px}
}

/* ── Botón carrito ────────────────────────────────────────────────────── */
.pcm-chatbot-v0__cartlink-wrap{margin:12px 0 4px}
.pcm-chatbot-v0__cartlink{
  display:inline-flex;align-items:center;gap:6px;
  padding:10px 20px;border-radius:999px;
  background:linear-gradient(135deg,#7c3aed,#9333ea);
  color:#fff;font-size:14px;font-weight:700;
  text-decoration:none;transition:box-shadow .15s,transform .12s;
}
.pcm-chatbot-v0__cartlink:hover{box-shadow:0 4px 14px rgba(124,58,237,.4);transform:translateY(-1px)}

/* ── Botón flotante ───────────────────────────────────────────────────── */
.pcm-float-btn{
  position:fixed;bottom:24px;right:24px;z-index:9999;
  width:72px;height:72px;border-radius:50%;
  background:linear-gradient(135deg,#6d28d9,#9333ea);
  border:none;
  box-shadow:0 6px 28px rgba(109,40,217,.5);
  cursor:pointer;overflow:hidden;
  padding:2px;transition:transform .15s,box-shadow .15s;
}
.pcm-float-btn:hover{transform:scale(1.08);box-shadow:0 8px 36px rgba(109,40,217,.65)}
.pcm-float-btn img{
  width:100%;height:100%;object-fit:cover;display:block;
  border-radius:50%;
}
.pcm-float-btn__icon{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-size:34px;color:#fff;
}
.pcm-float-btn__badge{
  position:absolute;top:-3px;right:-3px;
  background:#ef4444;color:#fff;border-radius:50%;
  width:22px;height:22px;font-size:11px;font-weight:700;
  display:none;align-items:center;justify-content:center;
  border:3px solid #fff;
}
.pcm-float-btn__badge.is-visible{display:flex}

/* ── Panel flotante ───────────────────────────────────────────────────── */
.pcm-float-panel{
  position:fixed;bottom:110px;right:24px;z-index:9998;
  width:min(420px, calc(100vw - 32px));
  max-height:min(710px, calc(100vh - 118px));
  display:flex;flex-direction:column;
  border-radius:20px;overflow:hidden;
  background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,.18),0 4px 20px rgba(109,40,217,.12);
  transform:translateY(20px) scale(.96);
  opacity:0;pointer-events:none;
  transition:transform .22s cubic-bezier(.34,1.56,.64,1),opacity .18s ease;
}
.pcm-float-panel.is-open{
  transform:translateY(0) scale(1);
  opacity:1;pointer-events:all;
}
.pcm-float-panel .pcm-chatbot-v0{
  max-width:100%;margin:0;border:none;border-radius:0;
  box-shadow:none;display:flex;flex-direction:column;height:100%;
}
.pcm-float-panel .pcm-chatbot-v0__messages{
  flex:1;min-height:0;max-height:none;
}

@media(max-width:480px){
  .pcm-float-panel{right:0;bottom:0;width:100vw;max-height:90vh;border-radius:20px 20px 0 0}
  .pcm-float-btn{bottom:16px;right:16px;width:56px;height:56px}
}