/* ═══════════════════════════════════════════════════════════════════════
   huck-widget.css — the floating "Ask Huck" chat bubble, one definition.

   WHY THIS FILE EXISTS
   Each page carried its own copy of the widget's CSS and they had drifted:
   find-services capped the message area at 260px, plan at 240px, and
   forecast.css had no cap at all. On forecast the panel therefore grew with
   every reply until it ran off the top of the screen — and because the
   bubble is position:fixed, you couldn't scroll to reach it, so the page
   felt frozen.

   Loaded AFTER the per-page stylesheet on every page that shows the widget,
   so it overrides whatever that page happened to declare.

   The layout: the panel is a flex column with a hard max-height. Header and
   input row are fixed; only the message list scrolls. overscroll-behavior
   stops that scroll from chaining into the page behind it.
   ═══════════════════════════════════════════════════════════════════════ */

/* Never let the bubble itself exceed the viewport. dvh accounts for mobile
   browser chrome that appears and disappears as you scroll. */
#huck-bubble{
  max-height: calc(100dvh - 24px);
  max-height: calc(100vh - 24px);   /* fallback for older engines */
}

#huck-chat{
  /* the panel must be a flex column for the inner list to scroll */
  flex-direction: column;
  max-height: min(70dvh, 540px);
  max-height: min(70vh, 540px);     /* fallback */
  overflow: hidden;                  /* corners stay rounded while inner scrolls */
}
#huck-chat.open{ display: flex; }

/* Header and footer hold their size; the middle takes the slack. */
.huck-chat-head,
.huck-footer{ flex: 0 0 auto; }

.huck-body-chat{
  flex: 1 1 auto;
  /* min-height:0 is the part everyone forgets — without it a flex child
     refuses to shrink below its content, so overflow-y never engages. */
  min-height: 0;
  max-height: none;                  /* drop the per-page 240/260px caps */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;      /* don't scroll the page behind it */
}

/* Long answers from Huck shouldn't blow out the width either. */
.huck-msg{
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Phones: give the panel more of the screen, and keep it clear of the
   home-indicator area. */
@media (max-width: 600px){
  #huck-chat{
    max-height: min(62dvh, 460px);
    max-height: min(62vh, 460px);
    width: min(320px, calc(100vw - 24px));
  }
  #huck-bubble{
    bottom: calc(16px + env(safe-area-inset-bottom));
    right: calc(16px + env(safe-area-inset-right));
  }
}

/* Short/landscape screens: don't let it swallow the whole view. */
@media (max-height: 520px){
  #huck-chat{ max-height: 72dvh; max-height: 72vh; }
}

/* ── Nightly-email signup bar ────────────────────────────────────────────
   Bottom-pinned, dismissible, appears after the reader has engaged. Sits in
   this shared stylesheet so it's defined once rather than per page.
   Kept clear of the Huck bubble on the right. */
#hb-email-bar{
  position:fixed; left:0; right:0; bottom:0; z-index:9998;
  background:#12261e; border-top:3px solid #c96b1a;
  transform:translateY(110%); transition:transform .28s ease;
  padding-bottom:env(safe-area-inset-bottom);
  box-shadow:0 -6px 28px rgba(0,0,0,.22);
}
#hb-email-bar.hb-eb-in{ transform:translateY(0); }
.hb-eb-inner{
  max-width:1100px; margin:0 auto; padding:14px 18px;
  display:flex; align-items:center; gap:18px; justify-content:space-between;
}
.hb-eb-text{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.hb-eb-text strong{
  font-family:Georgia,'Times New Roman',serif; font-size:1rem; color:#fff; font-weight:700; line-height:1.3;
}
.hb-eb-text span{ font-size:.8rem; color:rgba(255,255,255,.65); }
.hb-eb-actions{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.hb-eb-btn{
  background:#c96b1a; color:#fff; text-decoration:none; font-weight:700; font-size:.88rem;
  padding:11px 22px; border-radius:6px; white-space:nowrap; transition:background .15s;
}
.hb-eb-btn:hover{ background:#b05c14; }
.hb-eb-close{
  background:none; border:none; color:rgba(255,255,255,.5); font-size:1.5rem;
  line-height:1; cursor:pointer; padding:2px 8px;
}
.hb-eb-close:hover{ color:#fff; }

@media (max-width:760px){
  /* leave room for the Huck bubble bottom-right */
  .hb-eb-inner{ padding:12px 14px 12px 16px; gap:10px; }
  .hb-eb-text strong{ font-size:.88rem; }
  .hb-eb-text span{ font-size:.72rem; }
  .hb-eb-btn{ padding:10px 14px; font-size:.8rem; }
  /* Only lift the bubble once the email bar is actually showing. It lifted
     unconditionally, which on a phone parked it on top of the homepage's
     "Plan My Hunt" button — the primary call to action — for the first 12
     seconds of every visit. */
  body.hb-eb-visible #huck-bubble{ bottom:calc(92px + env(safe-area-inset-bottom)); }
}
