/*
 * Sapthagiri Chatbot — widget stylesheet
 * Every selector is scoped under #sap-chatbot-root so this stylesheet can
 * never affect the rest of the theme, and the theme's CSS can never break
 * the widget. No external fonts or assets are loaded — everything below
 * uses the visitor's system font stack.
 */

#sap-chatbot-root {
  --sap-ink:#16241D;
  --sap-moss:#2F5A44;
  --sap-parchment:#F7F3E8;
  --sap-parchment-2:#EFE8D6;
  --sap-brass:#B4872E;
  --sap-brass-light:#D9AE55;
  --sap-clay:#B15A38;
  --sap-text:#221E15;
  --sap-muted:#7A7259;
  --sap-line:#DCD3B8;
  --sap-success:#3C7A54;
  --sap-shadow: 0 24px 60px rgba(15,26,20,0.35), 0 4px 14px rgba(15,26,20,0.18);

  --font-display: Georgia, "Iowan Old Style", "Palatino Linotype", "URW Palladio L", serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;

  position: relative;
  z-index: 2147483000; /* sit above virtually any theme UI without touching it */
}
#sap-chatbot-root, #sap-chatbot-root *{ box-sizing: border-box; }

/* Defensive reset: many themes and page builders (Elementor included) apply
   broad global styles to bare button/a/input selectors. These rules make
   sure OUR buttons and links always render the way we intend, regardless
   of what the active theme does elsewhere on the site. */
#sap-chatbot-root button{
  font-family: inherit !important;
  line-height: normal !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  margin: 0 !important;
  box-shadow: none !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}
#sap-chatbot-root a{ text-decoration: none !important; box-shadow: none !important; }
#sap-chatbot-root svg{ display: block; }

@media (prefers-reduced-motion: reduce){
  #sap-chatbot-root *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
}
#sap-chatbot-root :focus-visible{ outline:2px solid var(--sap-brass); outline-offset:2px; border-radius:3px; }

/* ================= LAUNCHER ================= */
/* #sap-launcher-wrap never transforms — it's the stable anchor for the
   badge and tooltip. Only the inner #sap-launcher circle scales/rotates
   on hover, so the tooltip can never inherit a tilt from it. */
#sap-launcher-wrap{
  position:fixed !important; right:22px !important; bottom: var(--sap-offset-bottom, 22px) !important;
  width:66px !important; height:66px !important; z-index:2147483000 !important;
  -webkit-transform: translateZ(0); transform: translateZ(0);
  will-change: transform;
  backface-visibility: hidden;
}
#sap-launcher{
  position:absolute !important; inset:0 !important;
  border-radius:50% !important;
  background:radial-gradient(circle at 30% 26%, #6656C9 0%, #4B3A9E 55%, #382C77 100%) !important;
  box-shadow:0 10px 28px rgba(75,58,158,.45), 0 3px 10px rgba(75,58,158,.32) !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  cursor:pointer !important; border:2px solid #EFEBFF !important;
  padding:0 !important;
  transition:transform .2s cubic-bezier(.34,1.56,.64,1) !important;
}
#sap-launcher-wrap:hover #sap-launcher{ transform:scale(1.08) rotate(-4deg) !important; }
#sap-launcher svg{ position:relative; z-index:2; }
#sap-launcher svg:first-of-type{
  width:28px !important; height:31.5px !important;
  animation: sap-head-shake 2s ease-in-out infinite !important;
  transform-origin: 50% 20% !important;
}
@keyframes sap-head-shake{
  0%, 65%, 100%{ transform:rotate(0deg); }
  70%{ transform:rotate(-8deg); }
  76%{ transform:rotate(7deg); }
  82%{ transform:rotate(-5deg); }
  88%{ transform:rotate(3deg); }
  94%{ transform:rotate(0deg); }
}

