/* ============================================================
   FIRST REHABILITATION — Intake Assistant widget
   Chat-style concierge. Shares tokens with styles.css.
   ============================================================ */

.fri-root { position: fixed; right: clamp(14px, 3vw, 26px); bottom: calc(clamp(14px, 3vw, 26px) + env(safe-area-inset-bottom, 0px)); z-index: 1200; font-family: var(--font-body); }

/* ---------- Launcher ---------- */
.fri-launcher {
  position: relative; width: 62px; height: 62px; border-radius: 50%;
  background: linear-gradient(150deg, var(--ink-soft), var(--ink-deep));
  border: 1px solid rgba(233, 196, 106, 0.55);
  color: var(--cream); cursor: pointer; display: grid; place-items: center;
  box-shadow: 0 18px 40px -14px rgba(7, 30, 39, 0.65);
  transition: transform 0.3s cubic-bezier(.2,.8,.2,1), box-shadow 0.3s ease;
}
.fri-launcher:hover { transform: translateY(-3px) scale(1.04); box-shadow: 0 24px 48px -14px rgba(7, 30, 39, 0.7); }
.fri-launcher svg { width: 28px; height: 28px; display: block; }
.fri-launcher::before {
  content: ""; position: absolute; inset: -4px; border-radius: 50%;
  border: 1.5px solid var(--gold); opacity: 0; animation: fri-halo 2.8s ease-out infinite;
}
@keyframes fri-halo { 0% { transform: scale(0.85); opacity: 0.7; } 70% { transform: scale(1.35); opacity: 0; } 100% { opacity: 0; } }
.fri-launcher .fri-dot {
  position: absolute; top: 2px; right: 2px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--coral); border: 2.5px solid var(--cream-soft);
}
.fri-root.open .fri-launcher { display: none; }

/* ---------- Teaser nudge ---------- */
.fri-teaser {
  position: absolute; right: 0; bottom: calc(100% + 14px); width: min(290px, 78vw);
  background: var(--paper); color: var(--text); border: 1px solid var(--line);
  border-radius: 18px 18px 4px 18px; padding: 0.95rem 2.2rem 0.95rem 1.1rem;
  font-size: 0.92rem; line-height: 1.5; box-shadow: var(--shadow-card); cursor: pointer;
  opacity: 0; transform: translateY(8px); pointer-events: none;
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(.2,.8,.2,1);
}
.fri-teaser.show { opacity: 1; transform: none; pointer-events: auto; }
.fri-teaser strong { color: var(--ink); }
.fri-teaser .fri-teaser-x {
  position: absolute; top: 0; right: 0; background: none; border: none; cursor: pointer;
  color: var(--muted); font-size: 1rem; line-height: 1;
  width: 44px; height: 44px; display: grid; place-items: center;
}
.fri-teaser .fri-teaser-x:hover { color: var(--ink); }

/* ---------- Panel ---------- */
.fri-panel {
  position: absolute; right: 0; bottom: 0;
  width: min(392px, calc(100vw - 28px));
  height: min(636px, calc(100vh - 40px));
  height: min(636px, calc(100svh - 40px));
  display: none; flex-direction: column; overflow: hidden;
  background: var(--cream-soft); border: 1px solid var(--line);
  border-radius: 24px; box-shadow: var(--shadow-soft);
  opacity: 0; transform: translateY(18px) scale(0.97); transform-origin: bottom right;
}
.fri-root.open .fri-panel { display: flex; animation: fri-in 0.4s cubic-bezier(.2,.8,.2,1) forwards; }
@keyframes fri-in { to { opacity: 1; transform: none; } }

/* Header */
.fri-head {
  position: relative; flex-shrink: 0; display: flex; align-items: center; gap: 0.85rem;
  padding: 1.05rem 1.15rem; color: var(--cream);
  background:
    radial-gradient(120% 160% at 90% 0%, rgba(233, 196, 106, 0.22), transparent 55%),
    linear-gradient(155deg, var(--ink) 0%, var(--ink-deep) 78%);
  border-bottom: 1px solid rgba(233, 196, 106, 0.3);
}
.fri-head img { height: 40px; width: auto; flex-shrink: 0; }
.fri-head .fri-who { min-width: 0; }
.fri-head .fri-title { font-family: var(--font-display); font-weight: 600; font-size: 1.12rem; line-height: 1.2; }
.fri-head .fri-sub { display: flex; align-items: center; gap: 0.4rem; font-size: 0.72rem; letter-spacing: 0.06em; color: rgba(246, 241, 231, 0.75); margin-top: 2px; }
.fri-head .fri-sub::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 8px var(--gold); flex-shrink: 0; }
.fri-head .fri-x {
  margin-left: auto; background: none; border: none; cursor: pointer; color: rgba(246, 241, 231, 0.8);
  padding: 6px; border-radius: 8px; display: grid; place-items: center; flex-shrink: 0;
}
.fri-head .fri-x:hover { color: var(--cream); background: rgba(246, 241, 231, 0.1); }
.fri-head .fri-x svg { width: 20px; height: 20px; }

