/* diveshack Chatbot Widget */
.ds-chat-toggle {
  position: fixed;
  bottom: 1.2rem;
  right: 1.2rem;
  z-index: 9999;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #1e73be;
  border: none;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,.4);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .2s, background .2s;
}
.ds-chat-toggle:hover { transform: scale(1.08); background: #25a0e8; }
.ds-chat-toggle svg { width: 26px; height: 26px; fill: #fff; }
.ds-chat-toggle .ds-close-icon { display: none; }
.ds-chat-toggle.open .ds-chat-icon { display: none; }
.ds-chat-toggle.open .ds-close-icon { display: block; }

.ds-chat-panel {
  position: fixed;
  bottom: 5rem;
  right: 1.2rem;
  z-index: 9998;
  width: 380px;
  max-height: 520px;
  background: #0a1829;
  border: 1px solid #1a4a73;
  border-radius: 12px;
  display: none;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
  font-family: 'Open Sans', -apple-system, sans-serif;
}
.ds-chat-panel.open { display: flex; }

.ds-chat-header {
  background: linear-gradient(135deg, #0e1f33 0%, #1a3a5c 100%);
  padding: .9rem 1rem;
  display: flex;
  align-items: center;
  gap: .6rem;
  border-bottom: 1px solid #1a4a73;
}
.ds-chat-header-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #00d68f;
  flex-shrink: 0;
}
.ds-chat-header-text { flex: 1; }
.ds-chat-header-title {
  font-size: .82rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
}
.ds-chat-header-sub {
  font-size: .62rem;
  color: #00d68f;
  letter-spacing: .03em;
  font-weight: 600;
}

.ds-chat-body {
  flex: 1;
  overflow-y: auto;
  padding: .8rem;
  display: flex;
  flex-direction: column;
  gap: .6rem;
  min-height: 280px;
  max-height: 360px;
  scrollbar-width: thin;
  scrollbar-color: #1a4a73 transparent;
}
.ds-chat-body::-webkit-scrollbar { width: 5px; }
.ds-chat-body::-webkit-scrollbar-thumb { background: #1a4a73; border-radius: 3px; }

.ds-msg {
  max-width: 85%;
  padding: .55rem .8rem;
  border-radius: 10px;
  font-size: .8rem;
  line-height: 1.5;
  color: #e0e8f0;
  word-wrap: break-word;
}
.ds-msg a {
  color: #00bfff;
  text-decoration: none;
}
.ds-msg a:hover { text-decoration: underline; }
.ds-msg-bot {
  background: #0e1f33;
  border: 1px solid #1a4a73;
  align-self: flex-start;
  border-bottom-left-radius: 3px;
}
.ds-msg-user {
  background: #1e73be;
  color: #fff;
  align-self: flex-end;
  border-bottom-right-radius: 3px;
}
.ds-msg-bot p { margin: 0 0 .4rem 0; }
.ds-msg-bot p:last-child { margin-bottom: 0; }
.ds-msg-bot strong { color: #fff; }
.ds-msg-bot ul, .ds-msg-bot ol { margin: .3rem 0 .3rem 1.2rem; padding: 0; }
.ds-msg-bot li { margin-bottom: .2rem; }

.ds-typing {
  align-self: flex-start;
  display: none;
  gap: 4px;
  padding: .6rem .8rem;
  background: #0e1f33;
  border: 1px solid #1a4a73;
  border-radius: 10px;
  border-bottom-left-radius: 3px;
}
.ds-typing.active { display: flex; }
.ds-typing span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #7a9cbf;
  animation: ds-bounce .6s infinite alternate;
}
.ds-typing span:nth-child(2) { animation-delay: .2s; }
.ds-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes ds-bounce { to { opacity: .3; transform: translateY(-4px); } }

.ds-chat-footer {
  padding: .6rem;
  border-top: 1px solid #1a4a73;
  background: #070f1a;
  display: flex;
  gap: .4rem;
}
.ds-chat-input {
  flex: 1;
  background: #0a1829;
  border: 1px solid #1a4a73;
  border-radius: 8px;
  padding: .5rem .7rem;
  color: #fff;
  font-size: .8rem;
  font-family: inherit;
  outline: none;
  resize: none;
  min-height: 38px;
  max-height: 80px;
}
.ds-chat-input::placeholder { color: #4a6a8a; }
.ds-chat-input:focus { border-color: #25a0e8; }
.ds-chat-send {
  background: #1e73be;
  border: none;
  border-radius: 8px;
  width: 38px;
  height: 38px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s;
  flex-shrink: 0;
}
.ds-chat-send:hover { background: #25a0e8; }
.ds-chat-send:disabled { background: #1a3a5c; cursor: default; }
.ds-chat-send svg { width: 18px; height: 18px; fill: #fff; }

.ds-chat-welcome {
  text-align: center;
  padding: 1.2rem .5rem;
}
.ds-chat-welcome-icon {
  font-size: 2rem;
  margin-bottom: .4rem;
}
.ds-chat-welcome h4 {
  color: #fff;
  font-size: .85rem;
  margin: 0 0 .3rem 0;
}
.ds-chat-welcome p {
  color: #7a9cbf;
  font-size: .7rem;
  margin: 0 0 .8rem 0;
  line-height: 1.4;
}
.ds-suggestions {
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.ds-suggestion {
  background: #0e1f33;
  border: 1px solid #1a4a73;
  border-radius: 8px;
  padding: .45rem .7rem;
  color: #b0c8e0;
  font-size: .7rem;
  cursor: pointer;
  text-align: left;
  transition: border-color .15s, color .15s;
}
.ds-suggestion:hover {
  border-color: #25a0e8;
  color: #fff;
}

/* Mobile */
@media (max-width: 480px) {
  .ds-chat-panel {
    width: calc(100vw - 1.6rem);
    right: .8rem;
    bottom: 4.5rem;
    max-height: calc(100vh - 6rem);
  }
  .ds-chat-body { max-height: calc(100vh - 14rem); }
  .ds-chat-toggle { bottom: .8rem; right: .8rem; width: 50px; height: 50px; }
}

/* Adjust for depth gauge strip if present */
body[style*="padding-right: 52px"] .ds-chat-toggle,
body[style*="padding-right: 52px"] .ds-chat-panel {
  right: calc(52px + 1.2rem);
}
@media (max-width: 480px) {
  body[style*="padding-right: 52px"] .ds-chat-panel {
    right: calc(52px + .8rem);
    width: calc(100vw - 52px - 1.6rem);
  }
}