/* RegenOrtho concierge assistant — launcher + chat panel (bottom-right; the
   mobile Call Now pill owns bottom-left) */

.rga-launch {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 85;
  display: inline-flex; align-items: center; gap: .55rem;
  background: var(--navy-800); color: var(--white); border: 1px solid rgba(253, 201, 41, .5);
  font: 800 var(--t-sm)/1 "Manrope", sans-serif; padding: .9rem 1.3rem; border-radius: 999px;
  cursor: pointer; box-shadow: 0 14px 34px -10px rgba(4, 16, 31, .55);
  transition: transform .25s cubic-bezier(.22, .61, .21, 1), background .25s;
}
.rga-launch:hover { transform: translateY(-2px); background: var(--navy-700); }
.rga-launch svg { flex-shrink: 0; }
.rga-launch .rga-dot {
  position: absolute; top: -3px; right: -3px; width: 12px; height: 12px; border-radius: 50%;
  background: var(--gold); box-shadow: 0 0 0 0 rgba(253, 201, 41, .55); animation: rgaPing 2.4s infinite;
}
@keyframes rgaPing { 70% { box-shadow: 0 0 0 11px rgba(253, 201, 41, 0); } 100% { box-shadow: 0 0 0 0 rgba(253, 201, 41, 0); } }
body.nav-locked .rga-launch { display: none; }

.rga-panel {
  position: fixed; right: 1rem; bottom: 1rem; z-index: 95;
  width: min(400px, calc(100vw - 2rem)); height: min(600px, calc(100dvh - 2rem));
  display: none; flex-direction: column; overflow: hidden;
  background: var(--porcelain); border-radius: 20px; border: 1px solid rgba(9, 45, 92, .2);
  box-shadow: 0 34px 70px -20px rgba(4, 16, 31, .55);
}
.rga-panel.is-open { display: flex; }

.rga-head {
  background: linear-gradient(160deg, var(--navy-800), var(--navy-900)); color: var(--white);
  padding: 1rem 1.1rem; display: flex; align-items: center; gap: .8rem; flex-shrink: 0;
}
.rga-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--gold); display: grid; place-items: center; flex-shrink: 0; }
.rga-head-info { flex: 1; min-width: 0; }
.rga-head-info strong { display: block; font: 700 var(--t-base)/1.25 "Newsreader", serif; }
.rga-head-info span { font-size: var(--t-3xs); color: var(--on-navy-muted); }
.rga-close { background: none; border: 0; color: var(--on-navy-muted); cursor: pointer; padding: .4rem; border-radius: 8px; line-height: 0; }
.rga-close:hover { color: var(--gold); }

.rga-log { flex: 1; overflow-y: auto; padding: 1.1rem; display: flex; flex-direction: column; gap: .7rem; overscroll-behavior: contain; }
.rga-msg { max-width: 86%; padding: .7rem .95rem; border-radius: 16px; font-size: var(--t-sm); line-height: 1.5; white-space: pre-line; overflow-wrap: break-word; }
.rga-msg a { color: inherit; font-weight: 700; }
.rga-msg-bot { background: var(--white); border: 1px solid var(--line); border-bottom-left-radius: 6px; align-self: flex-start; color: var(--ink); }
.rga-msg-user { background: var(--navy-800); color: var(--white); border-bottom-right-radius: 6px; align-self: flex-end; }
.rga-typing { display: inline-flex; gap: 5px; padding: .85rem 1rem; }
.rga-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--on-navy-faint); animation: rgaBlink 1.2s infinite; }
.rga-typing i:nth-child(2) { animation-delay: .2s; }
.rga-typing i:nth-child(3) { animation-delay: .4s; }
@keyframes rgaBlink { 0%, 60%, 100% { opacity: .3; } 30% { opacity: 1; } }

.rga-chips { display: flex; flex-wrap: wrap; gap: .45rem; align-self: flex-start; max-width: 100%; }
.rga-chip {
  border: 1px solid var(--navy-800); color: var(--navy-800); background: var(--white); border-radius: 999px;
  font: 700 var(--t-2xs)/1.2 "Manrope", sans-serif; padding: .5rem .95rem; cursor: pointer;
  transition: background .2s, color .2s, transform .2s;
}
.rga-chip:hover { background: var(--navy-800); color: var(--gold); transform: translateY(-1px); }
.rga-chip-gold { background: var(--gold); border-color: var(--gold); color: var(--navy-800); }
.rga-chip-gold:hover { background: var(--navy-800); border-color: var(--navy-800); }

.rga-input { display: flex; gap: .5rem; padding: .8rem; border-top: 1px solid var(--line); background: var(--white); flex-shrink: 0; }
.rga-input input {
  flex: 1; border: 1px solid var(--line); border-radius: 999px; padding: .7rem 1.05rem;
  font: 500 var(--t-sm)/1.3 "Manrope", sans-serif; color: var(--ink); background: var(--porcelain); min-width: 0;
}
.rga-input input:focus { outline: 2px solid var(--gold); border-color: var(--gold); }
.rga-send {
  width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--gold); color: var(--navy-800);
  display: grid; place-items: center; cursor: pointer; flex-shrink: 0; transition: transform .2s, background .2s;
}
.rga-send:hover { transform: scale(1.06); }
.rga-fine { font-size: var(--t-3xs); color: var(--muted); text-align: center; padding: 0 .9rem .6rem; background: var(--white); flex-shrink: 0; }

/* Phones get a full sheet pinned to the VISUAL viewport, not the layout one.
   iOS does not shrink the layout viewport when the keyboard opens, so a
   position:fixed panel anchored to bottom sits behind the keyboard and you
   can't see what you're typing. dvh doesn't help — it tracks browser chrome,
   not the keyboard. assist.js drives --rga-h/--rga-top off visualViewport. */
@media (max-width: 600px) {
  .rga-panel {
    left: 0; right: 0; bottom: auto; top: 0;
    width: 100%; border-radius: 0;
    height: var(--rga-h, 100dvh);
    transform: translateY(var(--rga-top, 0px));
    padding-bottom: env(safe-area-inset-bottom);
  }
  .rga-panel .rga-input { padding-bottom: calc(.8rem + env(safe-area-inset-bottom)); }
}

/* Background must not scroll under the open sheet — that drifting is what
   reads as the panel "jumping around". */
body.rga-locked { position: fixed; left: 0; right: 0; width: 100%; overflow: hidden; }
body.rga-locked .mobile-call { display: none; }

@media (prefers-reduced-motion: reduce) {
  .rga-launch .rga-dot, .rga-typing i { animation: none; }
}
