/* BJPC AI Chatbot - floating widget, dark navy theme. */
/* Scoped under .bjpc-chatbot with !important on properties Salient/WPBakery clobber. */

.bjpc-chatbot {
  --bjpc-bg: #16233f;
  --bjpc-bg-raise: #26344f;
  --bjpc-input-bg: #1b2942;
  --bjpc-border: rgba(255, 255, 255, 0.08);
  --bjpc-border-strong: #2c3c5a;
  --bjpc-text: #eef2f7;
  --bjpc-text-muted: #9aa8bf;
  --bjpc-gold: #c9a55c;
  --bjpc-gold-dark: #b88f43;
  --bjpc-on-gold: #16233f;
  --bjpc-online: #34d399;
  --bjpc-shadow: 0 24px 60px -12px rgba(8, 14, 28, 0.55), 0 8px 24px -8px rgba(8, 14, 28, 0.4);

  position: fixed !important;
  right: 24px !important;
  bottom: 24px !important;
  z-index: 2147483647 !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  color: var(--bjpc-text) !important;
}

.bjpc-chatbot *,
.bjpc-chatbot *::before,
.bjpc-chatbot *::after {
  box-sizing: border-box !important;
}

.bjpc-chatbot__sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ---------- Launcher ---------- */

.bjpc-chatbot__launcher {
  position: relative !important;
  display: block !important;
  width: 74px !important;
  height: 74px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  color: inherit !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: transform 0.18s ease !important;
  font: inherit !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  outline: 0 !important;
}

.bjpc-chatbot__launcher:hover {
  transform: scale(1.06) !important;
}

.bjpc-chatbot__launcher:focus-visible {
  outline: 3px solid rgba(201, 165, 92, 0.6) !important;
  outline-offset: 4px !important;
  border-radius: 999px !important;
}

.bjpc-chatbot__launcher-avatar {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 0 !important;
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  /* Soft shadow follows the owl's actual (transparent) silhouette. */
  filter: drop-shadow(0 6px 12px rgba(8, 14, 28, 0.45)) !important;
  animation: bjpc-chatbot-bob 3.2s ease-in-out infinite !important;
}

/* Gentle float to draw the eye, without any box behind the image. */
@keyframes bjpc-chatbot-bob {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-5px); }
}

.bjpc-chatbot[data-bjpc-state="open"] .bjpc-chatbot__launcher {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: scale(0.7) !important;
  transition: opacity 0.18s ease, transform 0.18s ease !important;
}

/* ---------- Panel ---------- */

.bjpc-chatbot__panel {
  position: absolute !important;
  right: 0 !important;
  bottom: calc(100% + 14px) !important;
  width: min(390px, calc(100vw - 32px)) !important;
  height: min(600px, calc(100vh - 120px)) !important;
  background: var(--bjpc-bg) !important;
  border: 1px solid var(--bjpc-border) !important;
  border-radius: 20px !important;
  box-shadow: var(--bjpc-shadow) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  transform-origin: bottom right !important;
  transform: scale(0.92) translateY(12px) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: transform 0.22s ease, opacity 0.22s ease, visibility 0s linear 0.22s !important;
}

.bjpc-chatbot[data-bjpc-state="open"] .bjpc-chatbot__panel {
  transform: scale(1) translateY(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: transform 0.22s ease, opacity 0.22s ease, visibility 0s linear 0s !important;
}

/* ---------- Header ---------- */

.bjpc-chatbot__header {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 18px 14px !important;
  background: transparent !important;
  color: var(--bjpc-text) !important;
  flex-shrink: 0 !important;
}

.bjpc-chatbot__avatar {
  position: relative !important;
  display: block !important;
  width: 46px !important;
  height: 46px !important;
  flex-shrink: 0 !important;
}

.bjpc-chatbot__avatar img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

.bjpc-chatbot__status-dot {
  position: absolute !important;
  right: 3px !important;
  bottom: 3px !important;
  width: 11px !important;
  height: 11px !important;
  border-radius: 999px !important;
  background: var(--bjpc-online) !important;
  border: 2px solid var(--bjpc-bg) !important;
  box-shadow: none !important;
}

.bjpc-chatbot__heading {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.bjpc-chatbot__title {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: var(--bjpc-text) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-family: inherit !important;
}

.bjpc-chatbot__subtitle {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
  color: var(--bjpc-text-muted) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.bjpc-chatbot__close {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--bjpc-text-muted) !important;
  cursor: pointer !important;
  transition: background 0.15s ease, color 0.15s ease !important;
  font: inherit !important;
  outline: 0 !important;
  flex-shrink: 0 !important;
}

.bjpc-chatbot__close:hover,
.bjpc-chatbot__close:focus-visible {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--bjpc-text) !important;
}

.bjpc-chatbot__close svg {
  width: 18px !important;
  height: 18px !important;
}

/* ---------- Messages ---------- */

.bjpc-chatbot__messages {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 8px 20px 16px !important;
  overflow-y: auto !important;
  background: var(--bjpc-bg) !important;
  scroll-behavior: smooth !important;
}

.bjpc-chatbot__messages::-webkit-scrollbar {
  width: 6px !important;
}

.bjpc-chatbot__messages::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.14) !important;
  border-radius: 999px !important;
}

.bjpc-chatbot__message {
  display: flex !important;
  max-width: 84% !important;
  padding: 12px 16px !important;
  font-size: 14.5px !important;
  line-height: 1.5 !important;
  text-align: left !important;
  text-indent: 0 !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
  text-justify: auto !important;
  direction: ltr !important;
  unicode-bidi: normal !important;
  animation: bjpc-chatbot-msg-in 0.22s ease both !important;
}

@keyframes bjpc-chatbot-msg-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0);   }
}

