:root{
  --sp-chat-blue:#2563eb;
  --sp-chat-blue-2:#1e40af;
  --sp-chat-navy:#0f172a;
  --sp-chat-green:#16a34a;
  --sp-chat-bg:#f8fafc;
  --sp-chat-border:#dbe4f0;
  --sp-chat-text:#0f172a;
  --sp-chat-muted:#64748b;
}
.sp-chatbot-toggle,.sp-chatbot-panel,.sp-chatbot-panel *{box-sizing:border-box;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
.sp-chatbot-toggle{position:fixed;right:22px;bottom:96px;z-index:99999;border:0;border-radius:50%;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;box-shadow:0 18px 45px rgba(22,163,74,.32),0 6px 16px rgba(15,23,42,.16);width:64px;height:64px;padding:0;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:0;transition:transform .18s ease,opacity .18s ease,box-shadow .18s ease}
.sp-chatbot-toggle:hover{transform:translateY(-2px);box-shadow:0 22px 55px rgba(22,163,74,.38),0 8px 18px rgba(15,23,42,.18)}
.sp-chatbot-toggle.hidden{opacity:0;pointer-events:none;transform:translateY(10px)}
.sp-toggle-icon{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.18);font-size:18px}.sp-toggle-text{display:none}
.sp-chatbot-panel{position:fixed;right:22px;bottom:92px;width:410px;max-width:calc(100vw - 28px);height:640px;max-height:calc(100vh - 118px);z-index:99999;background:#fff;border-radius:24px;box-shadow:0 30px 85px rgba(15,23,42,.28);overflow:hidden;display:none;border:1px solid rgba(219,228,240,.95)}
.sp-chatbot-panel.open{display:flex;flex-direction:column;animation:spChatIn .18s ease-out}@keyframes spChatIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.sp-chatbot-head{background:radial-gradient(circle at 15% 15%,#3b82f6 0,#2563eb 38%,#0f172a 100%);color:#fff;padding:17px 17px;display:flex;align-items:center;justify-content:space-between;gap:12px}.sp-head-brand{display:flex;align-items:center;gap:12px;min-width:0}.sp-head-logo{width:42px;height:42px;border-radius:16px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-weight:950;letter-spacing:-.5px}.sp-chatbot-title{font-weight:950;font-size:16px;line-height:1.15}.sp-chatbot-sub{font-size:12px;opacity:.9;margin-top:5px;display:flex;align-items:center;gap:6px}.sp-live-dot{width:8px;height:8px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 5px rgba(34,197,94,.16)}.sp-chatbot-close{border:0;background:rgba(255,255,255,.13);color:#fff;border-radius:14px;width:38px;height:38px;cursor:pointer;font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .15s ease,transform .15s ease}.sp-chatbot-close:hover{background:rgba(255,255,255,.23);transform:rotate(4deg)}
.sp-chatbot-messages{flex:1;overflow:auto;padding:18px 16px;background:linear-gradient(180deg,#f8fafc 0,#eef4ff 100%);scroll-behavior:smooth}.sp-chatbot-messages::-webkit-scrollbar{width:8px}.sp-chatbot-messages::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}.sp-chatbot-messages::-webkit-scrollbar-track{background:transparent}.sp-msg{display:flex;align-items:flex-end;gap:9px;margin:0 0 14px}.sp-msg.user{justify-content:flex-end}.sp-msg.user .sp-avatar{order:2}.sp-avatar{width:30px;height:30px;border-radius:50%;flex:0 0 auto;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:950}.sp-avatar.bot{background:#dbeafe;color:#1d4ed8}.sp-avatar.user{background:#d1fae5;color:#047857}.sp-bubble{max-width:78%;padding:12px 14px;border-radius:18px;font-size:14px;line-height:1.5;word-break:break-word}.sp-msg.bot .sp-bubble{background:#fff;border:1px solid #e2e8f0;color:var(--sp-chat-text);border-bottom-left-radius:7px;box-shadow:0 8px 22px rgba(15,23,42,.055)}.sp-msg.user .sp-bubble{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border-bottom-right-radius:7px;box-shadow:0 10px 22px rgba(37,99,235,.18)}.sp-bubble a{color:#2563eb;font-weight:800;text-decoration:none;border-bottom:1px solid rgba(37,99,235,.28)}.sp-bubble a:hover{text-decoration:underline}.sp-msg.user .sp-bubble a{color:#fff;border-bottom-color:rgba(255,255,255,.5)}
.sp-typing{display:flex;gap:5px;align-items:center;min-width:58px}.sp-typing span{width:7px;height:7px;border-radius:999px;background:#94a3b8;display:inline-block;animation:spTyping 1s infinite ease-in-out}.sp-typing span:nth-child(2){animation-delay:.12s}.sp-typing span:nth-child(3){animation-delay:.24s}@keyframes spTyping{0%,80%,100%{transform:translateY(0);opacity:.45}40%{transform:translateY(-4px);opacity:1}}
.sp-products-row{align-items:flex-start}.sp-products-row .sp-avatar{margin-top:4px}.sp-product-list{width:min(310px,calc(100% - 39px));display:flex;flex-direction:column;gap:10px}.sp-product-card{background:#fff;border:1px solid #dbeafe;border-radius:17px;padding:12px;box-shadow:0 10px 24px rgba(15,23,42,.06)}.sp-product-title{display:block;color:#0f172a;text-decoration:none;font-weight:950;font-size:14px;line-height:1.35}.sp-product-title:hover{color:#2563eb;text-decoration:underline}.sp-product-type{font-size:11px;color:#64748b;margin-top:4px;line-height:1.35}.sp-product-prices{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.sp-price-pill{background:#eff6ff;color:#1e3a8a;border:1px solid #dbeafe;border-radius:999px;padding:6px 8px;font-size:11px;line-height:1}.sp-product-actions{margin-top:10px}.sp-product-view{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:#2563eb;color:#fff;text-decoration:none;font-weight:900;font-size:12px;padding:8px 11px}.sp-product-view:hover{background:#1d4ed8}
.sp-chatbot-quick{display:flex;gap:8px;flex-wrap:wrap;padding:12px 14px;background:#f8fafc;border-top:1px solid #e2e8f0}.sp-chip{border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:999px;padding:9px 11px;font-weight:850;font-size:12px;cursor:pointer;transition:background .15s ease,transform .15s ease}.sp-chip:hover{background:#dbeafe;transform:translateY(-1px)}.sp-chatbot-form{display:flex;gap:10px;padding:13px;background:#fff;border-top:1px solid #e2e8f0}.sp-chatbot-input{flex:1;min-width:0;border:1px solid #cbd5e1;border-radius:16px;padding:14px 14px;font-size:14px;outline:none;background:#fff;color:#0f172a}.sp-chatbot-input:focus{border-color:#2563eb;box-shadow:0 0 0 4px rgba(37,99,235,.13)}.sp-chatbot-send{border:0;border-radius:16px;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;padding:0 18px;font-weight:950;cursor:pointer;min-width:78px;box-shadow:0 10px 20px rgba(37,99,235,.18)}.sp-chatbot-send:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}
@media(max-width:640px){.sp-chatbot-toggle{right:14px;bottom:52px;width:40px;height:40px;padding:0}.sp-toggle-icon{width:30px;height:30px;font-size:18px}.sp-chatbot-panel{right:10px;left:10px;bottom:86px;width:auto;height:min(640px,calc(100dvh - 108px));max-height:calc(100dvh - 108px);border-radius:22px}.sp-chatbot-head{padding:15px}.sp-head-logo{width:38px;height:38px;border-radius:14px}.sp-chatbot-title{font-size:15px}.sp-chatbot-sub{font-size:11px}.sp-chatbot-messages{padding:15px 12px}.sp-bubble{max-width:84%;font-size:14px}.sp-product-list{width:calc(100% - 39px)}.sp-chatbot-quick{padding:10px 12px}.sp-chip{font-size:11px;padding:8px 10px}.sp-chatbot-form{padding:11px}.sp-chatbot-input{padding:13px 12px}.sp-chatbot-send{min-width:70px;padding:0 14px}}


/* SoftwaresPlanet chatbot UI v7 refinements */
.sp-products-row .sp-avatar{
  display:none !important;
}
.sp-products-row{
  margin-left:0 !important;
}
.sp-product-list{
  width:100% !important;
  max-width:100% !important;
}
.sp-product-card{
  border-radius:16px !important;
  border:1px solid #dbeafe !important;
  background:#ffffff !important;
  padding:13px 14px !important;
}
.sp-product-title{
  color:#0f172a !important;
  font-weight:900 !important;
  text-decoration:none !important;
  border-bottom:0 !important;
}
.sp-product-title::after{
  content:"  →";
  color:#2563eb;
  font-weight:900;
}
.sp-product-view{
  display:none !important;
}
.sp-bubble a{
  text-decoration:none !important;
}
.sp-bubble a[href^="http"]{
  word-break:break-word;
}

.sp-chatbot-toggle{
  width:62px !important;
  height:62px !important;
  padding:0 !important;
  border-radius:50% !important;
  right:22px !important;
  bottom:96px !important;
}
.sp-toggle-text{display:none !important;}
@media(max-width:640px){
  .sp-chatbot-toggle{
    right:14px !important;
    bottom:82px !important;
    width:40px !important;
    height:40px !important;
  }
}


/* SoftwaresPlanet chatbot UI v8 - compact panel and cleaner mobile position */
.sp-chatbot-toggle{
  width:56px !important;
  height:56px !important;
  right:22px !important;
  bottom:75px !important;
  border-radius:50% !important;
  padding:0 !important;
}
.sp-toggle-icon{
  width:30px !important;
  height:30px !important;
  font-size:17px !important;
}
.sp-toggle-text{
  display:none !important;
}

.sp-chatbot-panel{
  width:390px !important;
  height:560px !important;
  max-height:calc(100vh - 125px) !important;
  right:22px !important;
  bottom:92px !important;
  border-radius:22px !important;
}

.sp-chatbot-head{
  padding:14px 16px !important;
}
.sp-head-logo{
  width:38px !important;
  height:38px !important;
  border-radius:14px !important;
}
.sp-chatbot-title{
  font-size:15px !important;
}
.sp-chatbot-sub{
  font-size:11px !important;
}
.sp-chatbot-close{
  width:36px !important;
  height:36px !important;
}

.sp-chatbot-messages{
  padding:14px 14px !important;
}
.sp-avatar{
  width:24px !important;
  height:24px !important;
  font-size:9px !important;
}
.sp-bubble{
  font-size:14px !important;
  max-width:82% !important;
  padding:11px 13px !important;
}
.sp-chatbot-quick{
  padding:10px 12px !important;
}
.sp-chip{
  padding:8px 10px !important;
  font-size:12px !important;
}
.sp-chatbot-form{
  padding:11px !important;
}
.sp-chatbot-input{
  padding:12px 13px !important;
}
.sp-chatbot-send{
  min-width:72px !important;
}

@media(max-width:640px){
  .sp-chatbot-toggle{
    width:40px !important;
    height:40px !important;
    right:14px !important;
    bottom:82px !important;
  }
  .sp-chatbot-panel{
    left:8px !important;
    right:8px !important;
    bottom:74px !important;
    width:auto !important;
    height:min(560px, calc(100dvh - 92px)) !important;
    max-height:calc(100dvh - 92px) !important;
    border-radius:20px !important;
  }
  .sp-chatbot-head{
    padding:13px 14px !important;
  }
  .sp-head-logo{
    width:35px !important;
    height:35px !important;
  }
  .sp-chatbot-title{
    font-size:14px !important;
  }
  .sp-chatbot-sub{
    font-size:10.5px !important;
  }
  .sp-chatbot-close{
    width:34px !important;
    height:34px !important;
  }
  .sp-chatbot-messages{
    padding:12px 10px !important;
  }
  .sp-bubble{
    max-width:86% !important;
  }
  .sp-chatbot-form{
    padding:9px !important;
  }
  .sp-chatbot-input{
    font-size:13px !important;
  }
  .sp-chatbot-send{
    min-width:66px !important;
    padding:0 13px !important;
  }
}


/* v10 toggle icon refinement */
.sp-chatbot-toggle{
  width:40px !important;
  height:40px !important;
  min-width:52px !important;
  min-height:52px !important;
  border-radius:50% !important;
  padding:0 !important;
}
.sp-toggle-icon{
  width:auto !important;
  height:auto !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:30px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#ffffff !important;
}
@media(max-width:640px){
  .sp-chatbot-toggle{
    width:40px !important;
    height:40px !important;
    min-width:52px !important;
    min-height:52px !important;
    right:14px !important;
    bottom:82px !important;
  }
  .sp-toggle-icon{
    font-size:28px !important;
  }
}


/* v11 smaller toggle to match blue move-to-top button */
.sp-chatbot-toggle{
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  min-height:40px !important;
  border-radius:50% !important;
  padding:0 !important;
}
.sp-toggle-icon{
  font-size:20px !important;
  line-height:1 !important;
}
@media(max-width:640px){
  .sp-chatbot-toggle{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
    right:12px !important;
    bottom:60px !important;
  }
  .sp-toggle-icon{
    font-size:24px !important;
  }
}