#sap-launcher-pulse{
  position:absolute; inset:-4px; border-radius:50%;
  border:2.5px solid #8B7BE8; opacity:0;
  animation: sap-pulse-loop 2.4s ease-out infinite;
  pointer-events:none;
}
@keyframes sap-pulse-loop{
  0%{ transform:scale(.92); opacity:.65; }
  70%{ transform:scale(1.55); opacity:0; }
  100%{ transform:scale(1.55); opacity:0; }
}

#sap-launcher-badge{
  position:absolute; top:-3px; right:-3px; background:var(--sap-brass); color:var(--sap-ink);
  font-family:var(--font-mono); font-size:10.5px; font-weight:600; width:19px; height:19px;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  border:2px solid var(--sap-parchment); z-index:3;
}
#sap-hover-tip{
  position:absolute; right:calc(100% + 14px); top:50%; transform:translateY(-50%) translateX(6px);
  background:var(--sap-ink); color:var(--sap-parchment); font-family:var(--font-body); font-size:12.5px;
  font-weight:600; white-space:nowrap; padding:8px 13px; border-radius:8px 8px 3px 8px;
  box-shadow:0 8px 22px rgba(22,36,29,.28); pointer-events:none;
  opacity:0; transition:opacity .18s ease, transform .18s ease; z-index:3;
}
#sap-hover-tip::after{
  content:"";
  position:absolute; right:-6px; top:50%; transform:translateY(-50%);
  width:0; height:0;
  border-top:6px solid transparent; border-bottom:6px solid transparent;
  border-left:7px solid var(--sap-ink);
}
@media (hover:hover) and (pointer:fine){
  #sap-launcher-wrap:hover #sap-hover-tip{ opacity:1; transform:translateY(-50%) translateX(0); }
}

#sap-teaser-stack{
  position:fixed !important; right:92px !important; bottom: calc(var(--sap-offset-bottom, 22px) + 4px) !important;
  z-index:2147482999 !important;
  display:flex; flex-direction:column; align-items:flex-end; gap:8px;
  max-width:230px;
}
.sap-teaser-bubble{
  position:relative;
  background:#fffdf8; padding:13px 17px;
  border-radius:3px 12px 12px 12px; box-shadow:0 14px 34px rgba(22,36,29,.22);
  border:1px solid var(--sap-line); border-left:3px solid var(--sap-brass);
  font-size:13.5px; font-family:var(--font-body); color:var(--sap-text); line-height:1.5;
  max-width:230px; cursor:pointer;
  animation: sap-teaser-in .28s cubic-bezier(.2,.85,.35,1);
}
.sap-teaser-bubble:nth-last-child(n+2){ opacity:.82; transform:scale(.97); transform-origin:bottom right; }
.sap-teaser-bubble.leaving{ animation: sap-teaser-out .22s ease forwards; }
@keyframes sap-teaser-in{ from{ opacity:0; transform:translateY(8px) scale(.96); } to{ opacity:1; transform:translateY(0) scale(1); } }
@keyframes sap-teaser-out{ to{ opacity:0; transform:translateY(-6px) scale(.94); } }
.sap-teaser-bubble-close{
  position:absolute !important; top:-8px !important; right:-8px !important; width:20px !important; height:20px !important; border-radius:50% !important;
  background:var(--sap-ink) !important; color:#fff !important; border:1.5px solid var(--sap-parchment) !important;
  font-size:10px !important; cursor:pointer !important; line-height:1 !important;
  display:flex !important; align-items:center !important; justify-content:center !important; padding:0 !important;
}

/* ================= PANEL ================= */
#sap-panel{
  position:fixed !important; right:22px !important; bottom: calc(var(--sap-offset-bottom, 22px) + 74px) !important;
  width:384px; max-width:calc(100vw - 32px);
  height:610px; max-height:calc(100vh - 136px); background:var(--sap-parchment);
  border-radius:16px; box-shadow:var(--sap-shadow); display:none; flex-direction:column;
  overflow:hidden; z-index:2147483000; border:1px solid var(--sap-line);
  opacity:0;
  transform-origin:bottom right;
  transition:opacity .3s ease, transform .3s ease;
  font-family: var(--font-body);
  will-change: transform, opacity;
}
#sap-panel.open{ display:flex !important; opacity:1 !important; }