.bjpc-chatbot__message::before,
.bjpc-chatbot__message::after,
.bjpc-chatbot__message-text::before,
.bjpc-chatbot__message-text::after {
  content: none !important;
  display: none !important;
}

.bjpc-chatbot__message-text {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: 400 !important;
  line-height: inherit !important;
  color: inherit !important;
  text-align: left !important;
  text-indent: 0 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  word-spacing: 0 !important;
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
  overflow-wrap: anywhere !important;
  hyphens: manual !important;
}

.bjpc-chatbot__message--bot {
  align-self: flex-start !important;
  background: var(--bjpc-bg-raise) !important;
  color: var(--bjpc-text) !important;
  border-radius: 6px 16px 16px 16px !important;
}

.bjpc-chatbot__message--user {
  align-self: flex-end !important;
  background: var(--bjpc-gold) !important;
  color: var(--bjpc-on-gold) !important;
  border-radius: 16px 16px 6px 16px !important;
  font-weight: 500 !important;
}

.bjpc-chatbot__message.is-loading {
  color: var(--bjpc-text-muted) !important;
  font-style: italic !important;
}

/* ---------- Rendered Markdown inside bot replies ---------- */

.bjpc-chatbot__message-text p {
  margin: 0 0 8px !important;
  padding: 0 !important;
}

.bjpc-chatbot__message-text p:last-child {
  margin-bottom: 0 !important;
}

.bjpc-chatbot__message-text ul,
.bjpc-chatbot__message-text ol {
  margin: 4px 0 8px !important;
  padding: 0 0 0 20px !important;
  list-style-position: outside !important;
}

.bjpc-chatbot__message-text ul { list-style-type: disc !important; }
.bjpc-chatbot__message-text ol { list-style-type: decimal !important; }

.bjpc-chatbot__message-text ul:last-child,
.bjpc-chatbot__message-text ol:last-child {
  margin-bottom: 0 !important;
}

.bjpc-chatbot__message-text li {
  margin: 3px 0 !important;
  padding: 0 !important;
  list-style: inherit !important;
  display: list-item !important;
}

.bjpc-chatbot__message-text strong {
  font-weight: 700 !important;
  color: inherit !important;
}

.bjpc-chatbot__message-text em {
  font-style: italic !important;
}

.bjpc-chatbot__message-text a {
  color: var(--bjpc-gold) !important;
  text-decoration: underline !important;
  word-break: break-word !important;
}

.bjpc-chatbot__sources {
  align-self: flex-start !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  max-width: 100% !important;
  margin-top: -4px !important;
}

.bjpc-chatbot__sources a {
  display: inline-block !important;
  max-width: 260px !important;
  padding: 5px 11px !important;
  font-size: 11.5px !important;
  line-height: 1.2 !important;
  color: var(--bjpc-text) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid var(--bjpc-border-strong) !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  transition: border-color 0.15s ease, background 0.15s ease !important;
}

.bjpc-chatbot__sources a:hover,
.bjpc-chatbot__sources a:focus-visible {
  border-color: var(--bjpc-gold) !important;
  background: rgba(201, 165, 92, 0.12) !important;
  text-decoration: none !important;
}

/* ---------- Form ---------- */

.bjpc-chatbot__form {
  display: block !important;
  padding: 8px 16px 18px !important;
  background: var(--bjpc-bg) !important;
  border-top: 0 !important;
  flex-shrink: 0 !important;
}

.bjpc-chatbot__input-wrap {
  position: relative !important;
  display: block !important;
  width: 100% !important;
}

.bjpc-chatbot__input {
  display: block !important;
  width: 100% !important;
  min-height: 50px !important;
  max-height: 120px !important;
  padding: 15px 56px 15px 18px !important;
  margin: 0 !important;
  font: inherit !important;
  font-size: 14.5px !important;
  line-height: 1.4 !important;
  color: var(--bjpc-text) !important;
  background: var(--bjpc-input-bg) !important;
  border: 1px solid var(--bjpc-border-strong) !important;
  border-radius: 14px !important;
  outline: 0 !important;
  resize: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition: border-color 0.15s ease !important;
}

.bjpc-chatbot__input::placeholder {
  color: var(--bjpc-text-muted) !important;
  opacity: 1 !important;
}

.bjpc-chatbot__input:focus,
.bjpc-chatbot__input:focus-visible {
  border-color: var(--bjpc-gold) !important;
  outline: 0 !important;
}

.bjpc-chatbot__send {
  position: absolute !important;
  right: 8px !important;
  bottom: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: var(--bjpc-gold) !important;
  color: var(--bjpc-on-gold) !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  transition: background 0.15s ease, transform 0.15s ease !important;
  font: inherit !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  outline: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

.bjpc-chatbot__send:hover,
.bjpc-chatbot__send:focus-visible {
  background: var(--bjpc-gold-dark) !important;
  transform: scale(1.06) !important;
}

.bjpc-chatbot__send:disabled,
.bjpc-chatbot__form.is-loading .bjpc-chatbot__send {
  cursor: wait !important;
  opacity: 0.6 !important;
  transform: none !important;
}

.bjpc-chatbot__send svg {
  width: 17px !important;
  height: 17px !important;
  transform: translate(1px, -1px) !important;
}

.bjpc-chatbot__input:disabled {
  cursor: wait !important;
  opacity: 0.7 !important;
}

/* ---------- Mobile ---------- */

@media (max-width: 520px) {
  .bjpc-chatbot {
    right: 16px !important;
    bottom: 16px !important;
  }

  .bjpc-chatbot__panel {
    position: fixed !important;
    inset: 12px !important;
    width: auto !important;
    height: auto !important;
    border-radius: 18px !important;
  }
}