/* Honestfix help chat (site/src/help, public/help-chat.js). Colours and type from design.css :root. */
.hfc{--hfc-blue:var(--blue,#00509d);--hfc-navy:var(--navy,#102e4f);--hfc-ink:var(--ink,#182d40);--hfc-muted:var(--muted,#58697a);--hfc-line:var(--line,#dfe5eb);--hfc-pale:var(--pale,#e9f2fb);font:15px/1.5 'DM Sans',Arial,sans-serif;color:var(--hfc-ink)}
.hfc-float{pointer-events:none}
.hfc-float>*{pointer-events:auto}
.hfc-float{position:fixed;right:20px;bottom:20px;z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
body:has(.hf-sticky) .hfc-float{bottom:calc(92px + env(safe-area-inset-bottom,0px))}
/* While the cookie bar is up, the consent script sets --hf-consent-h (its height) on <html>: the
   launcher sits above the bar, or above the vendor page's sticky contact bar, whichever is higher. */
.hf-consent-open .hfc-float{bottom:max(20px,calc(var(--hf-consent-h,0px) + 12px))}
/* The vendor page's contact bar now sits on top of the cookie bar (production.css, M3), so the launcher clears both. */
.hf-consent-open body:has(.hf-sticky) .hfc-float{bottom:calc(var(--hf-consent-h,0px) + 84px + env(safe-area-inset-bottom,0px))}
.hf-consent-open .hfc-float .hfc-panel{height:min(600px,calc(100vh - 120px - var(--hf-consent-h,0px)))}
.hfc-launch{display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:0 20px 0 16px;border-radius:999px;background:var(--hfc-navy);color:#fff;text-decoration:none;font:700 15px/1 Manrope,Arial,sans-serif;box-shadow:0 8px 24px #102e4f33,0 1px 3px #102e4f26;transition:transform .15s,background .15s}
.hfc-launch:hover{background:var(--hfc-blue);transform:translateY(-1px)}
.hfc-launch svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}
.hfc-launch:focus-visible{outline:3px solid #fdc500;outline-offset:3px}
.hfc-float.is-open .hfc-launch{background:var(--hfc-blue)}
.hfc-panel{display:flex;flex-direction:column;background:#fff;border:1px solid var(--hfc-line);border-radius:18px;overflow:hidden}
.hfc-panel[hidden]{display:none}
.hfc-float .hfc-panel{order:-1;width:380px;max-width:calc(100vw - 32px);height:min(600px,calc(100vh - 120px));box-shadow:0 18px 48px #102e4f2e,0 2px 6px #102e4f1a}
body:has(.hf-sticky) .hfc-float .hfc-panel{height:min(600px,calc(100vh - 200px))}
.hfc-inline .hfc-panel{min-height:420px;max-height:640px}
.hfc-head{display:flex;align-items:center;gap:12px;padding:16px 16px 16px 18px;background:var(--hfc-navy);color:#fff}
.hfc-mark{width:24px;height:26px;flex:none;display:grid;grid-template-columns:6px 6px 6px;gap:2px;align-items:center;transform:rotate(-8deg)}
.hfc-mark i{height:22px;background:#4f8fe0;border-radius:2px}
.hfc-mark i:nth-child(2){height:11px;background:#fdc500}
.hfc-mark i:last-child{align-self:end}
.hfc-titles{display:grid;min-width:0;flex:1}
.hfc-titles strong{font:750 16px/1.3 Manrope,Arial,sans-serif;letter-spacing:-.2px}
.hfc-titles span{font-size:13px;color:#c9d8e8}
.hfc-close{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;color:#fff;background:transparent;border:0;cursor:pointer}
.hfc-close:hover{background:#ffffff1f}
.hfc-close svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.hfc-close:focus-visible{outline:3px solid #fdc500;outline-offset:1px}
.hfc-log{flex:1;overflow-y:auto;padding:18px 16px 8px;display:flex;flex-direction:column;gap:8px;background:#f7f9fb;overscroll-behavior:contain}
.hfc-log:focus{outline:none}
.hfc-msg{margin:0;max-width:86%;padding:10px 14px;border-radius:16px;font-size:15px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.hfc-bot{align-self:flex-start;background:#fff;border:1px solid var(--hfc-line);border-bottom-left-radius:6px;color:var(--hfc-ink)}
.hfc-me{align-self:flex-end;background:var(--hfc-blue);color:#fff;border-bottom-right-radius:6px}
.hfc-link{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:12px;background:var(--hfc-pale);color:var(--hfc-blue);font-weight:650;font-size:15px;text-decoration:none;border:1px solid #c9dcf0;max-width:86%}
.hfc-link:after{content:'\2192'}
.hfc-link:hover{border-color:var(--hfc-blue)}
.hfc-controls{border-top:1px solid var(--hfc-line);padding:12px 14px 14px;background:#fff;max-height:58%;overflow-y:auto}
.hfc-options{display:flex;flex-wrap:wrap;gap:8px}
.hfc-opt{min-height:40px;padding:8px 14px;border-radius:999px;border:1.5px solid var(--hfc-blue);background:#fff;color:var(--hfc-blue);font:650 15px/1.3 'DM Sans',Arial,sans-serif;cursor:pointer;text-align:left}
.hfc-opt:hover{background:var(--hfc-pale)}
.hfc-opt:focus-visible,.hfc-send:focus-visible,.hfc-back:focus-visible,.hfc-form input:focus-visible,.hfc-form select:focus-visible,.hfc-form textarea:focus-visible{outline:3px solid var(--hfc-blue);outline-offset:2px}
.hfc-form{display:grid;gap:6px}
.hfc-form label{font-size:13px;font-weight:650;color:var(--hfc-ink);margin-top:4px}
.hfc-form input,.hfc-form select,.hfc-form textarea{width:100%;box-sizing:border-box;min-height:42px;padding:9px 12px;border:1px solid #c5d0db;border-radius:10px;font:15px/1.4 'DM Sans',Arial,sans-serif;color:var(--hfc-ink);background:#fff}
.hfc-form textarea{resize:vertical;min-height:84px}
.hfc-send{justify-self:start;margin-top:6px;min-height:42px;padding:0 18px;border:0;border-radius:10px;background:var(--hfc-blue);color:#fff;font:650 14px 'DM Sans',Arial,sans-serif;cursor:pointer}
.hfc-send:disabled{opacity:.6;cursor:wait}
.hfc-back{margin-top:10px;background:none;border:0;padding:4px 0;color:var(--hfc-muted);font:600 13px 'DM Sans',Arial,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.hfc-error{margin:0;color:#9b1c1c;font-size:13px}
.hfc-error:empty{display:none}
.hfc-hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media(max-width:520px){
.hfc-float{right:12px;bottom:12px;left:12px;align-items:flex-end}
.hfc-float.is-open{top:12px}
.hfc-float .hfc-panel{width:100%;max-width:none;height:auto;flex:1;min-height:0}
body:has(.hf-sticky) .hfc-float{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
body:has(.hf-sticky) .hfc-float .hfc-panel{height:auto}
.hf-consent-open .hfc-float{bottom:max(12px,calc(var(--hf-consent-h,0px) + 12px))}
.hf-consent-open body:has(.hf-sticky) .hfc-float{bottom:calc(var(--hf-consent-h,0px) + 80px + env(safe-area-inset-bottom,0px))}
.hf-consent-open .hfc-float .hfc-panel{height:auto}
.hfc-launch{min-height:48px;padding:0 16px 0 14px}
.hfc-msg{max-width:92%}
}
@media(prefers-reduced-motion:reduce){.hfc-launch{transition:none}}
/* An address shown as plain text with a Copy button (CopyEmail). */
.hf-copy-email{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.hf-copy-text{font-weight:650;user-select:all;-webkit-user-select:all;overflow-wrap:anywhere}
.hf-copy-btn{min-height:30px;padding:2px 10px;border-radius:8px;border:1px solid #c9dcf0;background:#edf3fe;color:var(--blue,#00509d);font:650 12px 'DM Sans',Arial,sans-serif;cursor:pointer}
.hf-copy-btn:focus-visible{outline:3px solid var(--blue,#00509d);outline-offset:2px}
/* "Typing" bubble shown before each reply (help-chat.js pump) */
.hfc-typing{display:flex;gap:5px;align-items:center;padding:14px 16px}
.hfc-typing span{width:7px;height:7px;border-radius:50%;background:var(--hfc-muted,#58697a);opacity:.35;animation:hfc-dot 1.1s infinite ease-in-out}
.hfc-typing span:nth-child(2){animation-delay:.15s}.hfc-typing span:nth-child(3){animation-delay:.3s}
@keyframes hfc-dot{0%,80%,100%{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.hfc-typing span{animation:none;opacity:.6}}

/* ---- Mobile pass, 3 October 2026 ---- */
/* M2: room under the last content for the launcher, so it never sits on top of the footer's last lines.
   Launcher 52px (48px on phones) + its 20px (12px) offset + a gap; plus the cookie bar while it shows. */
body:has(.hfc-float) .site-footer{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
.hf-consent-open body:has(.hfc-float) .site-footer{padding-bottom:calc(84px + var(--hf-consent-h,0px) + env(safe-area-inset-bottom,0px))}
/* On the vendor page the body already keeps room for the contact bar; the footer adds the launcher's height. */
body:has(.hf-sticky):has(.hfc-float) .site-footer{padding-bottom:64px}
.hf-consent-open body:has(.hf-sticky):has(.hfc-float) .site-footer{padding-bottom:64px}
/* M21: "Back to the start" stays in reach at the bottom of a long form. */
.hfc-controls .hfc-back{position:sticky;bottom:-14px;z-index:1;display:flex;align-items:center;width:calc(100% + 28px);margin:10px -14px -14px;padding:6px 14px 10px;background:#fff;box-sizing:border-box}
@media(max-width:700px){
 /* M9: 44px controls on phones. */
 .hfc-close{width:44px;height:44px}
 .hfc-opt{min-height:44px}
 .hfc-send{min-height:44px}
 .hfc-controls .hfc-back{min-height:44px}
 .hf-copy-btn{min-height:44px;padding:2px 14px}
}

/* Phones (6 Oct 2026): the launcher is a round icon button, 52px, so it no longer covers text near the bottom
   right of the first screen; "Help" stays as its accessible name. */
@media(max-width:480px){.hfc-float:not(.is-open) .hfc-launch{width:52px;min-height:52px;padding:0;justify-content:center;gap:0}.hfc-float:not(.is-open) .hfc-launch span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.hfc-float:not(.is-open) .hfc-launch svg{width:22px;height:22px}}
/* The feedback line at the end of short pages stays clear of the round Help button on phones. */
@media(max-width:480px){.fb-bar .fb-legal{padding-left:72px;padding-right:72px}}