@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --suc-brand:#1b2d4f;
  --suc-brand-dark:#111e35;
  --suc-brand-light:#e8ecf4;
  --suc-gold:#c9a55a;
  --suc-gold-light:#f5edd8;
  --suc-surface:#ffffff;
  --suc-surface2:#f7f8fc;
  --suc-border:rgba(0,0,0,0.1);
  --suc-text:#111827;
  --suc-text2:#6b7280;
  --suc-text3:#9ca3af;
  --suc-success:#059669;
  --suc-success-bg:#ecfdf5;
  --suc-radius:14px;
  --suc-font:'DM Sans',system-ui,sans-serif;
}

/* LAUNCHER */
#suc-launcher{
  position:fixed;bottom:28px;right:28px;
  width:68px;height:68px;
  background:transparent;border-radius:50%;border:3px solid var(--suc-gold);
  cursor:pointer;z-index:9999;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 24px rgba(27,45,79,.5),0 0 0 0 rgba(201,165,90,.4);
  transition:transform .2s,box-shadow .2s;
  padding:0;overflow:hidden;
  font-family:var(--suc-font);
}
#suc-launcher:hover{transform:scale(1.07);box-shadow:0 6px 28px rgba(27,45,79,.6),0 0 0 0 rgba(201,165,90,.4)}
#suc-launcher .suc-icon-img{
  width:100%;height:100%;object-fit:cover;border-radius:50%;
  display:block;transition:opacity .2s;
}
#suc-launcher .suc-icon-close{
  display:none;position:absolute;
  width:22px;height:22px;fill:white;
}
#suc-launcher.open{background:#1b2d4f;}
#suc-launcher.open .suc-icon-img{opacity:0;}
#suc-launcher.open .suc-icon-close{display:block;}

/* TOOLTIP */
#suc-tooltip{
  position:fixed;bottom:36px;right:100px;
  background:#111827;color:#fff;
  font-family:var(--suc-font);font-size:13px;font-weight:500;line-height:1.45;
  padding:10px 14px;border-radius:10px;
  white-space:nowrap;
  z-index:9998;pointer-events:none;
  opacity:0;transform:translateX(8px) scale(.95);transform-origin:right center;
  transition:opacity .22s ease,transform .22s ease;
  box-shadow:0 4px 16px rgba(0,0,0,.22);
}
#suc-tooltip.suc-tip-visible{
  opacity:1;transform:translateX(0) scale(1);
}
#suc-tooltip::after{
  content:'';position:absolute;top:50%;right:-7px;transform:translateY(-50%);
  border:7px solid transparent;border-right-width:0;border-left-color:#111827;
}
#suc-tooltip .suc-tip-sub{
  display:block;font-size:11.5px;font-weight:400;color:rgba(255,255,255,.65);margin-top:2px;
}
@keyframes sucPulse{
  0%,100%{box-shadow:0 4px 20px rgba(26,86,219,.45),0 0 0 0 rgba(26,86,219,.55)}
  50%{box-shadow:0 4px 20px rgba(26,86,219,.45),0 0 0 10px rgba(26,86,219,0)}
}
@keyframes sucRing{
  0%{box-shadow:0 4px 24px rgba(27,45,79,.5),0 0 0 0 rgba(201,165,90,.5)}
  70%{box-shadow:0 4px 24px rgba(27,45,79,.5),0 0 0 16px rgba(201,165,90,0)}
  100%{box-shadow:0 4px 24px rgba(27,45,79,.5),0 0 0 0 rgba(201,165,90,0)}
}
#suc-launcher.suc-attention{
  animation:sucRing 1.4s ease-out 3;
}

/* WINDOW */
#suc-window{
  position:fixed;bottom:100px;right:28px;
  width:370px;height:620px;
  background:var(--suc-surface);border-radius:var(--suc-radius);
  border:1px solid var(--suc-border);
  display:flex;flex-direction:column;
  z-index:9998;overflow:hidden;
  box-shadow:0 12px 48px rgba(0,0,0,.14);
  transform:scale(.92) translateY(16px);
  opacity:0;pointer-events:none;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),opacity .2s;
  font-family:var(--suc-font);
}
#suc-window.suc-visible{transform:scale(1) translateY(0);opacity:1;pointer-events:all}

