/* Cedarwind chatbot widget — shared across cedarwind.io (en-gtm) and
   cedarwind.io/tw (tw-export). Vanilla CSS, no build step. Scoped under
   .cw-chat-* so it can't leak into either page's existing styles.
   Palette mirrors the site: deep navy + warm gold, cool off-white surfaces. */

.cw-chat-launcher,
.cw-chat-panel {
  --cw-ink:        #051C2C;
  --cw-ink-2:      #1A2438;
  --cw-ink-3:      #4f6276;
  --cw-cream:      #f6f7f9;
  --cw-paper:      #ffffff;
  --cw-amber:      #E6B547;
  --cw-amber-2:    #C99A2C;
  --cw-rule:       rgba(5,28,44,0.12);
  --cw-rule-soft:  rgba(5,28,44,0.06);
  --cw-bubble-bot: #f1f3f6;
  --cw-bubble-usr: #051C2C;
  --cw-shadow:     0 18px 50px rgba(5,28,44,0.20);
  --cw-radius:     16px;
  --cw-font:       "Geist", "Söhne", -apple-system, BlinkMacSystemFont,
                   "Helvetica Neue", "Noto Sans TC", sans-serif;
  font-family: var(--cw-font);
}

/* ── Launcher ── */
.cw-chat-launcher {
  position: fixed; right: 22px; bottom: 22px; z-index: 9998;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 18px 12px 14px;
  background: var(--cw-ink); color: var(--cw-cream);
  border: 0; border-radius: 999px;
  font-size: 14px; font-weight: 500; letter-spacing: -0.005em;
  box-shadow: var(--cw-shadow);
  cursor: pointer;
  transition: transform .2s ease, background .2s ease;
}
.cw-chat-launcher:hover { transform: translateY(-1px); background: #0a2540; }
.cw-chat-launcher .cw-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--cw-amber);
  box-shadow: 0 0 0 4px rgba(230,181,71,0.22);
}
.cw-chat-launcher.cw-hidden { display: none; }

/* One-shot attention pulse, triggered ~5s after load (added via JS). */
.cw-chat-launcher.cw-pulse { animation: cw-attn 1.1s ease-in-out 2; }
@keyframes cw-attn {
  0%, 100% { transform: translateY(0)    scale(1);    box-shadow: var(--cw-shadow); }
  50%      { transform: translateY(-2px) scale(1.04); box-shadow: 0 0 0 8px rgba(230,181,71,0.18), var(--cw-shadow); }
}
@media (prefers-reduced-motion: reduce) {
  .cw-chat-launcher.cw-pulse { animation: none; }
}

/* ── Panel ── */
.cw-chat-panel {
  position: fixed; right: 22px; bottom: 22px; z-index: 9999;
  width: min(380px, calc(100vw - 28px));
  height: min(520px, calc(100vh - 44px));
  background: var(--cw-paper);
  border-radius: var(--cw-radius);
  box-shadow: var(--cw-shadow);
  display: none; flex-direction: column; overflow: hidden;
  border: 1px solid var(--cw-rule);
}
.cw-chat-panel.cw-open { display: flex; animation: cw-pop .22s ease-out; }
@keyframes cw-pop {
  from { transform: translateY(10px) scale(.98); opacity: 0; }
  to   { transform: none;                         opacity: 1; }
}

/* ── Header ── */
.cw-chat-head {
  background: var(--cw-ink); color: var(--cw-cream);
  padding: 14px 16px;
  display: flex; align-items: center; gap: 12px;
}
.cw-chat-head .cw-badge {
  width: 34px; height: 34px; border-radius: 10px;
  background: rgba(230,181,71,0.18); color: var(--cw-amber);
  display: grid; place-items: center;
  border: 1px solid rgba(230,181,71,0.32);
}
.cw-chat-head .cw-badge svg { width: 18px; height: 18px; }
.cw-chat-head .cw-titles { line-height: 1.2; }
.cw-chat-head .cw-t1 {
  font-size: 14px; font-weight: 500; letter-spacing: -0.005em;
}
.cw-chat-head .cw-t2 {
  font-size: 11.5px; opacity: 0.7;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  letter-spacing: 0.04em;
  margin-top: 2px;
}
.cw-chat-head .cw-close {
  margin-left: auto;
  background: transparent; border: 0; color: var(--cw-cream);
  font-size: 22px; line-height: 1; cursor: pointer;
  opacity: 0.7; padding: 4px 6px; border-radius: 6px;
  transition: opacity .2s ease, background .2s ease;
}
.cw-chat-head .cw-close:hover { opacity: 1; background: rgba(255,255,255,0.08); }

