/* Boo, the Kawaii-Boo chat helper. Uses the site's tokens (ink brown, butter, pink, teal, cream) and fonts.
   Everything is namespaced under #kbChat so it cannot touch the rest of the page. */
#kbChat { --kc-ink: #3e2510; --kc-ink-soft: #5b4431; --kc-pink: #ff86b6; --kc-pink-soft: #ffd9e8; --kc-butter: #f3f87c; --kc-teal: #46ada5; --kc-mint: #d6f5ee; --kc-cream: #fffbea; --kc-white: #fff;
  position: fixed; z-index: 60; right: 0; bottom: 0; font-family: "Abel", "Arial Narrow", Arial, sans-serif; color: var(--kc-ink); -webkit-text-size-adjust: 100%; }
#kbChat[hidden], #kbChat [hidden] { display: none !important; }
#kbChat *, #kbChat *::before, #kbChat *::after { box-sizing: border-box; }
#kbChat button, #kbChat input, #kbChat textarea { font: inherit; color: inherit; }
#kbChat :focus-visible { outline: 3px solid var(--kc-ink); outline-offset: 3px; box-shadow: 0 0 0 6px #fff; }

/* launcher */
#kbChat .kc-launch { position: fixed; right: 24px; bottom: 128px; width: 64px; height: 64px; border-radius: 50%; border: 3px solid var(--kc-ink); background: var(--kc-pink); cursor: pointer; display: grid; place-items: center; padding: 0;
  box-shadow: 0 8px 22px rgba(62, 37, 16, .28); transition: transform .25s cubic-bezier(.23, 1, .32, 1), box-shadow .2s; -webkit-tap-highlight-color: transparent; animation: kc-pop .5s cubic-bezier(.23, 1, .32, 1) both; }