/* Panel open/close animation variants — selected in Settings, applied via
   the data-anim attribute. Each has its OWN transform-origin, distance,
   duration, and easing curve — not just a different end-position sharing
   the same timing — so every style has a genuinely distinct character.
   Since these use CSS transitions (not one-way keyframes), closing
   naturally reverses the same motion. */

#sap-panel[data-anim="slide-scale"]{
  transform-origin:bottom right !important;
  transform:translateY(16px) scale(.96) !important;
  transition:opacity .26s ease, transform .26s cubic-bezier(.2,.9,.3,1) !important;
}
#sap-panel[data-anim="slide-scale"].open{ transform:translateY(0) scale(1) !important; }

#sap-panel[data-anim="slide-up"]{
  transform-origin:bottom center !important;
  transform:translateY(60px) !important;
  transition:opacity .32s ease, transform .32s cubic-bezier(.16,.84,.24,1) !important;
}
#sap-panel[data-anim="slide-up"].open{ transform:translateY(0) !important; }

#sap-panel[data-anim="slide-right"]{
  transform-origin:center right !important;
  transform:translateX(70px) !important;
  transition:opacity .3s ease, transform .3s cubic-bezier(.16,.84,.24,1) !important;
}
#sap-panel[data-anim="slide-right"].open{ transform:translateX(0) !important; }

#sap-panel[data-anim="fade"]{
  transform:none !important;
  transition:opacity .55s ease !important;
}
#sap-panel[data-anim="fade"].open{ transform:none !important; }

#sap-panel[data-anim="zoom"]{
  transform-origin:center center !important;
  transform:scale(.45) !important;
  transition:opacity .22s ease, transform .22s cubic-bezier(.34,1.1,.64,1) !important;
}
#sap-panel[data-anim="zoom"].open{ transform:scale(1) !important; }

#sap-panel[data-anim="rotate-in"]{
  transform-origin:bottom right !important;
  transform:translateY(50px) scale(.55) rotate(-14deg) !important;
  transition:opacity .5s ease, transform .5s cubic-bezier(.34,1.56,.64,1) !important;
}
#sap-panel[data-anim="rotate-in"].open{ transform:translateY(0) scale(1) rotate(0deg) !important; }

#sap-header{
  background:linear-gradient(155deg, var(--sap-moss) 0%, var(--sap-ink) 115%);
  color:var(--sap-parchment); padding:18px 18px 16px; display:flex; align-items:center; gap:12px; position:relative;
}
#sap-header::after{
  content:""; position:absolute; inset:0;
  background-image: linear-gradient(90deg, rgba(247,243,232,.05) 1px, transparent 1px), linear-gradient(0deg, rgba(247,243,232,.05) 1px, transparent 1px);
  background-size:16px 16px; pointer-events:none;
}
#sap-header::before{
  content:""; position:absolute; top:9px; left:9px; width:11px; height:11px;
  border-top:1.5px solid var(--sap-brass-light); border-left:1.5px solid var(--sap-brass-light); opacity:.85;
}
#sap-header .corner-br{
  position:absolute; bottom:9px; right:9px; width:11px; height:11px;
  border-bottom:1.5px solid var(--sap-brass-light); border-right:1.5px solid var(--sap-brass-light); opacity:.85;
}
#sap-header .avatar{
  width:38px !important; height:38px !important; background:var(--sap-brass) !important; transform:rotate(45deg) !important; border-radius:6px !important;
  display:flex !important; align-items:center !important; justify-content:center !important; flex-shrink:0; z-index:1; box-shadow:0 2px 6px rgba(0,0,0,.25) !important;
}
#sap-header .avatar span{ transform:rotate(-45deg); font-family:var(--font-display); font-weight:700; font-size:14px; color:var(--sap-ink); }
#sap-header .htext{ z-index:1; }
#sap-header .htext .hname{ font-family:var(--font-display); font-weight:700; font-size:16.5px; letter-spacing:-.01em; color:var(--sap-parchment); }
#sap-header .htext .hstatus{ font-family:var(--font-mono); font-size:11px; opacity:.8; display:flex; align-items:center; gap:6px; margin-top:2px; color:var(--sap-parchment); }
#sap-header .hstatus .dot{ width:6px; height:6px; border-radius:50%; background:#6FDB9C; display:inline-block; box-shadow:0 0 0 3px rgba(111,219,156,.18); }
#sap-close{
  margin-left:auto !important; background:rgba(247,243,232,.14) !important; border:1px solid rgba(247,243,232,.25) !important; color:var(--sap-parchment) !important;
  width:29px !important; height:29px !important; min-width:29px !important; border-radius:50% !important; cursor:pointer !important; font-size:14px !important;
  z-index:2; transition:background .15s ease !important;
  display:flex !important; align-items:center !important; justify-content:center !important; padding:0 !important; flex-shrink:0 !important;
}
#sap-close:hover{ background:rgba(247,243,232,.26) !important; }