/* HEADER */
#suc-header{background:var(--suc-brand);padding:16px 18px;display:flex;align-items:center;gap:12px;flex-shrink:0;border-bottom:2px solid var(--suc-gold)}
.suc-logo{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.suc-logo svg{width:22px;height:22px;fill:white}
.suc-hinfo{flex:1}
.suc-hinfo h3{color:white;font-size:15px;font-weight:600;line-height:1.2}
.suc-hinfo p{color:rgba(255,255,255,.72);font-size:12px;margin-top:1px}
.suc-online{width:8px;height:8px;background:#4ade80;border-radius:50%;flex-shrink:0}

/* PROGRESS */
#suc-progress{height:3px;background:rgba(255,255,255,.2);flex-shrink:0}
#suc-progress-bar{height:100%;background:rgba(255,255,255,.9);width:0%;transition:width .5s ease}

/* BODY */
#suc-body{flex:1;overflow-y:auto;padding:18px 14px;display:flex;flex-direction:column;gap:14px;scroll-behavior:smooth}
#suc-body::-webkit-scrollbar{width:4px}
#suc-body::-webkit-scrollbar-thumb{background:var(--suc-border);border-radius:2px}

/* MESSAGES */
.suc-msg{display:flex;gap:8px;align-items:flex-end;animation:sucMsgIn .25s ease}
@keyframes sucMsgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.suc-msg.suc-user{flex-direction:row-reverse}
.suc-avatar{width:30px;height:30px;border-radius:50%;background:var(--suc-brand-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;border:1.5px solid var(--suc-gold)}
.suc-avatar svg{width:16px;height:16px;fill:var(--suc-brand)}
.suc-bubble{max-width:248px;padding:10px 14px;font-size:13.5px;line-height:1.55;border-radius:16px}
.suc-msg.suc-bot .suc-bubble{background:var(--suc-surface2);color:var(--suc-text);border-bottom-left-radius:4px;border:1px solid var(--suc-border)}
.suc-msg.suc-user .suc-bubble{background:var(--suc-brand);color:white;border-bottom-right-radius:4px}
.suc-bubble strong{font-weight:600}

/* TYPING */
.suc-typing{display:flex;gap:5px;padding:4px 2px;align-items:center}
.suc-typing span{width:7px;height:7px;background:var(--suc-text3);border-radius:50%;animation:sucDot .9s infinite}
.suc-typing span:nth-child(2){animation-delay:.18s}
.suc-typing span:nth-child(3){animation-delay:.36s}
@keyframes sucDot{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}

/* OPTIONS */
.suc-options{display:flex;flex-direction:column;gap:7px;padding-left:38px}
.suc-options.suc-row{flex-direction:row;flex-wrap:wrap}
.suc-opt{background:var(--suc-surface);border:1.5px solid var(--suc-gold);color:var(--suc-brand);border-radius:10px;padding:8px 13px;font-size:13px;font-family:var(--suc-font);font-weight:500;cursor:pointer;text-align:left;transition:background .15s,color .15s;line-height:1.3}
.suc-opt:hover{background:var(--suc-gold-light)}
.suc-opt:disabled{opacity:.5;cursor:default;pointer-events:none}
.suc-opt.suc-picked{background:var(--suc-brand);color:white}

/* FORM */
.suc-form{display:flex;flex-direction:column;gap:8px;padding-left:38px}
.suc-form input{border:1.5px solid var(--suc-border);border-radius:9px;padding:9px 12px;font-size:13px;font-family:var(--suc-font);background:var(--suc-surface);color:var(--suc-text);outline:none;transition:border-color .15s}
.suc-form input:focus{border-color:var(--suc-brand)}
.suc-form input.suc-err{border-color:#ef4444}
.suc-form .suc-submit{background:var(--suc-brand);color:white;border:none;border-radius:9px;padding:10px 14px;font-size:13px;font-family:var(--suc-font);font-weight:600;cursor:pointer;transition:background .15s}
.suc-form .suc-submit:hover{background:var(--suc-brand-dark)}
.suc-form .suc-submit:disabled{opacity:.6;cursor:default}

/* CTA */
.suc-cta-group{display:flex;flex-direction:column;gap:8px;padding-left:38px}
.suc-cta-primary{background:var(--suc-brand);color:white;border:none;border-radius:10px;padding:11px 16px;font-size:13.5px;font-family:var(--suc-font);font-weight:600;cursor:pointer;transition:background .15s;text-align:center}
.suc-cta-primary:hover{background:var(--suc-brand-dark)}
.suc-cta-secondary{background:var(--suc-surface);color:var(--suc-text2);border:1px solid var(--suc-border);border-radius:10px;padding:10px 16px;font-size:13px;font-family:var(--suc-font);cursor:pointer;transition:background .15s;text-align:center}
.suc-cta-secondary:hover{background:var(--suc-surface2)}

/* SUCCESS */
.suc-success{background:var(--suc-success-bg);border:1px solid #a7f3d0;border-radius:10px;padding:12px 14px;font-size:13px;color:#065f46;line-height:1.5;margin-left:38px}

/* BADGE */
.suc-badge{display:inline-block;background:#fef9c3;color:#854d0e;font-size:11px;font-weight:600;padding:3px 8px;border-radius:6px;margin-bottom:5px;letter-spacing:.3px}

/* PRIVACY */
.suc-privacy{font-size:11.5px;color:var(--suc-text3);padding-left:38px;display:flex;align-items:center;gap:5px}
.suc-privacy svg{width:12px;height:12px;fill:var(--suc-text3);flex-shrink:0}

/* INPUT BAR */
#suc-input-bar{border-top:1px solid var(--suc-border);padding:10px 12px;display:flex;gap:8px;align-items:center;flex-shrink:0;background:var(--suc-surface)}
#suc-text-input{flex:1;border:1px solid var(--suc-border);border-radius:20px;padding:8px 14px;font-size:13px;font-family:var(--suc-font);background:var(--suc-surface2);color:var(--suc-text);outline:none;transition:border-color .15s,background .15s}
#suc-text-input:focus{border-color:var(--suc-brand);background:var(--suc-surface)}
#suc-send-btn{width:36px;height:36px;background:var(--suc-brand);border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s}
#suc-send-btn:hover{background:var(--suc-brand-dark)}
#suc-send-btn svg{width:16px;height:16px;fill:white}
.suc-send-icon{width:18px;height:18px;object-fit:contain;filter:brightness(0) invert(1);display:block;transition:opacity .15s;max-width: fit-content;}
#suc-send-btn:disabled .suc-send-icon{opacity:.5}
#suc-send-btn:disabled{opacity:.4;cursor:default}

/* DISCLAIMER */
.suc-disclaimer{font-size:11px;color:var(--suc-text3);padding:8px 14px;text-align:center;border-top:1px solid var(--suc-border);background:var(--suc-surface2);flex-shrink:0;line-height:1.4}

@media(max-width:420px){
  #suc-window{width:calc(100vw - 16px);right:8px;bottom:88px}
  #suc-launcher{right:16px;bottom:16px}
}

/* ── LOCATION STEP ── */
.suc-location-wrap{display:flex;flex-direction:column;gap:10px;padding-left:38px}
.suc-location-opt-label{font-size:12px;font-weight:600;color:var(--suc-text2);text-transform:uppercase;letter-spacing:.4px;margin-bottom:-2px}
.suc-location-divider{display:flex;align-items:center;gap:8px;margin:2px 0}
.suc-location-divider::before,.suc-location-divider::after{content:'';flex:1;height:1px;background:var(--suc-border)}
.suc-location-divider span{font-size:11.5px;color:var(--suc-text3);white-space:nowrap;padding:0 4px}
.suc-meet-btn{border:1.5px solid var(--suc-brand) !important;color:var(--suc-brand) !important;background:var(--suc-surface) !important}
.suc-meet-btn:hover{background:var(--suc-brand-light) !important}

/* ── MODAL OVERLAY ── */
.suc-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0);display:flex;align-items:center;justify-content:center;z-index:99999;padding:16px;transition:background .25s;pointer-events:none}
.suc-modal-overlay.suc-modal-open{background:rgba(0,0,0,.5);pointer-events:all}
.suc-modal{background:#fff;border-radius:16px;width:100%;max-width:420px;box-shadow:0 20px 60px rgba(0,0,0,.18);transform:scale(.93) translateY(12px);opacity:0;transition:transform .28s cubic-bezier(.34,1.56,.64,1),opacity .22s;font-family:var(--suc-font);overflow:hidden;max-height:90vh;display:flex;flex-direction:column}
.suc-modal-overlay.suc-modal-open .suc-modal{transform:scale(1) translateY(0);opacity:1}

/* Modal header */
.suc-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 0;flex-shrink:0}
.suc-modal-header h3{font-size:16px;font-weight:600;color:#111827}
.suc-modal-close{background:none;border:none;font-size:22px;cursor:pointer;color:#6b7280;line-height:1;padding:2px 6px;border-radius:6px;transition:background .15s}
.suc-modal-close:hover{background:#f3f4f6}
.suc-modal-sub{font-size:13px;color:#6b7280;padding:8px 20px 0;line-height:1.5;flex-shrink:0}

/* Modal form */
.suc-modal-form{padding:14px 20px 20px;display:flex;flex-direction:column;gap:9px;overflow-y:auto}
.suc-modal-form input,.suc-modal-form textarea{border:1.5px solid rgba(0,0,0,.12);border-radius:9px;padding:9px 12px;font-size:13px;font-family:var(--suc-font);outline:none;background:#fff;color:#111827;transition:border-color .15s;resize:none}
.suc-modal-form input:focus,.suc-modal-form textarea:focus{border-color:var(--suc-brand)}
.suc-modal-form input.suc-err,.suc-modal-form textarea.suc-err{border-color:#ef4444}
.suc-modal-submit{background:var(--suc-brand);color:#fff;border:none;border-radius:10px;padding:11px 16px;font-size:14px;font-family:var(--suc-font);font-weight:600;cursor:pointer;transition:background .15s;margin-top:2px}
.suc-modal-submit:hover{background:var(--suc-brand-dark)}
.suc-modal-submit:disabled{opacity:.6;cursor:default}
.suc-modal-privacy{font-size:11px;color:#9ca3af;display:flex;align-items:center;gap:5px;margin-top:-2px}
.suc-modal-privacy svg{fill:#9ca3af;flex-shrink:0}

/* ── CALENDLY MODAL ── */
.suc-calendly-modal{max-width:640px;height:80vh}
.suc-calendly-wrap{flex:1;position:relative;overflow:hidden}
.suc-calendly-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:13px;color:#6b7280;background:#f9fafb}
.suc-calendly-wrap iframe{width:100%;height:100%;border:none;opacity:0;transition:opacity .3s;display:block}

/* ── TERMS CARD ── */
.suc-terms-card{display:flex;align-items:center;gap:10px;background:#f0f4ff;border:1px solid #c7d7fd;border-radius:10px;padding:12px 14px;margin-left:38px;margin-top:4px}
.suc-terms-icon{font-size:22px;flex-shrink:0}
.suc-terms-info{flex:1;display:flex;flex-direction:column;gap:2px}
.suc-terms-info strong{font-size:13px;color:#111827}
.suc-terms-info span{font-size:11.5px;color:#6b7280}
.suc-terms-btn{background:var(--suc-brand);color:#fff;border:none;border-radius:7px;padding:6px 12px;font-size:12px;font-family:var(--suc-font);font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap;flex-shrink:0}
.suc-terms-btn:hover{background:var(--suc-brand-dark)}

/* ── NOTIFICATION CARDS ── */
.suc-notif-cards{display:flex;flex-direction:column;gap:7px;padding-left:38px;margin-top:4px}
.suc-notif-card{display:flex;align-items:flex-start;gap:10px;background:#f7f8fc;border:1px solid rgba(0,0,0,.08);border-radius:10px;padding:10px 13px}
.suc-notif-num{width:22px;height:22px;background:var(--suc-brand);color:#fff;border-radius:50%;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.suc-notif-text{font-size:12.5px;color:#374151;line-height:1.45}
.suc-notif-text strong{font-weight:600;color:#111827}

.suc-submit-error{font-size:12px;color:#ef4444;margin-top:-4px;padding:0 2px;}

/* ── INPUT BAR LOCKED STATE ── */
#suc-input-bar.suc-input-locked{background:var(--suc-surface2);cursor:not-allowed}
#suc-input-bar.suc-input-locked #suc-text-input{background:var(--suc-surface2);color:var(--suc-text3);cursor:not-allowed;border-color:transparent;font-style:italic}
#suc-input-bar.suc-input-locked #suc-text-input::placeholder{color:var(--suc-text3)}
#suc-input-bar.suc-input-locked #suc-send-btn{background:#d1d5db;cursor:not-allowed}
#suc-input-bar:not(.suc-input-locked){transition:background .3s}

/* ── ASK ME HINT BUBBLE ── */
.suc-ask-hint{
  background:linear-gradient(135deg,#1a56db,#2563eb);
  color:#fff;border-radius:12px;padding:10px 15px;
  font-size:13px;font-weight:500;line-height:1.4;
  margin-left:38px;opacity:0;
  transform:translateY(6px);
  transition:opacity .35s ease,transform .35s ease;
  box-shadow:0 4px 14px rgba(26,86,219,.35);
}
.suc-ask-hint-visible{opacity:1;transform:translateY(0)}