body.index-reference-page .index-icon-button {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  font: inherit !important;
}

body.index-reference-page .cp-chatbot-backdrop {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(8, 22, 22, 0.34) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  z-index: 998 !important;
}

body.index-reference-page .cp-chatbot {
  position: fixed !important;
  top: 108px !important;
  right: 28px !important;
  width: 400px !important;
  max-width: calc(100vw - 32px) !important;
  height: 640px !important;
  max-height: calc(100vh - 132px) !important;
  background: #ffffff !important;
  border: 1px solid #e6ece8 !important;
  border-radius: 24px !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.18) !important;
  z-index: 999 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

body.index-reference-page .cp-chatbot__header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 18px 18px 16px !important;
  background: linear-gradient(135deg, #0d3534 0%, #1f5a57 100%) !important;
  color: #ffffff !important;
}

body.index-reference-page .cp-chatbot__brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

body.index-reference-page .cp-chatbot__brand-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 14px !important;
  background: #43c463 !important;
  color: #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: 0.6px !important;
  flex: 0 0 44px !important;
}

body.index-reference-page .cp-chatbot__brand-copy {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
}

body.index-reference-page .cp-chatbot__brand-copy strong {
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
}

body.index-reference-page .cp-chatbot__brand-copy span {
  margin-top: 4px !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  color: rgba(255, 255, 255, 0.82) !important;
}

body.index-reference-page .cp-chatbot__close {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  background: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  font-size: 28px !important;
  line-height: 1 !important;
  padding: 0 !important;
}

body.index-reference-page .cp-chatbot__close:hover {
  background: rgba(255, 255, 255, 0.22) !important;
}

body.index-reference-page .cp-chatbot__body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  background: #f6f8f7 !important;
}

body.index-reference-page .cp-chatbot__messages {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

body.index-reference-page .cp-chatbot__message {
  display: flex !important;
  width: 100% !important;
}

body.index-reference-page .cp-chatbot__message--bot {
  justify-content: flex-start !important;
}

body.index-reference-page .cp-chatbot__message--user {
  justify-content: flex-end !important;
}

body.index-reference-page .cp-chatbot__bubble {
  max-width: 84% !important;
  padding: 13px 15px !important;
  border-radius: 18px !important;
  font-size: 14px !important;
  line-height: 1.58 !important;
  word-break: break-word !important;
}

body.index-reference-page .cp-chatbot__message--bot .cp-chatbot__bubble {
  background: #ffffff !important;
  color: #173433 !important;
  border: 1px solid #e0e8e3 !important;
  border-bottom-left-radius: 8px !important;
}

body.index-reference-page .cp-chatbot__message--user .cp-chatbot__bubble {
  background: #43c463 !important;
  color: #ffffff !important;
  border-bottom-right-radius: 8px !important;
}

body.index-reference-page .cp-chatbot__quick-actions {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  padding: 0 18px 16px !important;
}

body.index-reference-page .cp-chatbot__quick-btn {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 1px solid #d8e7dc !important;
  background: #ffffff !important;
  color: #1f4b48 !important;
  border-radius: 999px !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  line-height: 1.2 !important;
}

body.index-reference-page .cp-chatbot__quick-btn:hover {
  border-color: #43c463 !important;
  color: #2ea84d !important;
}

body.index-reference-page .cp-chatbot__form {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 10px !important;
  padding: 16px 18px 18px !important;
  background: #ffffff !important;
  border-top: 1px solid #e8efea !important;
}

body.index-reference-page .cp-chatbot__input {
  width: 100% !important;
  min-width: 0 !important;
  height: 50px !important;
  border: 1px solid #d9e6df !important;
  border-radius: 14px !important;
  padding: 0 15px !important;
  font-size: 14px !important;
  color: #153534 !important;
  background: #f9fbfa !important;
  outline: none !important;
}

body.index-reference-page .cp-chatbot__input:focus {
  border-color: #43c463 !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(67, 196, 99, 0.14) !important;
}

body.index-reference-page .cp-chatbot__send {
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  border-radius: 14px !important;
  padding: 0 18px !important;
  min-width: 96px !important;
  height: 50px !important;
  background: #43c463 !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

body.index-reference-page .cp-chatbot__send:hover {
  background: #2faa4a !important;
}

body.index-reference-page .cp-chatbot[hidden],
body.index-reference-page .cp-chatbot-backdrop[hidden] {
  display: none !important;
}

body.index-reference-page .cp-chatbot__typing {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

body.index-reference-page .cp-chatbot__typing-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: #6f8f86 !important;
  animation: cpChatbotBlink 1.2s infinite ease-in-out !important;
}

body.index-reference-page .cp-chatbot__typing-dot:nth-child(2) {
  animation-delay: 0.15s !important;
}

body.index-reference-page .cp-chatbot__typing-dot:nth-child(3) {
  animation-delay: 0.3s !important;
}

@keyframes cpChatbotBlink {
  0%, 80%, 100% {
    opacity: 0.35;
    transform: translateY(0);
  }
  40% {
    opacity: 1;
    transform: translateY(-2px);
  }
}

@media (max-width: 860px) {
  body.index-reference-page .cp-chatbot {
    right: 16px !important;
    top: 100px !important;
    width: min(420px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 116px) !important;
  }
}

@media (max-width: 640px) {
  body.index-reference-page .cp-chatbot {
    top: auto !important;
    right: 10px !important;
    left: 10px !important;
    bottom: 10px !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: calc(100vh - 20px) !important;
    border-radius: 22px !important;
  }

  body.index-reference-page .cp-chatbot__bubble {
    max-width: 90% !important;
  }

  body.index-reference-page .cp-chatbot__form {
    grid-template-columns: 1fr !important;
  }

  body.index-reference-page .cp-chatbot__send {
    width: 100% !important;
  }
}