#sap-body{
  flex:1; overflow-y:auto; padding:17px 16px; display:flex; flex-direction:column; gap:11px;
  background: radial-gradient(circle at 92% 6%, rgba(180,135,46,0.07), transparent 42%), var(--sap-parchment);
  mask-image: linear-gradient(to bottom, transparent 0, black 14px, black calc(100% - 6px), transparent 100%);
}
#sap-body::-webkit-scrollbar{ width:6px; }
#sap-body::-webkit-scrollbar-thumb{ background:var(--sap-line); border-radius:10px; }

.msg-row{ display:flex; gap:8px; max-width:100%; animation:sap-rise .32s cubic-bezier(.2,.85,.35,1) both; }
@keyframes sap-rise{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:translateY(0); } }
.msg-row.bot{ align-self:flex-start; }
.msg-row.user{ align-self:flex-end; flex-direction:row-reverse; }
.msg-avatar{ width:24px; height:24px; background:var(--sap-moss); border-radius:5px; transform:rotate(45deg); flex-shrink:0; display:flex; align-items:center; justify-content:center; margin-top:3px; }
.msg-avatar span{ transform:rotate(-45deg); color:var(--sap-parchment); font-family:var(--font-display); font-weight:700; font-size:10px; }
.bubble{ padding:11px 14px; border-radius:13px; font-size:13.6px; line-height:1.55; max-width:252px; box-shadow:0 1px 2px rgba(22,36,29,.05); }
.msg-row.bot .bubble{ background:#fffdf8; border:1px solid var(--sap-line); border-bottom-left-radius:3px; color:var(--sap-text); }
.msg-row.user .bubble{ background:var(--sap-ink); color:var(--sap-parchment); border-bottom-right-radius:3px; }

.typing .bubble{ display:flex; gap:4px; align-items:center; padding:13px 15px; background:#fffdf8; border:1px solid var(--sap-line); }
.typing .dot{ width:5px; height:5px; border-radius:50%; background:var(--sap-brass); opacity:.5; animation:sap-blink 1.2s infinite; }
.typing .dot:nth-child(2){ animation-delay:.2s; }
.typing .dot:nth-child(3){ animation-delay:.4s; }
@keyframes sap-blink{ 0%,80%,100%{ opacity:.35; transform:translateY(0); } 40%{ opacity:1; transform:translateY(-2px); } }

.qa-wrap{ display:flex; flex-direction:column; gap:7px; margin-top:2px; align-self:flex-start; width:100%; }
.qa-btn{
  position:relative; background:#fffdf8 !important; border:1px solid var(--sap-line) !important; border-left:3px solid var(--sap-moss) !important;
  color:var(--sap-ink) !important; font-family:var(--font-body) !important; font-size:13.2px !important; font-weight:600 !important; padding:10px 13px !important;
  border-radius:0 7px 7px 0 !important; cursor:pointer !important; text-align:left !important; width:100%; display:block;
  transition:background .16s ease, transform .12s ease, border-left-width .16s ease;
}
.qa-btn:hover{ background:var(--sap-moss) !important; color:var(--sap-parchment) !important; transform:translateX(3px); border-left-width:5px !important; }
.qa-btn.gold{ border-left-color:var(--sap-brass) !important; }
.qa-btn.gold:hover{ background:var(--sap-brass) !important; color:var(--sap-ink) !important; }
.qa-btn.ghost{ border-left-color:var(--sap-line) !important; color:var(--sap-muted) !important; font-weight:500 !important; }
.qa-btn.ghost:hover{ background:var(--sap-parchment-2) !important; color:var(--sap-text) !important; }
.qa-btn:disabled{ cursor:default !important; }

.price-card{
  position:relative; background:#fffdf8; border:1px solid var(--sap-line); border-radius:8px; padding:12px 14px;
  margin-bottom:9px; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
  transition:transform .18s ease, box-shadow .18s ease;
}
.price-card:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(22,36,29,.1); }
.price-card::after{ content:""; position:absolute; top:0; right:0; width:16px; height:16px; background:linear-gradient(135deg, var(--sap-parchment-2) 50%, var(--sap-brass) 50%); }
.price-card .pname{ font-family:var(--font-display); font-weight:700; font-size:14.5px; color:var(--sap-ink); padding-right:10px; }
.price-card .ploc{ font-size:11.5px; color:var(--sap-muted); margin:3px 0 7px; }
.price-card .pprice{ font-family:var(--font-mono); font-size:13.5px; font-weight:600; color:var(--sap-clay); letter-spacing:-.01em; }
.price-card a{ font-size:11.5px; color:var(--sap-moss); text-decoration:none; font-weight:700; display:inline-block; margin-top:6px; }
.price-card a:hover{ text-decoration:underline; }
.price-range-pill{
  display:inline-flex; align-items:center; gap:6px; background:var(--sap-ink); color:var(--sap-parchment);
  font-family:var(--font-mono); font-size:11.5px; padding:6px 12px; border-radius:100px; margin-bottom:11px;
}
.price-range-pill::before{ content:"◆"; color:var(--sap-brass-light); font-size:8px; }

.field-wrap{ width:100%; align-self:flex-start; }
.field-label{ font-size:11.5px; color:var(--sap-muted); margin:9px 0 5px; font-weight:600; text-transform:uppercase; letter-spacing:.04em; font-family:var(--font-mono); }
.field-input{
  width:100% !important; padding:10px 12px !important; border:1.5px solid var(--sap-line) !important; border-radius:7px !important; font-size:13.5px !important;
  background:#fffdf8 !important; color:var(--sap-text) !important; font-family:var(--font-body) !important; height:auto !important; box-shadow:none !important;
}
.field-input:focus{ outline:none !important; border-color:var(--sap-moss) !important; box-shadow:0 0 0 3px rgba(47,90,68,.12) !important; }
.field-error{ font-size:11.5px; color:#A13E2E; margin-top:4px; display:none; }

.primary-btn{
  background:var(--sap-ink) !important; color:var(--sap-parchment) !important; border:1px solid var(--sap-ink) !important; padding:11px 16px !important;
  border-radius:7px !important; font-weight:700 !important; font-size:13.3px !important; font-family:var(--font-body) !important; cursor:pointer !important;
  margin-top:11px; width:100% !important; transition:background .15s ease;
}
.primary-btn:hover{ background:var(--sap-moss) !important; border-color:var(--sap-moss) !important; }
.primary-btn:disabled{ opacity:.6; cursor:default; }

.call-btn{
  display:flex !important; align-items:center !important; justify-content:center !important; gap:8px; background:var(--sap-brass) !important; color:var(--sap-ink) !important;
  text-decoration:none !important; font-weight:700 !important; font-size:14px !important; font-family:var(--font-body) !important; padding:12px !important; border-radius:8px !important;
  margin-top:8px; transition:background .15s ease;
}
.call-btn:hover{ background:var(--sap-brass-light) !important; }

.confirm-card{
  position:relative; background:#fffdf8; border:1px solid var(--sap-line); padding:13px 15px; font-size:13px; width:100%;
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}
.confirm-card::after{ content:""; position:absolute; top:0; right:0; width:16px; height:16px; background:linear-gradient(135deg, var(--sap-parchment-2) 50%, var(--sap-brass) 50%); }
.confirm-card .row{ display:flex; justify-content:space-between; padding:5px 0; border-bottom:1px dashed var(--sap-line); }
.confirm-card .row:last-child{ border-bottom:none; }
.confirm-card .row span:first-child{ color:var(--sap-muted); font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.03em; }
.confirm-card .row span:last-child{ font-weight:600; color:var(--sap-ink); }
.success-banner{
  background:#EAF3EC; border:1px solid var(--sap-success); color:var(--sap-success); padding:11px 13px; border-radius:8px;
  font-size:13px; font-weight:600; display:flex; gap:8px; align-items:flex-start; width:100%;
}

#sap-footer{ padding:10px 14px; text-align:center; font-family:var(--font-mono); font-size:10px; color:var(--sap-muted); border-top:1px solid var(--sap-line); background:#fffdf8; }
#sap-privacy-note{ font-family:var(--font-body); font-size:9.5px; color:var(--sap-muted); margin-top:3px; line-height:1.4; opacity:.85; }

.whatsapp-btn{
  display:flex !important; align-items:center !important; justify-content:center !important; gap:8px; background:#25D366 !important; color:#fff !important; text-decoration:none !important;
  font-weight:700 !important; font-size:13.5px !important; font-family:var(--font-body) !important; padding:12px !important; border-radius:8px !important; margin-top:6px; transition:background .15s ease;
}
.whatsapp-btn:hover{ background:#1EBE5A !important; }

.guide-card{
  background:#fffdf8; border:1px solid var(--sap-line); border-left:3px solid var(--sap-moss); border-radius:0 8px 8px 0;
  padding:12px 14px; margin-bottom:9px; font-size:12.8px; line-height:1.58;
}
.guide-card .gtitle{ font-family:var(--font-display); font-weight:700; color:var(--sap-ink); font-size:13.5px; margin-bottom:5px; display:flex; gap:7px; align-items:center; }
.guide-note{ font-size:11px; color:var(--sap-muted); font-style:italic; margin-top:7px; }

.step-indicator{ display:flex; align-items:center; width:100%; margin-bottom:4px; padding:2px 2px 10px; }
.step-dot{ display:flex; flex-direction:column; align-items:center; gap:4px; flex-shrink:0; }
.step-dot .step-num{
  width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-size:10px; font-weight:600; background:#fffdf8; border:1.5px solid var(--sap-line); color:var(--sap-muted);
}
.step-dot .step-label{ font-size:8.5px; color:var(--sap-muted); text-transform:uppercase; letter-spacing:.03em; white-space:nowrap; }
.step-dot.active .step-num{ background:var(--sap-brass); border-color:var(--sap-brass); color:var(--sap-ink); }
.step-dot.active .step-label{ color:var(--sap-ink); font-weight:600; }
.step-dot.done .step-num{ background:var(--sap-moss); border-color:var(--sap-moss); color:var(--sap-parchment); }
.step-line{ flex:1; height:1.5px; background:var(--sap-line); margin:0 4px 15px; min-width:8px; }
.step-line.done{ background:var(--sap-moss); }

.sap-hp{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; overflow:hidden; }

@media (max-width:480px){
  #sap-panel{ right:8px; left:8px; bottom:84px; width:auto; height:70vh; }
  #sap-teaser-stack{ right:12px; max-width:200px; }
}