/* Message log */
.fri-log { flex: 1; overflow-y: auto; padding: 1.15rem 1rem 0.6rem; scroll-behavior: smooth; overscroll-behavior: contain; }
.fri-msg { max-width: 86%; margin-bottom: 0.6rem; padding: 0.78rem 1rem; font-size: 1rem; line-height: 1.55; animation: fri-pop 0.32s cubic-bezier(.2,.8,.2,1); word-wrap: break-word; }
@keyframes fri-pop { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.fri-msg.bot { background: var(--paper); color: var(--text); border: 1px solid var(--line); border-radius: 16px 16px 16px 5px; }
.fri-msg.user { background: var(--ink); color: var(--cream); border-radius: 16px 16px 5px 16px; margin-left: auto; }
.fri-msg a { color: #B65717; font-weight: 600; }
.fri-msg.user a { color: var(--gold); }
.fri-msg.bot .fri-note { display: block; margin-top: 0.3rem; font-size: 0.8rem; color: var(--muted); }

/* Typing indicator */
.fri-typing { display: inline-flex; align-items: center; gap: 5px; padding: 0.85rem 1rem; }
.fri-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); opacity: 0.5; animation: fri-blink 1.1s ease infinite; }
.fri-typing i:nth-child(2) { animation-delay: 0.18s; }
.fri-typing i:nth-child(3) { animation-delay: 0.36s; }
@keyframes fri-blink { 0%, 100% { opacity: 0.3; transform: translateY(0); } 45% { opacity: 1; transform: translateY(-3px); } }

/* Quick-reply chips */
.fri-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0.25rem 0 0.85rem; animation: fri-pop 0.35s cubic-bezier(.2,.8,.2,1); }
.fri-chip {
  font-family: var(--font-body); font-size: 0.95rem; font-weight: 600; color: var(--ink);
  background: var(--paper); border: 1.5px solid var(--gold-soft); border-radius: 999px;
  padding: 0.62rem 1.15rem; cursor: pointer; min-height: 44px;
  transition: all 0.22s ease;
}
.fri-chip:hover { background: var(--gold); border-color: var(--gold); color: var(--ink-deep); transform: translateY(-2px); }
.fri-chip.primary { background: var(--coral); border-color: var(--coral); color: var(--ink-deep); }
.fri-chip.primary:hover { background: var(--coral-deep); border-color: var(--coral-deep); }

/* Summary card */
.fri-summary { background: var(--paper); border: 1px solid var(--line); border-left: 3px solid var(--gold); border-radius: 14px; padding: 0.9rem 1rem; margin-bottom: 0.85rem; font-size: 0.9rem; animation: fri-pop 0.32s ease; }
.fri-summary div { display: flex; gap: 0.7rem; padding: 0.22rem 0; }
.fri-summary .k { flex-shrink: 0; width: 84px; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); padding-top: 3px; }
.fri-summary .v { color: var(--ink); font-weight: 500; min-width: 0; overflow-wrap: anywhere; }

/* Input bar */
.fri-bar { flex-shrink: 0; display: flex; align-items: center; gap: 0.6rem; padding: 0.8rem 0.9rem; background: var(--paper); border-top: 1px solid var(--line); }
.fri-input {
  flex: 1; min-width: 0; font-family: var(--font-body); font-size: 0.95rem; color: var(--text);
  background: var(--cream-soft); border: 1.5px solid var(--line); border-radius: 999px;
  padding: 0.68rem 1.15rem; outline: none; transition: border-color 0.2s ease;
}
.fri-input:focus { border-color: var(--gold); }
.fri-input::placeholder { color: var(--muted); opacity: 0.75; }
.fri-send {
  flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer;
  background: var(--coral); color: var(--ink-deep); display: grid; place-items: center;
  box-shadow: 0 10px 22px -10px rgba(224, 138, 68, 0.8);
  transition: background 0.25s ease, transform 0.25s ease;
}
.fri-send:hover { background: var(--coral-deep); transform: translateY(-2px); }
.fri-send:disabled { opacity: 0.45; cursor: default; transform: none; }
.fri-send svg { width: 19px; height: 19px; }
.fri-privacy { flex-shrink: 0; text-align: center; font-size: 0.68rem; color: var(--muted); background: var(--paper); padding: 0 0.9rem 0.55rem; }

/* Mobile: bottom sheet */
@media (max-width: 640px) {
  .fri-root.open { right: 0; bottom: 0; left: 0; }
  .fri-panel { position: fixed; right: 0; bottom: 0; left: 0; width: 100%; height: min(88svh, 640px); border-radius: 22px 22px 0 0; border-left: none; border-right: none; border-bottom: none; }
  .fri-input { font-size: 16px; } /* prevents iOS focus zoom */
}

@media (prefers-reduced-motion: reduce) {
  .fri-launcher::before { animation: none; opacity: 0; }
}

.fri-teaser-open { all: unset; cursor: pointer; display: block; font: inherit; color: inherit; }
.fri-teaser-open:focus-visible { outline: 3px solid #A04E14; outline-offset: 3px; border-radius: 6px; }
