/* ── ASK RAZZ CHAT PANEL ── */

/* Nav trigger */
.razz-trigger {
  display:inline-flex; align-items:center; gap:6px;
  color:rgba(255,255,255,0.55); font-family:'Nunito',sans-serif;
  font-size:0.78rem; font-weight:700; letter-spacing:0.04em;
  text-decoration:none; cursor:pointer; background:none; border:none;
  transition:color 0.2s;
}
.razz-trigger:hover { color:var(--orange); }
.razz-trigger svg { width:16px; height:16px; }
body.light .razz-trigger { color:rgba(0,0,0,0.45); }
body.light .razz-trigger:hover { color:var(--orange); }

/* Mobile drawer razz button */
.razz-trigger-mobile {
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:calc(100% - 40px); margin:8px 20px 4px; padding:14px 20px;
  font-family:'Nunito',sans-serif; font-size:0.82rem; font-weight:800;
  letter-spacing:0.08em; text-transform:uppercase;
  color:var(--orange); text-align:center;
  background:rgba(244,162,97,0.08); border:1px solid rgba(244,162,97,0.25);
  border-radius:6px; cursor:pointer;
  transition:background 0.2s, border-color 0.2s, color 0.2s;
}
.razz-trigger-mobile:hover { background:rgba(244,162,97,0.15); border-color:var(--orange); }
body.light .razz-trigger-mobile {
  color:var(--orange); background:rgba(244,162,97,0.06);
  border-color:rgba(244,162,97,0.2);
}
body.light .razz-trigger-mobile:hover { background:rgba(244,162,97,0.12); border-color:var(--orange); }

/* Backdrop */
.razz-backdrop {
  position:fixed; inset:0; z-index:9998;
  background:rgba(0,0,0,0.5); backdrop-filter:blur(4px);
  opacity:0; visibility:hidden; transition:opacity 0.3s, visibility 0.3s;
}
.razz-backdrop.open { opacity:1; visibility:visible; }

/* Panel */
.razz-panel {
  position:fixed; top:0; right:0; bottom:0; z-index:9999;
  width:100%; max-width:440px;
  background:#121212; border-left:1px solid var(--line);
  display:flex; flex-direction:column;
  transform:translateX(100%); transition:transform 0.3s cubic-bezier(0.4,0,0.2,1);
  box-shadow:-16px 0 40px rgba(0,0,0,0.5);
}
.razz-panel.open { transform:translateX(0); }
body.light .razz-panel {
  background:#F5F4F2; border-left-color:rgba(0,0,0,0.08);
  box-shadow:-16px 0 40px rgba(0,0,0,0.1);
}