#kbChat .kc-launch:hover { transform: scale(1.08) rotate(-4deg); box-shadow: 0 10px 26px rgba(62, 37, 16, .34); }
#kbChat .kc-launch:active { transform: scale(.96); }
#kbChat .kc-launch svg { width: 34px; height: 34px; }
#kbChat .kc-launch .kc-ping { position: absolute; top: -4px; right: -4px; width: 16px; height: 16px; border-radius: 50%; background: var(--kc-butter); border: 3px solid var(--kc-ink); }
#kbChat .kc-tip { position: fixed; right: 100px; bottom: 140px; max-width: 220px; padding: 9px 14px; background: #fff; border: 2px solid var(--kc-ink); border-radius: 18px 18px 4px 18px; font-size: 16px; line-height: 1.2; box-shadow: 0 6px 16px rgba(62, 37, 16, .16); animation: kc-pop .5s .8s cubic-bezier(.23, 1, .32, 1) both; cursor: pointer; }
#kbChat[data-open] .kc-launch, #kbChat[data-open] .kc-tip { display: none; }
@keyframes kc-pop { from { transform: scale(.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }

/* panel */
#kbChat .kc-panel { position: fixed; right: 24px; bottom: 24px; width: 392px; max-width: calc(100vw - 32px); height: min(640px, calc(100dvh - 48px)); display: flex; flex-direction: column; background: var(--kc-cream); border: 3px solid var(--kc-ink); border-radius: 28px; overflow: hidden;
  box-shadow: 0 24px 60px rgba(62, 37, 16, .32); transform-origin: 100% 100%; animation: kc-open .35s cubic-bezier(.22, 1, .36, 1) both; }
@keyframes kc-open { from { transform: translateY(24px) scale(.94); opacity: 0; } to { transform: none; opacity: 1; } }
#kbChat .kc-head { display: flex; align-items: center; gap: 12px; padding: 14px 14px 12px 16px; background: linear-gradient(110deg, var(--kc-butter), var(--kc-pink-soft) 55%, var(--kc-mint)); border-bottom: 3px solid var(--kc-ink); }
#kbChat .kc-face { flex: none; width: 46px; height: 46px; border-radius: 50%; background: #fff; border: 2.5px solid var(--kc-ink); display: grid; place-items: center; }
#kbChat .kc-face svg { width: 30px; height: 30px; }
#kbChat .kc-title { flex: 1; min-width: 0; line-height: 1.1; }
#kbChat .kc-title strong { display: block; font-family: "Fugaz One", "Oswald", Arial, sans-serif; font-weight: 400; font-size: 22px; letter-spacing: .01em; }
#kbChat .kc-title span { display: block; font-family: "Oswald", Arial, sans-serif; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--kc-ink-soft); margin-top: 3px; }
#kbChat .kc-x { flex: none; width: 44px; height: 44px; border-radius: 50%; border: 2.5px solid var(--kc-ink); background: #fff; cursor: pointer; display: grid; place-items: center; padding: 0; }
#kbChat .kc-x:hover { background: var(--kc-butter); }
#kbChat .kc-x svg { width: 16px; height: 16px; }
#kbChat .kc-note { padding: 8px 16px; background: #fff; border-bottom: 2px solid rgba(62, 37, 16, .16); font-size: 14px; line-height: 1.3; color: var(--kc-ink-soft); }
#kbChat .kc-note a { color: var(--kc-ink); text-decoration: underline; text-underline-offset: 2px; }

/* conversation */
#kbChat .kc-log { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 14px 14px 6px; display: flex; flex-direction: column; gap: 10px; scroll-behavior: smooth; }
#kbChat .kc-msg { max-width: 86%; padding: 10px 14px; border: 2px solid var(--kc-ink); border-radius: 20px; font-size: 17px; line-height: 1.35; white-space: pre-wrap; overflow-wrap: anywhere; animation: kc-in .3s cubic-bezier(.22, 1, .36, 1) both; }
#kbChat .kc-msg.bot { align-self: flex-start; background: #fff; border-bottom-left-radius: 6px; }
#kbChat .kc-msg.me { align-self: flex-end; background: var(--kc-pink); border-bottom-right-radius: 6px; }
#kbChat .kc-msg.err { background: #fff3e8; }
#kbChat .kc-msg a { color: var(--kc-ink); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
@keyframes kc-in { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
#kbChat .kc-typing { align-self: flex-start; display: flex; gap: 5px; padding: 13px 16px; background: #fff; border: 2px solid var(--kc-ink); border-radius: 20px 20px 20px 6px; }
#kbChat .kc-typing i { width: 8px; height: 8px; border-radius: 50%; background: var(--kc-ink); opacity: .35; animation: kc-dot 1.1s infinite ease-in-out; }
#kbChat .kc-typing i:nth-child(2) { animation-delay: .15s; } #kbChat .kc-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes kc-dot { 0%, 80%, 100% { transform: translateY(0); opacity: .35; } 40% { transform: translateY(-5px); opacity: 1; } }
#kbChat .kc-inline { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }

/* buttons + chips */
#kbChat .kc-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 14px 10px; }
#kbChat .kc-chip, #kbChat .kc-btn { min-height: 44px; padding: 8px 16px; border-radius: 999px; border: 2.5px solid var(--kc-ink); background: var(--kc-butter); font-family: "Oswald", Arial, sans-serif; font-size: 14px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: var(--kc-ink); transition: transform .15s, background .15s; }
#kbChat .kc-chip:hover, #kbChat .kc-btn:hover { background: var(--kc-pink-soft); transform: translateY(-1px); }
#kbChat .kc-btn.primary { background: var(--kc-pink); }
#kbChat .kc-btn.ghost { background: #fff; }
#kbChat .kc-btn[disabled] { opacity: .55; cursor: not-allowed; transform: none; }

/* composer */
#kbChat .kc-bar { display: flex; flex-direction: column; gap: 6px; padding: 8px 12px 12px; border-top: 2px solid rgba(62, 37, 16, .16); background: var(--kc-cream); }
#kbChat .kc-row { display: flex; align-items: flex-end; gap: 8px; }
#kbChat .kc-input { flex: 1; min-width: 0; resize: none; max-height: 120px; min-height: 44px; padding: 10px 14px; border: 2.5px solid var(--kc-ink); border-radius: 22px; background: #fff; font-size: 16px; line-height: 1.3; }
#kbChat .kc-send { flex: none; width: 48px; height: 48px; border-radius: 50%; border: 2.5px solid var(--kc-ink); background: var(--kc-teal); cursor: pointer; display: grid; place-items: center; padding: 0; }
#kbChat .kc-send:hover { background: var(--kc-mint); }
#kbChat .kc-send[disabled] { opacity: .5; cursor: not-allowed; }
#kbChat .kc-send svg { width: 22px; height: 22px; }
#kbChat .kc-meta { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 14px; color: var(--kc-ink-soft); min-height: 24px; }
#kbChat .kc-link { background: none; border: 0; padding: 4px 2px; min-height: 24px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; font-size: 15px; color: var(--kc-ink); }

/* lead form */
#kbChat .kc-form { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 14px 16px 18px; display: flex; flex-direction: column; gap: 12px; }
#kbChat .kc-form h2 { margin: 0; font-family: "Fugaz One", "Oswald", Arial, sans-serif; font-weight: 400; font-size: 21px; }
#kbChat .kc-form p { margin: 0; font-size: 16px; line-height: 1.3; }
#kbChat .kc-field { display: flex; flex-direction: column; gap: 4px; }
#kbChat .kc-field label, #kbChat .kc-field .kc-lab { font-family: "Oswald", Arial, sans-serif; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
#kbChat .kc-field input[type=text], #kbChat .kc-field input[type=email], #kbChat .kc-field input[type=tel], #kbChat .kc-field textarea { width: 100%; min-height: 44px; padding: 10px 14px; border: 2.5px solid var(--kc-ink); border-radius: 16px; background: #fff; font-size: 16px; }
#kbChat .kc-field textarea { min-height: 84px; resize: vertical; }
#kbChat .kc-field [aria-invalid=true] { border-color: #b3261e; background: #fff5f4; }
#kbChat .kc-err { color: #8f1d17; font-size: 15px; font-weight: 700; }
#kbChat .kc-consent { display: grid; grid-template-columns: 28px 1fr; gap: 10px; align-items: start; font-size: 15px; line-height: 1.3; }
#kbChat .kc-consent input { width: 26px; height: 26px; margin: 2px 0 0; accent-color: var(--kc-ink); }
#kbChat .kc-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
#kbChat .kc-actions { display: flex; gap: 10px; flex-wrap: wrap; }
#kbChat .kc-status { min-height: 22px; font-size: 16px; }
#kbChat .kc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* phones: a bottom sheet that follows the on-screen keyboard (height/offset set from visualViewport in chat.js) */
@media (max-width: 600px) {
  #kbChat .kc-launch { right: 14px; bottom: 14px; width: 60px; height: 60px; }
  #kbChat .kc-tip { right: 84px; bottom: 76px; }
  #kbChat .kc-panel { right: 0; left: 0; width: 100%; max-width: none; bottom: var(--kc-bottom, 0px); height: min(var(--kc-h, 100dvh), 100dvh); max-height: calc(100dvh - 12px); border-radius: 26px 26px 0 0; border-bottom: 0; transform-origin: 50% 100%; padding-bottom: env(safe-area-inset-bottom); }
  #kbChat .kc-msg { font-size: 17px; max-width: 90%; }
}
@media (prefers-reduced-motion: reduce) { #kbChat * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } #kbChat .kc-typing i { opacity: .7; } }
html.motion-off #kbChat * { animation: none !important; transition: none !important; }