/* ── Body ── */
.cw-chat-body {
  flex: 1; overflow-y: auto;
  padding: 16px 14px 8px;
  background: var(--cw-paper);
  scroll-behavior: smooth;
}
.cw-chat-row { display: flex; margin: 8px 0; }
.cw-chat-row.cw-bot  { justify-content: flex-start; }
.cw-chat-row.cw-user { justify-content: flex-end; }
.cw-chat-bubble {
  max-width: 86%;
  padding: 10px 13px;
  border-radius: 14px;
  font-size: 14.5px; line-height: 1.45;
  white-space: pre-wrap; word-wrap: break-word;
  letter-spacing: -0.002em;
}
.cw-chat-row.cw-bot  .cw-chat-bubble {
  background: var(--cw-bubble-bot); color: var(--cw-ink);
  border-bottom-left-radius: 4px;
}
.cw-chat-row.cw-user .cw-chat-bubble {
  background: var(--cw-bubble-usr); color: var(--cw-cream);
  border-bottom-right-radius: 4px;
}
.cw-chat-bubble a { color: var(--cw-amber); text-decoration: underline; }
.cw-chat-row.cw-bot .cw-chat-bubble a { color: var(--cw-amber-2); }

/* Booking button (rendered from the [[BOOK]] token in bot replies) */
.cw-chat-book {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 10px 0 2px;
  padding: 11px 18px;
  background: var(--cw-amber); color: var(--cw-ink);
  border-radius: 999px;
  font-size: 13.5px; font-weight: 600; letter-spacing: -0.005em;
  text-decoration: none;
  transition: background .2s ease, transform .2s ease;
}
.cw-chat-book:hover { background: var(--cw-amber-2); transform: translateY(-1px); }
.cw-chat-book .cw-book-arr { transition: transform .2s ease; }
.cw-chat-book:hover .cw-book-arr { transform: translateX(2px); }

/* Typing indicator */
.cw-chat-typing {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 12px 14px; border-radius: 14px;
  background: var(--cw-bubble-bot);
  border-bottom-left-radius: 4px;
}
.cw-chat-typing span {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--cw-ink-3);
  animation: cw-blink 1.2s infinite ease-in-out both;
}
.cw-chat-typing span:nth-child(2) { animation-delay: .15s; }
.cw-chat-typing span:nth-child(3) { animation-delay: .30s; }
@keyframes cw-blink {
  0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); }
  40%           { opacity: 1;   transform: scale(1);   }
}

/* ── Composer ── */
.cw-chat-foot {
  border-top: 1px solid var(--cw-rule-soft);
  padding: 10px 10px 12px;
  background: var(--cw-cream);
}
.cw-chat-input-row {
  display: flex; align-items: flex-end; gap: 8px;
  background: var(--cw-paper);
  border: 1px solid var(--cw-rule);
  border-radius: 12px;
  padding: 8px 8px 8px 12px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.cw-chat-input-row:focus-within {
  border-color: var(--cw-ink);
  box-shadow: 0 0 0 3px rgba(5,28,44,0.06);
}
.cw-chat-input {
  flex: 1;
  border: 0; outline: 0; background: transparent;
  resize: none;
  font-family: inherit; font-size: 14.5px; line-height: 1.4;
  color: var(--cw-ink);
  max-height: 110px; min-height: 22px;
}
.cw-chat-input::placeholder { color: var(--cw-ink-3); }
.cw-chat-send {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px;
  border: 0; border-radius: 999px;
  background: var(--cw-ink); color: var(--cw-cream);
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
.cw-chat-send:hover:not(:disabled) { background: #0a2540; transform: translateX(1px); }
.cw-chat-send:disabled { opacity: 0.4; cursor: not-allowed; }
.cw-chat-send svg { width: 16px; height: 16px; }

.cw-chat-foot .cw-disc {
  margin-top: 8px;
  font-size: 11px;
  color: var(--cw-ink-3);
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
  letter-spacing: 0.04em;
  text-align: center;
}

/* ── Responsive ── */
@media (max-width: 480px) {
  .cw-chat-panel {
    right: 8px; left: 8px; bottom: 8px;
    width: auto;
    height: min(520px, 75vh);
    border-radius: var(--cw-radius);
  }
  .cw-chat-launcher { right: 14px; bottom: 14px; padding: 10px 16px 10px 12px; font-size: 13.5px; }
}

@media (prefers-reduced-motion: reduce) {
  .cw-chat-panel.cw-open { animation: none; }
  .cw-chat-typing span   { animation: none; opacity: 0.6; }
}