/* Header */
.razz-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 24px; border-bottom:1px solid var(--line); flex-shrink:0;
}
body.light .razz-header { border-bottom-color:rgba(0,0,0,0.08); }
.razz-header-left { display:flex; align-items:center; gap:10px; }
.razz-icon {
  width:32px; height:32px; border-radius:8px;
  background:var(--orange); display:flex; align-items:center; justify-content:center;
}
.razz-icon svg { width:16px; height:16px; color:#fff; }
.razz-header-title { font-family:'Nunito',sans-serif; font-weight:800; font-size:0.88rem; color:var(--white); }
body.light .razz-header-title { color:#0C0C0C; }
.razz-header-sub { font-family:'Nunito',sans-serif; font-size:0.72rem; color:rgba(255,255,255,0.4); }
body.light .razz-header-sub { color:rgba(0,0,0,0.4); }
.razz-close {
  width:32px; height:32px; border-radius:8px; border:none;
  background:none; cursor:pointer; display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,0.4); transition:background 0.2s, color 0.2s;
}
.razz-close:hover { background:rgba(255,255,255,0.06); color:var(--white); }
body.light .razz-close { color:rgba(0,0,0,0.4); }
body.light .razz-close:hover { background:rgba(0,0,0,0.04); color:#0C0C0C; }
.razz-close svg { width:16px; height:16px; }

/* Body */
.razz-body {
  flex:1; overflow-y:auto; padding:24px;
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,0.1) transparent;
}
body.light .razz-body { scrollbar-color:rgba(0,0,0,0.1) transparent; }

/* Suggested questions */
.razz-suggested-label {
  font-family:'Nunito',sans-serif; font-size:0.82rem; font-weight:600;
  color:rgba(255,255,255,0.4); margin-bottom:12px;
}
body.light .razz-suggested-label { color:rgba(0,0,0,0.4); }
.razz-suggestions { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.razz-suggestion-btn {
  text-align:left; font-family:'Nunito',sans-serif; font-size:0.82rem;
  padding:10px 14px; border-radius:10px;
  border:1px solid var(--line); background:rgba(255,255,255,0.03);
  color:var(--white); cursor:pointer; transition:border-color 0.2s, background 0.2s;
}
.razz-suggestion-btn:hover { border-color:var(--orange); background:rgba(244,162,97,0.06); }
body.light .razz-suggestion-btn {
  border-color:rgba(0,0,0,0.1); background:rgba(0,0,0,0.02); color:#0C0C0C;
}
body.light .razz-suggestion-btn:hover { border-color:var(--orange); background:rgba(244,162,97,0.06); }

/* Intro box */
.razz-intro {
  border-radius:12px; background:rgba(255,255,255,0.04); padding:16px;
}
body.light .razz-intro { background:rgba(0,0,0,0.03); }
.razz-intro p {
  font-family:'Nunito',sans-serif; font-size:0.82rem; line-height:1.6;
  color:rgba(255,255,255,0.4); margin:0;
}
body.light .razz-intro p { color:rgba(0,0,0,0.45); }

/* User question bubble */
.razz-user-q {
  display:flex; justify-content:flex-end; margin-bottom:16px;
}
.razz-user-q span {
  display:inline-block; max-width:85%;
  background:var(--orange); color:#fff; border-radius:16px 16px 4px 16px;
  padding:10px 16px; font-family:'Nunito',sans-serif; font-size:0.82rem;
}

/* Loading */
.razz-loading {
  display:flex; align-items:center; gap:8px;
  color:rgba(255,255,255,0.4); margin-bottom:16px;
}
body.light .razz-loading { color:rgba(0,0,0,0.4); }
.razz-loading span { font-family:'Nunito',sans-serif; font-size:0.82rem; }
.razz-spinner {
  width:16px; height:16px; border:2px solid rgba(255,255,255,0.15);
  border-top-color:var(--orange); border-radius:50%;
  animation:razz-spin 0.8s linear infinite;
}
body.light .razz-spinner { border-color:rgba(0,0,0,0.1); border-top-color:var(--orange); }
@keyframes razz-spin { to { transform:rotate(360deg); } }

/* Answer box */
.razz-answer-box {
  border-radius:16px 16px 16px 4px;
  background:rgba(255,255,255,0.04); border:1px solid var(--line);
  padding:16px; margin-bottom:16px;
}
body.light .razz-answer-box { background:rgba(0,0,0,0.02); border-color:rgba(0,0,0,0.08); }
.razz-answer-label {
  display:flex; align-items:center; gap:6px; margin-bottom:12px;
}
.razz-answer-label svg { width:14px; height:14px; color:var(--orange); }
.razz-answer-label span {
  font-family:'Nunito',sans-serif; font-size:0.72rem; font-weight:700;
  color:var(--orange); text-transform:uppercase; letter-spacing:0.06em;
}
.razz-answer-text {
  font-family:'Nunito',sans-serif; font-size:0.85rem; line-height:1.7;
  color:var(--white); white-space:pre-line;
}
body.light .razz-answer-text { color:#1a1a1a; }

/* Related links */
.razz-related-title {
  font-family:'Nunito',sans-serif; font-size:0.68rem; font-weight:700;
  color:rgba(255,255,255,0.3); text-transform:uppercase; letter-spacing:0.08em;
  margin-bottom:8px;
}
body.light .razz-related-title { color:rgba(0,0,0,0.3); }
.razz-related-links { display:flex; flex-direction:column; gap:4px; margin-bottom:16px; }
.razz-related-link {
  display:flex; align-items:center; gap:8px;
  font-family:'Nunito',sans-serif; font-size:0.82rem;
  color:var(--white); text-decoration:none; padding:6px 0;
  transition:color 0.2s;
}
.razz-related-link:hover { color:var(--orange); }
.razz-related-link svg { width:14px; height:14px; color:rgba(255,255,255,0.3); flex-shrink:0; }
.razz-related-link:hover svg { color:var(--orange); }
body.light .razz-related-link { color:#1a1a1a; }
body.light .razz-related-link svg { color:rgba(0,0,0,0.3); }
body.light .razz-related-link:hover { color:var(--orange); }
body.light .razz-related-link:hover svg { color:var(--orange); }

/* Follow-up questions */
.razz-followup-title {
  font-family:'Nunito',sans-serif; font-size:0.68rem; font-weight:700;
  color:rgba(255,255,255,0.3); text-transform:uppercase; letter-spacing:0.08em;
  margin-bottom:8px;
}
body.light .razz-followup-title { color:rgba(0,0,0,0.3); }
.razz-followups { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.razz-followup-btn {
  text-align:left; font-family:'Nunito',sans-serif; font-size:0.75rem;
  padding:6px 12px; border-radius:8px;
  border:1px solid var(--line); background:none;
  color:var(--white); cursor:pointer; transition:border-color 0.2s, background 0.2s;
}
.razz-followup-btn:hover { border-color:var(--orange); background:rgba(244,162,97,0.06); }
body.light .razz-followup-btn {
  border-color:rgba(0,0,0,0.1); color:#1a1a1a;
}
body.light .razz-followup-btn:hover { border-color:var(--orange); background:rgba(244,162,97,0.06); }

/* Contact Jordan CTA */
.razz-contact-cta {
  border-radius:12px; background:rgba(255,92,26,0.08); border:1px solid rgba(255,92,26,0.2);
  padding:16px; margin-bottom:16px;
}
.razz-contact-title {
  font-family:'Nunito',sans-serif; font-size:0.75rem; font-weight:800;
  text-transform:uppercase; letter-spacing:0.08em;
  color:var(--orange); margin-bottom:12px;
}
.razz-contact-buttons { display:flex; gap:8px; }
.razz-contact-btn {
  flex:1; display:flex; align-items:center; justify-content:center; gap:8px;
  font-family:'Nunito',sans-serif; font-size:0.78rem; font-weight:700;
  padding:12px 14px; border-radius:8px; text-decoration:none;
  transition:background 0.2s, border-color 0.2s; cursor:pointer;
}
.razz-contact-btn svg { width:16px; height:16px; flex-shrink:0; }
.razz-contact-book {
  background:var(--orange); color:#fff; border:1px solid var(--orange);
}
.razz-contact-book:hover { background:#e04a0e; border-color:#e04a0e; }
.razz-contact-email {
  background:none; color:var(--white); border:1px solid var(--line);
}
.razz-contact-email:hover { border-color:var(--orange); color:var(--orange); }
body.light .razz-contact-cta { background:rgba(255,92,26,0.05); border-color:rgba(255,92,26,0.15); }
body.light .razz-contact-email { color:#0C0C0C; border-color:rgba(0,0,0,0.12); }
body.light .razz-contact-email:hover { border-color:var(--orange); color:var(--orange); }

/* Ask another */
.razz-reset {
  font-family:'Nunito',sans-serif; font-size:0.82rem; font-weight:700;
  color:var(--orange); background:none; border:none; cursor:pointer;
  transition:opacity 0.2s;
}
.razz-reset:hover { opacity:0.7; }

/* Disclaimer */
.razz-disclaimer {
  padding:8px 24px; border-top:1px solid var(--line); flex-shrink:0;
  display:flex; align-items:flex-start; gap:8px;
}
body.light .razz-disclaimer { border-top-color:rgba(0,0,0,0.08); }
.razz-disclaimer svg { width:14px; height:14px; color:rgba(255,255,255,0.3); flex-shrink:0; margin-top:2px; }
body.light .razz-disclaimer svg { color:rgba(0,0,0,0.3); }
.razz-disclaimer p {
  font-family:'Nunito',sans-serif; font-size:0.72rem; color:rgba(255,255,255,0.3); margin:0; line-height:1.5;
}
body.light .razz-disclaimer p { color:rgba(0,0,0,0.35); }

/* Input area */
.razz-input-area {
  padding:16px; border-top:1px solid var(--line); flex-shrink:0;
}
body.light .razz-input-area { border-top-color:rgba(0,0,0,0.08); }
.razz-form { display:flex; align-items:center; gap:8px; }
.razz-input {
  flex:1; background:rgba(255,255,255,0.06); border:none; border-radius:12px;
  padding:12px 16px; font-family:'Nunito',sans-serif; font-size:0.85rem;
  color:var(--white); outline:none; transition:box-shadow 0.2s;
}
.razz-input::placeholder { color:rgba(255,255,255,0.25); }
.razz-input:focus { box-shadow:0 0 0 2px rgba(244,162,97,0.3); }
body.light .razz-input { background:rgba(0,0,0,0.04); color:#0C0C0C; }
body.light .razz-input::placeholder { color:rgba(0,0,0,0.3); }
.razz-send {
  width:44px; height:44px; border-radius:12px; border:none;
  background:var(--orange); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background 0.2s, opacity 0.2s; flex-shrink:0;
}
.razz-send:hover { background:#e04a0e; }
.razz-send:disabled { opacity:0.4; cursor:default; }
.razz-send:disabled:hover { background:var(--orange); }
.razz-send svg { width:16px; height:16px; color:#fff; }

/* Hide on mobile nav */
@media (max-width:768px) {
  .razz-trigger { display:none !important; }
  .razz-panel { max-width:100%; }
}