/* Rtnit2.me AI chat widget. Everything is prefixed rb- to stay clear of site styles. */
.rb-root {
  --rb-brand: #2563eb;
  --rb-brand-2: #7c3aed;
  --rb-ink: #111827;
  --rb-muted: #6b7280;
  --rb-line: #e5e7eb;
  --rb-bot-bg: #f3f4f6;
  --rb-bottom: 28px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.45;
  color: var(--rb-ink);
}
.rb-root *, .rb-root *::before, .rb-root *::after { box-sizing: border-box; }
.rb-root.rb-hidden .rb-fab { display: none; }
/* logged-in pages also have the Messages bubble bottom-right: sit above it */
.rb-root.rb-stacked { --rb-bottom: 96px; }
.rb-csrf { display: none; }

.rb-fab {
  position: fixed; right: 28px; bottom: var(--rb-bottom); z-index: 9995;
  width: 58px; height: 58px; border-radius: 50%; border: 0; cursor: pointer;
  background: linear-gradient(135deg, var(--rb-brand), var(--rb-brand-2));
  box-shadow: 0 6px 22px rgba(37, 99, 235, .45);
  display: flex; align-items: center; justify-content: center;
  transition: transform .15s ease;
}
.rb-fab:hover { transform: scale(1.06); }
.rb-fab svg { width: 28px; height: 28px; }
.rb-icon-chat { fill: #fff; }
.rb-icon-close { fill: none; stroke: #fff; stroke-width: 2.4; stroke-linecap: round; display: none; }
.rb-root.rb-open .rb-icon-chat { display: none; }
.rb-root.rb-open .rb-icon-close { display: block; }

.rb-panel {
  position: fixed; right: 28px; bottom: calc(var(--rb-bottom) + 70px); z-index: 9996;
  width: 370px; max-width: calc(100vw - 32px);
  height: 540px; max-height: calc(100vh - var(--rb-bottom) - 100px);
  background: #fff; border-radius: 18px; overflow: hidden;
  box-shadow: 0 18px 50px rgba(17, 24, 39, .22);
  display: flex; flex-direction: column;
}
.rb-panel[hidden] { display: none !important; }

.rb-head {
  display: flex; align-items: center; gap: 10px; padding: 14px 14px 14px 16px;
  background: linear-gradient(135deg, var(--rb-brand), var(--rb-brand-2)); color: #fff;
}
.rb-avatar {
  width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, .2);
  display: flex; align-items: center; justify-content: center; font-weight: 800; flex: none;
}
.rb-head-text { flex: 1; min-width: 0; }
.rb-title { font-weight: 700; font-size: 15px; color: #fff; }
.rb-sub { font-size: 12px; opacity: .85; color: #fff; }
.rb-reset, .rb-close {
  background: transparent; border: 0; color: #fff; cursor: pointer; opacity: .85;
  font-size: 22px; line-height: 1; padding: 4px 6px; border-radius: 8px;
}
.rb-reset { font-size: 18px; }
.rb-reset:hover, .rb-close:hover { opacity: 1; background: rgba(255, 255, 255, .15); }

.rb-log { flex: 1; overflow-y: auto; padding: 16px 14px; display: flex; flex-direction: column; gap: 8px; background: #fff; }
.rb-msg {
  max-width: 85%; padding: 9px 13px; border-radius: 16px; white-space: pre-wrap;
  word-wrap: break-word; overflow-wrap: anywhere;
}
.rb-msg a { color: inherit; text-decoration: underline; font-weight: 600; }
.rb-bot { align-self: flex-start; background: var(--rb-bot-bg); color: var(--rb-ink); border-bottom-left-radius: 5px; }
.rb-user { align-self: flex-end; background: var(--rb-brand); color: #fff; border-bottom-right-radius: 5px; }
.rb-msg.rb-error { background: #fef2f2; color: #991b1b; }
.rb-typing { display: inline-flex; gap: 4px; align-items: center; }
.rb-typing span {
  width: 7px; height: 7px; border-radius: 50%; background: #9ca3af;
  animation: rb-bounce 1.2s infinite ease-in-out;
}
.rb-typing span:nth-child(2) { animation-delay: .15s; }
.rb-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes rb-bounce { 0%, 80%, 100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-5px); opacity: 1; } }

.rb-form { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--rb-line); background: #fff; }
.rb-input {
  flex: 1; resize: none; border: 1px solid var(--rb-line); border-radius: 14px;
  padding: 9px 12px; font: inherit; color: var(--rb-ink); background: #fff;
  max-height: 110px; outline: none;
}
.rb-input:focus { border-color: var(--rb-brand); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.rb-send {
  width: 40px; height: 40px; flex: none; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--rb-brand); display: flex; align-items: center; justify-content: center;
}
.rb-send:disabled { opacity: .5; cursor: default; }
.rb-send svg { width: 18px; height: 18px; fill: #fff; }
.rb-foot { font-size: 11px; color: var(--rb-muted); text-align: center; padding: 0 12px 10px; background: #fff; }
.rb-foot a { color: var(--rb-brand); }

@media (max-width: 480px) {
  .rb-fab { right: 16px; }
  .rb-root { --rb-bottom: 18px; }
  .rb-root.rb-stacked { --rb-bottom: 86px; }
  .rb-panel { right: 0; left: 0; bottom: 0; width: 100%; max-width: 100%; height: 100%; max-height: 100%; border-radius: 0; z-index: 10000; }
  .rb-root.rb-open .rb-fab { display: none; }
}
